/* Shared surfaces designed from the supplied foundation. No legacy stylesheet underneath. */ :where(html.ysa-connected-preview) :is(dialog,.ysa-account-switch-dialog,.ysa-sticky-note-dialog){max-width:calc(100vw - 32px);max-height:calc(100dvh - 64px);margin:auto;padding:28px;border:1px solid var(--ysa-line);border-radius:24px;background:var(--ysa-sheet);color:var(--ysa-ink);box-shadow:var(--ysa-shadow-menu);overflow:auto} :where(html.ysa-connected-preview) dialog:not([open]){display:none} :where(html.ysa-connected-preview) dialog::backdrop{background:rgba(14,37,35,.42);backdrop-filter:blur(4px)} :where(html.ysa-connected-preview) :is(dialog h2,.ysa-account-switch-head h2,.ysa-sticky-note-dialog h2){font-size:24px} :where(html.ysa-connected-preview) :is(dialog p,.ysa-account-switch-empty){color:var(--ysa-text-3);font-size:13.5px;line-height:1.6} :where(html.ysa-connected-preview) .popup{position:fixed;inset:0;z-index:var(--ysa-popup-z);display:none;padding:72px 24px 32px;overflow:auto;background:rgba(14,37,35,.4);backdrop-filter:blur(4px)} /* Native popup opening still supplies a legacy top offset; keep its backdrop edge-to-edge. */ html.ysa-connected-preview body>#popup:not(.conversation){top:0!important} html.ysa-connected-preview body>.loading:is(.ysa-popup-loading,.ysa-popup-backdrop){inset:0;border-radius:0} /* Match the white loading surface and the ready drawer from the first frame. */ html.ysa-connected-preview body>#popup.user{left:0;right:0;bottom:0;width:auto;max-width:none;height:auto;padding:0;border-radius:0;background:transparent;backdrop-filter:none;box-shadow:none;overflow:hidden} html.ysa-connected-preview body>#popup.user>.popup_content{position:absolute;top:var(--ysa-sheet-top);right:24px;bottom:24px;width:72vw;min-height:auto;margin:0 0 0 auto;padding:32px;border:0;border-radius:24px;background:var(--ysa-sheet);box-shadow:-12px 0 36px rgba(14,37,35,.1);overflow:auto;overscroll-behavior:contain;animation:none} html.ysa-connected-preview body>#popup.user>.popup_content:empty{visibility:hidden} html.ysa-connected-preview body:has(>#popup.user)>.loading:is(.ysa-popup-loading,.ysa-popup-backdrop){inset:var(--ysa-sheet-top) 24px 24px auto;width:72vw;border:0;border-radius:24px;background:var(--ysa-sheet);backdrop-filter:none;box-shadow:-12px 0 36px rgba(14,37,35,.1)} html.ysa-connected-preview body>#popup.user>.popup_close_button{top:calc(var(--ysa-sheet-top) + 12px);right:36px;width:44px;height:44px;min-height:44px;padding:0;border:0;border-radius:0;background:transparent;color:#000;font-size:18px;line-height:1;box-shadow:none} html.ysa-connected-preview body>#popup.user>.popup_close_button:is(:hover,:active){background:transparent;color:#000;box-shadow:none} html.ysa-connected-preview body>#popup.user>.popup_close_button:focus-visible{outline:2px solid var(--ysa-ink);outline-offset:0;border-radius:8px} html.ysa-connected-preview body>#popup.user>.popup_close_button :is(i,svg){width:18px;height:18px;font-size:18px;line-height:1} html.ysa-connected-preview body>#popup.user .ysa-user-edit-header{padding-right:44px} @media(max-width:720px){ html.ysa-connected-preview body>#popup.user>.popup_content{right:12px;bottom:106px;width:calc(100% - 24px);padding:72px 16px 24px} html.ysa-connected-preview body:has(>#popup.user)>.loading:is(.ysa-popup-loading,.ysa-popup-backdrop){right:12px;bottom:106px;width:calc(100% - 24px)} html.ysa-connected-preview body>#popup.user>.popup_close_button{right:24px} } :where(html.ysa-connected-preview) .popup_content{position:relative;width:min(920px,100%);min-height:120px;margin:auto;padding:32px;border:1px solid var(--ysa-line);border-radius:24px;background:var(--ysa-sheet);box-shadow:var(--ysa-shadow-menu)} :where(html.ysa-connected-preview) .popup_close_button{position:fixed;z-index:1;top:24px;right:24px;display:grid;place-items:center;width:36px;height:36px;border:1px solid var(--ysa-line);border-radius:50%;background:var(--ysa-sheet);color:var(--ysa-ink);cursor:pointer} :where(html.ysa-connected-preview) .popup_content>h1{margin-bottom:24px} :where(html.ysa-connected-preview) .ysa-command-popup{padding-top:15vh} :where(html.ysa-connected-preview) .ysa-command-popup .popup_content{width:min(600px,100%);padding:8px;border-radius:20px} :where(html.ysa-connected-preview) .ysa-command-head{display:flex;align-items:center;gap:12px;padding:8px 14px 16px;border-bottom:1px solid var(--ysa-line);color:var(--ysa-text-muted)} :where(html.ysa-connected-preview) .ysa-command-head input{flex:1;min-height:42px;padding:8px 0;border:0;background:transparent;font-size:14px} :where(html.ysa-connected-preview) .ysa-command-kbd{padding:3px 6px;border:1px solid var(--ysa-line);border-radius:5px;font-size:10px} :where(html.ysa-connected-preview) .ysa-command-list{display:flex;flex-direction:column;gap:3px;max-height:50vh;padding:8px 0;overflow:auto} :where(html.ysa-connected-preview) .ysa-command-list button{justify-content:flex-start;gap:12px;min-height:42px;padding:10px 14px;border:0;border-radius:10px;background:transparent;text-align:left;font-size:13px;font-weight:400} :where(html.ysa-connected-preview) .ysa-command-list button:is(:hover,.is-active){background:var(--ysa-sage-soft);color:var(--ysa-ink)} :where(html.ysa-connected-preview) .ysa-command-empty{padding:28px 16px;text-align:center;color:var(--ysa-text-muted);font-size:13px} :where(html.ysa-connected-preview) .ysa-account-switch-modal{position:fixed;inset:0;z-index:3000;display:none;place-items:center;padding:24px} :where(html.ysa-connected-preview) .ysa-account-switch-modal.is-open{display:grid} :where(html.ysa-connected-preview) .ysa-account-switch-backdrop{position:absolute;inset:0;background:rgba(14,37,35,.42);backdrop-filter:blur(4px)} :where(html.ysa-connected-preview) .ysa-account-switch-dialog{position:relative;width:560px;margin:0;padding:24px} :where(html.ysa-connected-preview) .ysa-account-switch-head{display:flex;align-items:flex-start;gap:20px;justify-content:space-between;margin-bottom:24px} :where(html.ysa-connected-preview) .ysa-account-switch-head>div>span{display:block;margin-bottom:6px;color:var(--ysa-text-muted);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase} :where(html.ysa-connected-preview) .ysa-account-switch-head>button{width:34px;height:34px;min-height:34px;padding:0} :where(html.ysa-connected-preview) .ysa-account-switch-search{display:flex;align-items:center;gap:10px;margin-bottom:16px;padding:0 12px;border:1px solid var(--ysa-line-strong);border-radius:10px} :where(html.ysa-connected-preview) .ysa-account-switch-search input{border:0;padding-left:0;background:transparent} :where(html.ysa-connected-preview) .ysa-account-switch-current{display:flex;align-items:center;gap:12px;margin-bottom:12px;padding:14px;border-radius:12px;background:var(--ysa-sage-soft)} :where(html.ysa-connected-preview) .ysa-account-switch-mark{display:grid;place-items:center;flex-shrink:0;width:36px;height:36px;border-radius:10px;background:var(--ysa-sage);font-size:14px;font-weight:600} :where(html.ysa-connected-preview) :is(.ysa-account-switch-current strong,.ysa-account-switch-text strong){display:block;font-size:13px;font-weight:600} :where(html.ysa-connected-preview) :is(.ysa-account-switch-current em,.ysa-account-switch-text em){display:block;margin-top:3px;color:var(--ysa-text-muted);font-size:11px;font-style:normal;font-weight:400;overflow-wrap:anywhere} :where(html.ysa-connected-preview) .ysa-account-switch-list{display:flex;flex-direction:column;gap:3px;max-height:45vh;overflow:auto} :where(html.ysa-connected-preview) .ysa-account-switch-option{display:flex;align-items:center;gap:12px;justify-content:flex-start;width:100%;min-height:60px;padding:12px;border:0;background:transparent;text-align:left} :where(html.ysa-connected-preview) .ysa-account-switch-option:is(:hover,.is-current){background:var(--ysa-canvas)} :where(html.ysa-connected-preview) .ysa-account-switch-text{flex:1;min-width:0} :where(html.ysa-connected-preview) .ysa-account-switch-id{display:none} :where(html.ysa-connected-preview) .ysa-account-switch-empty{padding:24px;text-align:center} /* Public authentication shares the new type, colors and control dimensions. */ :where(html.ysa-connected-preview) .ysa-auth{display:grid;grid-template-columns:minmax(360px,.88fr) minmax(0,1.12fr);min-height:calc(100dvh - 20px);margin-top:20px;padding:0 20px 20px;gap:20px} :where(html.ysa-connected-preview) .ysa-auth-brand{display:flex;flex-direction:column;justify-content:space-between;min-height:680px;padding:44px 48px;border-radius:28px;background:var(--ysa-ink);color:var(--ysa-on-ink)} :where(html.ysa-connected-preview) .ysa-auth-brand-logo{content:url('/img/youshouldask-logo-wide-light.svg');width:210px;height:36px;object-fit:contain;object-position:left center} :where(html.ysa-connected-preview) .ysa-auth-brand-copy{max-width:430px;margin:56px 0 40px} :where(html.ysa-connected-preview) .ysa-auth-eyebrow{display:block;margin-bottom:18px;color:var(--ysa-sage);font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase} :where(html.ysa-connected-preview) .ysa-auth-brand h1{color:var(--ysa-on-ink);font-size:46px;line-height:1.13;letter-spacing:-.025em} :where(html.ysa-connected-preview) .ysa-auth-brand h1>span{display:block;color:var(--ysa-lime);font-family:var(--ysa-font-serif);font-style:italic} :where(html.ysa-connected-preview) .ysa-auth-brand-copy>p{margin-top:20px;color:var(--ysa-on-ink-muted);font-size:14px;line-height:1.7} :where(html.ysa-connected-preview) .ysa-auth-benefits{display:flex;flex-direction:column;gap:20px;margin:32px 0 0;padding:0;list-style:none} :where(html.ysa-connected-preview) .ysa-auth-benefits li{display:flex;align-items:center;gap:14px} :where(html.ysa-connected-preview) .ysa-auth-benefit-icon{display:grid;place-items:center;flex-shrink:0;width:38px;height:38px;border:1px solid var(--ysa-on-ink-line);border-radius:11px;background:var(--ysa-on-ink-fill);color:var(--ysa-sage);font-size:19px} :where(html.ysa-connected-preview) .ysa-auth-benefits strong{display:block;font-size:13px;font-weight:500} :where(html.ysa-connected-preview) .ysa-auth-benefits li>div>span{display:block;margin-top:3px;color:var(--ysa-on-ink-muted);font-size:11.5px;line-height:1.5} :where(html.ysa-connected-preview) .ysa-auth-quote{padding-top:24px;border-top:1px solid var(--ysa-on-ink-line)} :where(html.ysa-connected-preview) .ysa-auth-quote p{font:italic 24px/1.4 var(--ysa-font-serif);color:var(--ysa-sage)} :where(html.ysa-connected-preview) .ysa-auth-quote cite{display:block;margin-top:12px;color:var(--ysa-on-ink-faint);font-size:11px;font-style:normal} :where(html.ysa-connected-preview) .ysa-auth-main{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0;padding:76px 32px 24px;border-radius:28px;background:var(--ysa-sheet)} :where(html.ysa-connected-preview) .ysa-auth-language{position:absolute;top:24px;right:28px;margin:0} :where(html.ysa-connected-preview) .ysa-auth-language label{position:relative;display:flex;align-items:center} :where(html.ysa-connected-preview) .ysa-auth-language select{width:auto;min-height:32px;padding:5px 27px 5px 10px;border-color:var(--ysa-line);font-size:12px;appearance:none} :where(html.ysa-connected-preview) .ysa-auth-language i{position:absolute;right:9px;font-size:10px;pointer-events:none} :where(html.ysa-connected-preview) .ysa-auth-card{width:100%;max-width:400px} :where(html.ysa-connected-preview) .ysa-auth-heading{margin-bottom:28px} :where(html.ysa-connected-preview) .ysa-auth-heading h2{font-size:30px;line-height:1.2} :where(html.ysa-connected-preview) :is(.ysa-auth-heading p,.twofa_message){margin-top:12px;color:var(--ysa-text-muted);font-size:13px;line-height:1.6} :where(html.ysa-connected-preview) .ysa-auth-form{display:flex;flex-direction:column;gap:18px;margin:0} :where(html.ysa-connected-preview) .ysa-auth-field{display:flex;flex-direction:column;gap:7px;min-width:0;font-size:12px;font-weight:500} :where(html.ysa-connected-preview) .wrap-input100{position:relative;display:block;width:100%} :where(html.ysa-connected-preview) .ysa-auth input.input100{height:44px;min-height:44px;padding:11px 13px;border-color:var(--ysa-line-strong);border-radius:10px;background:var(--ysa-sheet);font-size:14px} :where(html.ysa-connected-preview) .ysa-auth-input-with-icon input.input100{padding-left:40px;padding-right:44px} :where(html.ysa-connected-preview) .ysa-auth-input-icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--ysa-text-muted);font-size:16px;pointer-events:none} :where(html.ysa-connected-preview) .ysa-auth .btn-show-pass{position:absolute;z-index:1;right:5px;top:5px;width:34px;height:34px;min-height:34px;padding:0;border:0;background:transparent;color:var(--ysa-text-muted);font-size:16px} :where(html.ysa-connected-preview) .ysa-auth .btn-show-pass+input{padding-right:44px} :where(html.ysa-connected-preview) .ysa-auth-inline-link{color:var(--ysa-ink);font-size:12px;text-decoration:underline;text-decoration-color:var(--ysa-sage);text-underline-offset:4px} :where(html.ysa-connected-preview) .ysa-auth-forgot{align-self:flex-end;margin-top:-7px} :where(html.ysa-connected-preview) .login100-form-btn{display:flex;gap:12px;width:100%;height:44px;min-height:44px;border-color:var(--ysa-ink);background:var(--ysa-ink);color:var(--ysa-on-ink);font-size:13px} :where(html.ysa-connected-preview) .login100-form-btn:hover{background:#1B3634} :where(html.ysa-connected-preview) .login100-form-btn>i{font-size:16px} :where(html.ysa-connected-preview) .login100-form-bgbtn{display:none} :where(html.ysa-connected-preview) .ysa-auth-form-message{font-size:12px;line-height:1.6;color:var(--ysa-danger-text)} :where(html.ysa-connected-preview) .ysa-auth-form-message:empty{display:none} :where(html.ysa-connected-preview) .ysa-auth-form-message--success{color:var(--ysa-ok)} :where(html.ysa-connected-preview) .alert-validate input{border-color:var(--ysa-danger-text);background:var(--ysa-danger-soft)} :where(html.ysa-connected-preview) .alert-validate::after{content:attr(data-validate);display:block;margin-top:6px;color:var(--ysa-danger-text);font-size:11px;line-height:1.45} :where(html.ysa-connected-preview) .ysa-auth-divider{display:flex;align-items:center;gap:12px;margin-top:2px;color:var(--ysa-text-faint);font-size:11px;text-align:center} :where(html.ysa-connected-preview) .ysa-auth-divider::before,:where(html.ysa-connected-preview) .ysa-auth-divider::after{content:'';height:1px;flex:1;background:var(--ysa-line)} :where(html.ysa-connected-preview) .ysa-auth-secondary-action{display:flex;align-items:center;justify-content:center;min-height:42px;border:1px solid var(--ysa-line);border-radius:10px;background:var(--ysa-sheet);font-size:13px;font-weight:500} :where(html.ysa-connected-preview) .ysa-auth-footer{display:flex;justify-content:center;flex-wrap:wrap;align-items:center;gap:8px;margin-top:40px;color:var(--ysa-text-muted);font-size:10.5px} :where(html.ysa-connected-preview) .ysa-cookie-settings-link{display:inline;padding:0;min-height:0;border:0;border-radius:0;background:transparent;color:inherit;font-size:inherit;font-weight:400;text-decoration:underline;text-underline-offset:3px} :where(html.ysa-connected-preview) .ysa-auth-icon{display:grid;place-items:center;width:52px;height:52px;margin-bottom:24px;border-radius:16px;background:var(--ysa-sage-soft);color:var(--ysa-ink);font-size:24px} :where(html.ysa-connected-preview) .twofa-method-switch{display:flex;padding:4px;border:1px solid var(--ysa-line);border-radius:12px;background:var(--ysa-canvas)} :where(html.ysa-connected-preview) .twofa_method_button{flex:1;min-height:34px;padding:7px 10px;border:0;border-radius:8px;background:transparent;font-size:11px;font-weight:500} :where(html.ysa-connected-preview) .twofa_method_button.active{background:var(--ysa-sheet);box-shadow:var(--ysa-shadow-card)} :where(html.ysa-connected-preview) .code-input{display:flex;justify-content:space-between;gap:8px;margin:6px 0} :where(html.ysa-connected-preview) .code-input input.code{flex:1;min-width:0;width:45px;height:56px;min-height:56px;padding:8px 0;border:1px solid var(--ysa-line-strong);border-radius:10px;background:var(--ysa-canvas-tint);text-align:center;font-size:24px;font-weight:500;caret-color:var(--ysa-ink)} :where(html.ysa-connected-preview) .validate-2fa-form[data-code-length='4'] .code:nth-child(n+5){display:none} :where(html.ysa-connected-preview) .ysa-auth-switch-copy{margin-top:4px;color:var(--ysa-text-muted);font-size:12px;text-align:center} :where(html.ysa-connected-preview) .ysa-auth-scrim{position:fixed;inset:0;z-index:2500;width:100%;height:100%;border:0;border-radius:0;background:rgba(14,37,35,.42);backdrop-filter:blur(4px)} :where(html.ysa-connected-preview) .ysa-auth-signup-panel{position:fixed;z-index:2501;top:16px;right:16px;bottom:16px;width:min(520px,calc(100vw - 32px));padding:28px 32px;border:1px solid var(--ysa-line);border-radius:24px;background:var(--ysa-sheet);box-shadow:var(--ysa-shadow-menu);overflow:auto;visibility:hidden;opacity:0;pointer-events:none;transform:translateX(8px);transition:transform .22s ease,opacity .22s ease,visibility .22s} :where(html.ysa-connected-preview) .ysa-auth-signup-panel--open{visibility:visible;opacity:1;pointer-events:auto;transform:translateX(0)} :where(html.ysa-connected-preview) .ysa-auth-panel-topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:36px} :where(html.ysa-connected-preview) .ysa-auth-panel-logo{width:160px;height:28px;object-fit:contain} :where(html.ysa-connected-preview) .ysa-auth-panel-close{width:34px;height:34px;min-height:34px;padding:0;background:var(--ysa-canvas)} :where(html.ysa-connected-preview) .ysa-auth-panel-heading{margin-bottom:28px} :where(html.ysa-connected-preview) .ysa-auth-panel-heading h2{font-size:30px} :where(html.ysa-connected-preview) .ysa-auth-panel-heading p{margin-top:10px;color:var(--ysa-text-muted);font-size:13px} :where(html.ysa-connected-preview) .ysa-auth-name-row{display:grid;grid-template-columns:1fr 1fr;gap:14px} :where(html.ysa-connected-preview) .ysa-auth-consent{display:flex;align-items:flex-start;gap:10px;color:var(--ysa-text-3);font-size:11px;line-height:1.65} :where(html.ysa-connected-preview) .ysa-auth-consent input{margin-top:2px} /* The shipped transition remains decorative after interaction is released. */ :where(html.ysa-connected-preview.ysa-auth-arriving:not(.ysa-auth-mounted)) body>:not(script):not(style):not(link):not(template){visibility:hidden} :where(html.ysa-connected-preview.ysa-auth-arriving:not(.ysa-auth-revealing)){overflow:hidden} :where(html.ysa-connected-preview.ysa-auth-arriving:not(.ysa-auth-revealing)) body{overflow:hidden} :where(html.ysa-connected-preview.ysa-auth-arriving:not(.ysa-auth-revealing)) [data-ysa-auth-cover]{pointer-events:auto} :where(html.ysa-connected-preview) body>.ysa-auth{animation:ysa-blank-auth-enter 1.8s ease both} @keyframes ysa-blank-auth-enter{from{opacity:0;filter:blur(18px)}to{opacity:1;filter:none}} :where(html.ysa-connected-preview) [data-ysa-auth-cover]{position:fixed;z-index:6000;inset:0;opacity:1;background:var(--ysa-canvas);pointer-events:none;transition:opacity 2.4s cubic-bezier(.2,.6,.2,1)} :where(html.ysa-connected-preview) [data-ysa-auth-veil]{position:fixed;z-index:5999;inset:0;background:rgba(244,244,241,.1);backdrop-filter:blur(18px);pointer-events:none;transition:backdrop-filter 2s ease-in .65s,opacity 2.7s ease} :where(html.ysa-connected-preview) [data-ysa-auth-status]{position:fixed;z-index:6001;left:50%;bottom:28px;transform:translateX(-50%);padding:10px 16px;border:1px solid var(--ysa-line);border-radius:999px;background:var(--ysa-sheet);color:var(--ysa-text-muted);font-size:12px;white-space:nowrap;opacity:1;pointer-events:none;transition:opacity .6s ease} :where(html.ysa-connected-preview.ysa-auth-revealing) [data-ysa-auth-cover]{opacity:0} :where(html.ysa-connected-preview.ysa-auth-revealing) [data-ysa-auth-veil]{backdrop-filter:blur(0);opacity:0} :where(html.ysa-connected-preview.ysa-auth-revealing) [data-ysa-auth-status]{opacity:0} /* Remaining public recovery screens retain their real forms and validation. */ :where(html.ysa-connected-preview) .ysa-auth:has(.ysa-auth-signup-panel--open){animation:none;filter:none} :where(html.ysa-connected-preview) .login_avatar{width:180px;height:32px;margin:28px auto 0;background:url('/img/youshouldask-logo-wide.svg') center/contain no-repeat} :where(html.ysa-connected-preview) .limiter{display:grid;place-items:start center;min-height:calc(100dvh - 100px);padding:32px 20px} :where(html.ysa-connected-preview) .container-login100{width:min(460px,100%);padding:32px;border:1px solid var(--ysa-line);border-radius:24px;background:var(--ysa-sheet);box-shadow:var(--ysa-shadow-sheet)} :where(html.ysa-connected-preview) .wrap-login100{width:100%} :where(html.ysa-connected-preview) .limiter .login100-form{display:flex;flex-direction:column;gap:18px} :where(html.ysa-connected-preview) .login100-form-title{display:block;font:400 28px/1.2 var(--ysa-font-heading)} :where(html.ysa-connected-preview) .login100-form-title-small{display:block;color:var(--ysa-text-muted);font-size:14px} :where(html.ysa-connected-preview) .limiter .input100{height:44px;min-height:44px;font-size:14px} :where(html.ysa-connected-preview) .focus-input100[data-placeholder]{display:block;margin-top:6px;color:var(--ysa-text-muted);font-size:11px} :where(html.ysa-connected-preview) .focus-input100[data-placeholder]::after{content:attr(data-placeholder)} :where(html.ysa-connected-preview) .limiter :is(.txt1,.txt2){font-size:12px;color:var(--ysa-text-muted)} :where(html.ysa-connected-preview) .limiter :is(.text-center,.reset_message){text-align:center;font-size:13px;line-height:1.6} /* QR, sign-out and cookie controls use their existing dialogs and hidden states. */ :where(html.ysa-connected-preview) .ysa-qr-login{margin-top:28px;padding:20px;border:1px solid var(--ysa-line);border-radius:18px;background:var(--ysa-canvas-tint)} :where(html.ysa-connected-preview) .ysa-qr-login-copy h3{font-size:18px} :where(html.ysa-connected-preview) .ysa-qr-login-copy p{margin-top:7px;color:var(--ysa-text-muted);font-size:11px;line-height:1.6} :where(html.ysa-connected-preview) .ysa-qr-login-content{display:flex;align-items:center;gap:18px;margin-top:16px} :where(html.ysa-connected-preview) .ysa-qr-login-image{position:relative;display:grid;place-items:center;flex:0 0 112px;width:112px;height:112px;padding:4px;border:1px solid var(--ysa-line);border-radius:10px;background:var(--ysa-sheet)} :where(html.ysa-connected-preview) .ysa-qr-login-image img{display:block;width:100%;height:100%;object-fit:contain;image-rendering:pixelated} :where(html.ysa-connected-preview) [data-qr-placeholder]{display:grid;place-items:center;width:100%;height:100%;color:var(--ysa-text-disabled);font-size:38px} :where(html.ysa-connected-preview) .ysa-qr-login-spinner{position:absolute;inset:0;display:grid;place-items:center;border-radius:10px;background:rgba(255,255,255,.85)} :where(html.ysa-connected-preview) .ysa-qr-login-spinner::after{content:'';width:24px;height:24px;border:2px solid var(--ysa-sage-soft);border-top-color:var(--ysa-ink);border-radius:50%;animation:ysa-blank-spin .8s linear infinite} :where(html.ysa-connected-preview) .ysa-qr-login-details{flex:1;min-width:0;color:var(--ysa-text-3);font-size:11px;line-height:1.6} :where(html.ysa-connected-preview) .ysa-qr-login-details button{margin-top:12px;min-height:32px;padding:6px 9px;font-size:11px} :where(html.ysa-connected-preview) .ysa-qr-dialog{width:480px} :where(html.ysa-connected-preview) .ysa-qr-dialog-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:22px} :where(html.ysa-connected-preview) .ysa-qr-dialog-close{width:34px;height:34px;min-height:34px;padding:0;background:var(--ysa-canvas);font-size:24px;font-weight:400} :where(html.ysa-connected-preview) .ysa-qr-camera{position:relative;min-height:180px;margin-top:20px;overflow:hidden;border-radius:16px;background:var(--ysa-ink)} :where(html.ysa-connected-preview) .ysa-qr-camera video{display:block;width:100%;height:auto;object-fit:cover} :where(html.ysa-connected-preview) .ysa-qr-zoom{display:flex;align-items:center;gap:12px;margin-top:16px;font-size:12px} :where(html.ysa-connected-preview) .ysa-qr-zoom label{font-size:12px} :where(html.ysa-connected-preview) .ysa-qr-zoom input{flex:1} :where(html.ysa-connected-preview) .ysa-qr-dialog-security{margin-top:18px;padding:12px 14px;border-radius:10px;background:var(--ysa-sage-soft);font-size:12px} :where(html.ysa-connected-preview) .ysa-qr-dialog-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:24px} :where(html.ysa-connected-preview) .ysa-qr-dialog-actions .ysa-qr-button:not(.ysa-qr-button-secondary){border-color:var(--ysa-ink);background:var(--ysa-ink);color:var(--ysa-on-ink)} :where(html.ysa-connected-preview) .ysa-qr-identity{margin-top:20px;border:1px solid var(--ysa-line);border-radius:12px;overflow:hidden} :where(html.ysa-connected-preview) .ysa-qr-identity>div{display:grid;grid-template-columns:90px minmax(0,1fr);gap:16px;padding:12px 14px;border-bottom:1px solid var(--ysa-line);font-size:13px} :where(html.ysa-connected-preview) .ysa-qr-identity>div:last-child{border:0} :where(html.ysa-connected-preview) .ysa-qr-identity dt{color:var(--ysa-text-muted);font-size:11px} :where(html.ysa-connected-preview) .ysa-qr-identity dd{overflow-wrap:anywhere} :where(html.ysa-connected-preview) .ysa-qr-success{display:grid;place-items:center;margin:18px auto;width:72px;height:72px} :where(html.ysa-connected-preview) .ysa-qr-success svg{width:72px;height:72px;fill:var(--ysa-sage-soft);stroke:var(--ysa-ok);stroke-width:3;stroke-linecap:round;stroke-linejoin:round} :where(html.ysa-connected-preview) :is(.ysa-qr-dialog-error,.ysa-logout-error){margin-top:16px;padding:12px;border:1px solid var(--ysa-danger-line);border-radius:10px;background:var(--ysa-danger-soft);color:var(--ysa-danger-text);font-size:12px} :where(html.ysa-connected-preview) .ysa-logout-dialog{width:420px;padding:30px} :where(html.ysa-connected-preview) .ysa-logout-icon{display:grid;place-items:center;width:50px;height:50px;margin-bottom:20px;border-radius:15px;background:var(--ysa-sage-soft)} :where(html.ysa-connected-preview) .ysa-logout-icon svg{width:25px;height:25px} :where(html.ysa-connected-preview) .ysa-logout-dialog>p{margin-top:12px} :where(html.ysa-connected-preview) .ysa-logout-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:28px} :where(html.ysa-connected-preview) .ysa-logout-confirm{border-color:var(--ysa-ink);background:var(--ysa-ink);color:var(--ysa-on-ink)} :where(html.ysa-connected-preview) .ysa-cookie-banner{position:fixed;z-index:5000;left:24px;bottom:24px;width:410px;max-width:calc(100vw - 48px);padding:24px;border:1px solid var(--ysa-line);border-radius:22px;background:var(--ysa-sheet);box-shadow:var(--ysa-shadow-menu)} :where(html.ysa-connected-preview) .ysa-cookie-heading{display:flex;align-items:center;gap:12px;margin-bottom:12px} :where(html.ysa-connected-preview) .ysa-cookie-icon{display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:var(--ysa-sage-soft)} :where(html.ysa-connected-preview) .ysa-cookie-heading h2{font-size:22px} :where(html.ysa-connected-preview) .ysa-cookie-banner>p{color:var(--ysa-text-3);font-size:12px;line-height:1.65} :where(html.ysa-connected-preview) .ysa-cookie-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px} :where(html.ysa-connected-preview) .ysa-cookie-button{flex:1;font-size:12px} :where(html.ysa-connected-preview) .ysa-cookie-primary{border-color:var(--ysa-ink);background:var(--ysa-ink);color:var(--ysa-on-ink)} :where(html.ysa-connected-preview) .ysa-cookie-links{display:flex;gap:16px;margin-top:16px;font-size:10.5px;color:var(--ysa-text-muted)} :where(html.ysa-connected-preview) .ysa-cookie-preferences{width:620px;padding:0;overflow:hidden} :where(html.ysa-connected-preview) .ysa-cookie-preferences[open]{display:flex;flex-direction:column} :where(html.ysa-connected-preview) .ysa-cookie-preferences-head{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px;border-bottom:1px solid var(--ysa-line)} :where(html.ysa-connected-preview) .ysa-cookie-close{width:34px;height:34px;min-height:34px;padding:0;border-color:transparent;background:var(--ysa-canvas)} :where(html.ysa-connected-preview) .ysa-cookie-preferences-body{flex:1 1 auto;min-height:0;padding:24px;overflow-y:auto;overscroll-behavior:contain} :where(html.ysa-connected-preview) .ysa-cookie-preferences-body>p{margin-bottom:16px} :where(html.ysa-connected-preview) .ysa-cookie-category{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:18px 0;border-top:1px solid var(--ysa-line)} :where(html.ysa-connected-preview) :is(.ysa-cookie-category h3,.ysa-cookie-category strong){display:block;font:500 13px var(--ysa-font-sans)} :where(html.ysa-connected-preview) :is(.ysa-cookie-category p,.ysa-cookie-category-description){display:block;max-width:390px;margin-top:6px;color:var(--ysa-text-muted);font-size:11px;line-height:1.6} :where(html.ysa-connected-preview) .ysa-cookie-required{flex-shrink:0;color:var(--ysa-ok);font-size:10px} :where(html.ysa-connected-preview) .ysa-cookie-toggle{appearance:none;flex:0 0 34px;width:34px;height:20px;border:0;border-radius:999px;background:var(--ysa-text-disabled);cursor:pointer} :where(html.ysa-connected-preview) .ysa-cookie-toggle::before{content:'';display:block;width:16px;height:16px;margin:2px;border-radius:50%;background:var(--ysa-sheet);transition:transform .15s ease} :where(html.ysa-connected-preview) .ysa-cookie-toggle:checked{background:var(--ysa-ink)} :where(html.ysa-connected-preview) .ysa-cookie-toggle:checked::before{transform:translateX(14px)} :where(html.ysa-connected-preview) .ysa-cookie-privacy{font-size:11px;color:var(--ysa-text-muted);text-decoration:underline} :where(html.ysa-connected-preview) .ysa-cookie-preferences-actions{flex:0 0 auto;margin:0;padding:20px 24px;border-top:1px solid var(--ysa-line);background:var(--ysa-canvas-tint)} :where(html.ysa-connected-preview) .ysa-cookie-preferences-actions .ysa-cookie-button{flex:1 1 0;min-width:0;min-height:44px;height:auto;white-space:normal} :where(html.ysa-connected-preview) .ysa-cookie-status{position:fixed;z-index:6000;left:50%;bottom:24px;transform:translateX(-50%);padding:12px 18px;border-radius:12px;background:var(--ysa-ink);color:var(--ysa-on-ink);font-size:12px} :where(html.ysa-connected-preview) .ysa-cookie-status:empty{display:none} /* Workspace activity uses one quiet popover, including loading, failure and empty states. */ :where(html.ysa-connected-preview) .ysa-workspace-notifications{position:relative} :where(html.ysa-connected-preview) .ysa-workspace-notifications-popover{position:absolute;z-index:1500;top:calc(100% + 12px);right:0;width:430px;max-width:calc(100vw - 32px);padding:20px;border:1px solid var(--ysa-line);border-radius:20px;background:var(--ysa-sheet);color:var(--ysa-ink);box-shadow:var(--ysa-shadow-menu)} :where(html.ysa-connected-preview) .ysa-workspace-notifications-head{display:flex;align-items:center;gap:8px} :where(html.ysa-connected-preview) .ysa-workspace-notifications-head>div{flex:1} :where(html.ysa-connected-preview) .ysa-workspace-notifications-head>div>span{display:block;margin-bottom:5px;color:var(--ysa-text-muted);font-size:10px;letter-spacing:.08em;text-transform:uppercase} :where(html.ysa-connected-preview) .ysa-workspace-notifications-head h2{font-size:21px} :where(html.ysa-connected-preview) .ysa-workspace-notifications-close{width:28px;height:28px;min-height:28px;padding:0;border:0;background:var(--ysa-canvas)} :where(html.ysa-connected-preview) .ysa-workspace-notifications-summary{margin-top:16px;color:var(--ysa-text-muted);font-size:12px} :where(html.ysa-connected-preview) .ysa-workspace-notifications-list{max-height:min(460px,60dvh);margin:16px -8px 0;overflow:auto} :where(html.ysa-connected-preview) .ysa-workspace-notification-item{display:grid;grid-template-columns:32px 1fr;align-items:start;gap:10px;width:100%;padding:12px 8px;border:0;border-bottom:1px solid var(--ysa-line-soft);border-radius:10px;background:transparent;text-align:left} :where(html.ysa-connected-preview) .ysa-workspace-notification-icon{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:var(--ysa-caution-soft);color:var(--ysa-caution-text);font-size:16px} :where(html.ysa-connected-preview) .ysa-workspace-notification-item.is-danger .ysa-workspace-notification-icon{background:var(--ysa-danger-soft);color:var(--ysa-danger-text)} :where(html.ysa-connected-preview) .ysa-workspace-notification-title{display:flex;align-items:center;justify-content:space-between;gap:8px} :where(html.ysa-connected-preview) .ysa-workspace-notification-title strong{font-size:12px;font-weight:600} :where(html.ysa-connected-preview) .ysa-workspace-notification-title em{padding:3px 6px;border-radius:6px;background:var(--ysa-canvas);font-size:9px;font-style:normal;font-weight:400} :where(html.ysa-connected-preview) .ysa-workspace-notification-description{display:block;margin-top:5px;color:var(--ysa-text-muted);font-size:11px;line-height:1.6;font-weight:400} :where(html.ysa-connected-preview) .ysa-workspace-notification-action{grid-column:2;display:flex;align-items:center;gap:6px;color:var(--ysa-ink);font-size:10px;font-weight:500} :where(html.ysa-connected-preview) .ysa-workspace-notifications-empty{display:flex;align-items:center;flex-direction:column;gap:10px;padding:28px 16px;text-align:center} :where(html.ysa-connected-preview) .ysa-workspace-notifications-empty-icon{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--ysa-sage-soft);color:var(--ysa-ok)} :where(html.ysa-connected-preview) .ysa-workspace-notifications-empty strong{font-size:13px;font-weight:500} :where(html.ysa-connected-preview) .ysa-workspace-notifications-empty>span:last-child{color:var(--ysa-text-muted);font-size:11px;line-height:1.6} :where(html.ysa-connected-preview) .ysa-workspace-notifications-settings{justify-content:space-between;width:100%;margin-top:12px;font-size:11px} /* Existing post-it model, drag coordinates and visibility remain authoritative. */ :where(html.ysa-connected-preview) #ysa-sticky-note-count{top:-1px;right:-1px;width:10px;min-width:10px;height:10px;padding:0;border:0;font-size:0} :where(html.ysa-connected-preview) .ysa-sticky-notes-layer{position:absolute;inset:0;z-index:900;pointer-events:none;overflow:visible} :where(html.ysa-connected-preview) .ysa-sticky-note{position:absolute;display:flex;flex-direction:column;width:260px;min-height:224px;padding:18px 18px 14px;border:0;border-radius:4px 4px 14px 4px;background:var(--sticky-color,#FFF0B3);color:var(--sticky-ink,#3A3418);box-shadow:0 16px 30px -19px rgba(14,37,35,.18),0 4px 8px rgba(14,37,35,.08);pointer-events:auto;touch-action:pan-y;transform:rotate(-.6deg);transform-origin:50% 25%;transition:transform 160ms var(--ysa-motion-ease),box-shadow 160ms var(--ysa-motion-ease)} :where(html.ysa-connected-preview) .ysa-sticky-note:nth-child(even){transform:rotate(.5deg)} :where(html.ysa-connected-preview) .ysa-sticky-note:is(:hover,.is-dragging){transform:translateY(-2px) rotate(0);box-shadow:0 16px 30px -19px rgba(14,37,35,.23),0 4px 8px rgba(14,37,35,.1)} :where(html.ysa-connected-preview) .ysa-sticky-note.is-dragging{z-index:2} :where(html.ysa-connected-preview) .ysa-sticky-note::after{content:"";position:absolute;bottom:0;right:0;width:22px;height:22px;border-radius:10px 0 14px 0;background:linear-gradient(135deg,rgba(255,255,255,.6) 0% 49%,rgba(0,0,0,.08) 50% 100%);pointer-events:none} :where(html.ysa-connected-preview) .is-yellow{--sticky-color:#FFF0B3;--sticky-ink:#3A3418} :where(html.ysa-connected-preview) .is-pink{--sticky-color:#FFD6E2;--sticky-ink:#4A2433} :where(html.ysa-connected-preview) .is-blue{--sticky-color:#CFE9F7;--sticky-ink:#18354A} :where(html.ysa-connected-preview) .is-green{--sticky-color:#D9F0C9;--sticky-ink:#223D21} :where(html.ysa-connected-preview) .is-purple{--sticky-color:#E4D8FF;--sticky-ink:#352648} :where(html.ysa-connected-preview) .is-orange{--sticky-color:#FFDBB8;--sticky-ink:#4A2C14} :where(html.ysa-connected-preview) .ysa-sticky-note-head{display:flex;align-items:center;gap:6px;min-height:28px;margin-bottom:8px;font-family:var(--ysa-font-sans)} :where(html.ysa-connected-preview) .ysa-sticky-note.is-editable .ysa-sticky-note-head{cursor:grab} :where(html.ysa-connected-preview) .ysa-sticky-note.is-dragging .ysa-sticky-note-head{cursor:grabbing} :where(html.ysa-connected-preview) .ysa-sticky-note-head:focus-visible{outline:2px solid currentColor;outline-offset:3px;border-radius:4px} :where(html.ysa-connected-preview) .ysa-sticky-note-drag-dots{flex-shrink:0;width:14px;height:10px;background:radial-gradient(circle,currentColor 1.3px,transparent 1.5px) 0 0/5px 5px;opacity:.55} :where(html.ysa-connected-preview) .ysa-sticky-note-privacy{display:flex;justify-content:flex-end;align-items:center;gap:5px;flex:1;min-width:0;color:inherit;font-size:10.5px;font-weight:650;white-space:nowrap;opacity:.7} :where(html.ysa-connected-preview) .ysa-sticky-note-action{display:grid;place-items:center;flex-shrink:0;width:28px;height:28px;min-height:28px;padding:0;border:0;border-radius:9px;background:rgba(255,255,255,.55);color:inherit;font-size:11px} :where(html.ysa-connected-preview) .ysa-sticky-note-action:hover{background:rgba(255,255,255,.7)} :where(html.ysa-connected-preview) .ysa-sticky-note-title{margin:0 0 8px;color:inherit;font:700 31px/1.02 "Caveat",cursive;letter-spacing:0;overflow-wrap:anywhere} :where(html.ysa-connected-preview) .ysa-sticky-note-description{max-height:132px;overflow:auto;margin:0;padding-right:2px;white-space:pre-wrap;overflow-wrap:anywhere;color:inherit;font:500 18.5px/1.3 "Caveat",cursive;letter-spacing:0;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,currentColor 25%,transparent) transparent;overscroll-behavior:contain} :where(html.ysa-connected-preview) .ysa-sticky-note-footer{display:flex;align-items:center;gap:8px;margin-top:auto;padding-top:12px;border-top:1px solid color-mix(in srgb,currentColor 13%,transparent);font-family:var(--ysa-font-sans)} :where(html.ysa-connected-preview) .ysa-sticky-note-description+.ysa-sticky-note-footer{margin-top:14px} :where(html.ysa-connected-preview) .ysa-sticky-note-author-avatar{display:grid;place-items:center;flex-shrink:0;width:26px;height:26px;overflow:hidden;border-radius:50%;background:color-mix(in srgb,var(--sticky-ink) 82%,white);color:white;font-size:10px;font-weight:700} :where(html.ysa-connected-preview) .ysa-sticky-note-author-avatar img{width:100%;height:100%;object-fit:cover} :where(html.ysa-connected-preview) .ysa-sticky-note-author{flex:1;min-width:0;font-size:10.5px;line-height:1.3} :where(html.ysa-connected-preview) .ysa-sticky-note-author strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11.5px;font-weight:700} :where(html.ysa-connected-preview) .ysa-sticky-note-author>span{display:block;font-size:10px;color:inherit;opacity:.7} :where(html.ysa-connected-preview) .ysa-sticky-note-metrics{display:flex;flex-direction:column;flex-shrink:0;gap:4px;color:inherit;font-size:9.5px;font-weight:600;opacity:.8} :where(html.ysa-connected-preview) .ysa-sticky-note-metrics>span{display:flex;align-items:center;gap:4px} :where(html.ysa-connected-preview) .ysa-sticky-note-delete-confirm{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;justify-content:center;gap:16px;padding:18px;border-radius:inherit;background:var(--sticky-color);color:inherit;font-family:var(--ysa-font-sans);text-align:center;font-size:14px} :where(html.ysa-connected-preview) .ysa-sticky-note-delete-icon{display:grid;place-items:center;align-self:center;width:34px;height:34px;border-radius:10px;background:rgba(255,255,255,.45);color:inherit;font-size:16px} :where(html.ysa-connected-preview) .ysa-sticky-note-delete-confirm>div{display:flex;justify-content:center;gap:8px} :where(html.ysa-connected-preview) .ysa-sticky-note-delete-confirm button{flex:1;min-height:38px;padding:7px 8px;border:1px solid color-mix(in srgb,currentColor 18%,transparent);border-radius:9px;background:rgba(255,255,255,.25);color:inherit;font:600 11px var(--ysa-font-sans)} :where(html.ysa-connected-preview) .ysa-sticky-note-delete-confirm .ysa-sticky-note-delete-submit{border-color:var(--sticky-ink);background:var(--sticky-ink);color:var(--sticky-color)} :where(html.ysa-connected-preview) .ysa-sticky-note.is-deleting .ysa-sticky-note-delete-confirm{cursor:progress} :where(html.ysa-connected-preview) .ysa-sticky-note-dialog-backdrop{position:fixed;z-index:3000;inset:0;display:grid;place-items:center;padding:24px;background:rgba(14,37,35,.36);backdrop-filter:blur(6px)} :where(html.ysa-connected-preview) .ysa-sticky-note-dialog{width:540px;max-height:calc(100dvh - 48px);margin:0;padding:0;border:0;border-radius:22px;background:var(--ysa-sheet);font-family:var(--ysa-font-sans);overflow:auto} :where(html.ysa-connected-preview) .ysa-sticky-note-dialog>header{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin:0;padding:24px 24px 16px;border-bottom:1px solid var(--ysa-line)} :where(html.ysa-connected-preview) .ysa-sticky-note-dialog-kicker{display:block;margin-bottom:5px;color:var(--ysa-text-muted);font-size:10px;font-weight:650;letter-spacing:.1em;text-transform:uppercase} :where(html.ysa-connected-preview) .ysa-sticky-note-dialog-close{width:32px;height:32px;min-height:32px;padding:0;border:0;border-radius:9px;background:var(--ysa-canvas);color:var(--ysa-text-muted)} :where(html.ysa-connected-preview) #ysa-sticky-note-form{display:flex;flex-direction:column;gap:18px;padding:20px 24px 24px} :where(html.ysa-connected-preview) .ysa-sticky-note-field{display:flex;flex-direction:column;gap:7px;font-size:11px;font-weight:650} :where(html.ysa-connected-preview) .ysa-sticky-note-field :is(input,textarea){width:100%;min-height:40px;padding:10px 12px;border:1px solid #D7DBD7;border-radius:10px;background:#FAFBFA;color:var(--ysa-ink);font:400 13px/1.45 var(--ysa-font-sans)} :where(html.ysa-connected-preview) .ysa-sticky-note-field input{height:40px;font-weight:500} :where(html.ysa-connected-preview) .ysa-sticky-note-field textarea{height:116px;min-height:116px;resize:vertical} :where(html.ysa-connected-preview) .ysa-sticky-note-field :is(input,textarea):focus{border-color:var(--ysa-ink);outline:2px solid color-mix(in srgb,var(--ysa-lime) 70%,transparent);outline-offset:1px;box-shadow:none} :where(html.ysa-connected-preview) .ysa-sticky-note-character-count{align-self:flex-end;color:var(--ysa-text-muted);font:400 10px/1.2 var(--ysa-font-sans)} :where(html.ysa-connected-preview) :is(.ysa-sticky-note-colors,.ysa-sticky-note-visibility){display:flex;flex-wrap:wrap;gap:8px;padding:0;border:0;border-radius:0} :where(html.ysa-connected-preview) :is(.ysa-sticky-note-colors,.ysa-sticky-note-visibility)>legend{margin-bottom:9px;padding:0;font:650 11px var(--ysa-font-sans)} :where(html.ysa-connected-preview) .ysa-sticky-note-colors label{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;flex:0 0 36px;cursor:pointer} :where(html.ysa-connected-preview) .ysa-sticky-note-colors input{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer} :where(html.ysa-connected-preview) .ysa-sticky-note-colors label>span{display:block;width:34px;height:34px;border:2px solid var(--ysa-sheet);border-radius:9px;background:var(--sticky-color);box-shadow:0 0 0 1px #D7DBD7,0 2px 3px rgba(14,37,35,.06)} :where(html.ysa-connected-preview) .ysa-sticky-note-colors input:checked+span{box-shadow:0 0 0 2px var(--ysa-ink),0 3px 5px rgba(14,37,35,.1);transform:rotate(-3deg)} :where(html.ysa-connected-preview) .ysa-sticky-note-colors input:focus-visible+span{outline:2px solid var(--ysa-lime);outline-offset:4px} :where(html.ysa-connected-preview) .ysa-sticky-note-colors em{font-size:9px;font-style:normal;font-weight:400;color:var(--ysa-text-muted)} :where(html.ysa-connected-preview) .ysa-sticky-note-visibility label{position:relative;display:block;flex:1;min-width:110px;min-height:96px;padding:12px;border:1px solid #D7DBD7;border-radius:12px;background:#FAFBFA;cursor:pointer} :where(html.ysa-connected-preview) .ysa-sticky-note-visibility label:has(input:checked){border-color:var(--ysa-ink);background:var(--ysa-canvas);box-shadow:0 0 0 2px rgba(14,37,35,.06)} :where(html.ysa-connected-preview) .ysa-sticky-note-visibility label:has(input:focus-visible){outline:2px solid var(--ysa-lime);outline-offset:2px} :where(html.ysa-connected-preview) .ysa-sticky-note-visibility input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer} :where(html.ysa-connected-preview) .ysa-sticky-note-visibility label>span{display:grid;grid-template-columns:14px minmax(0,1fr);gap:4px 8px;font-size:12px;line-height:1.3} :where(html.ysa-connected-preview) .ysa-sticky-note-visibility label>span>i{align-self:center;color:var(--ysa-text-muted);font-size:11px} :where(html.ysa-connected-preview) .ysa-sticky-note-visibility strong{grid-column:2;margin:0;font-weight:650} :where(html.ysa-connected-preview) .ysa-sticky-note-visibility small{grid-column:2;display:block;margin:0;color:var(--ysa-text-muted);font-size:10px;font-weight:400;line-height:1.35} :where(html.ysa-connected-preview) .ysa-sticky-note-form-error{padding:10px;border-radius:9px;background:var(--ysa-danger-soft);font-size:12px} :where(html.ysa-connected-preview) .ysa-sticky-note-dialog footer{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:10px;margin-top:0;padding-top:18px;border-top:1px solid var(--ysa-line)} :where(html.ysa-connected-preview) .ysa-sticky-note-page-count{flex:1;min-width:170px;color:var(--ysa-text-muted);font-size:11px;line-height:1.4} :where(html.ysa-connected-preview) .ysa-sticky-note-dialog footer button{min-height:40px;padding:10px 14px;border-radius:9px;font:650 12px var(--ysa-font-sans)} :where(html.ysa-connected-preview) .ysa-sticky-note-primary{border-color:var(--ysa-ink);background:var(--ysa-ink);color:var(--ysa-on-ink)} :where(html.ysa-connected-preview) .ysa-sticky-note-toast{position:fixed;z-index:5000;bottom:28px;left:50%;transform:translateX(-50%);max-width:calc(100vw - 32px);padding:12px 18px;border:1px solid var(--ysa-line);border-radius:999px;background:var(--ysa-ink);color:var(--ysa-on-ink);box-shadow:var(--ysa-shadow-popover);font:600 12px var(--ysa-font-sans);text-align:center} /* Color editor: functional color planes and swatches, with the same new dialog frame. */ :where(html.ysa-connected-preview) .ysa-color-editor{position:relative;display:inline-flex;align-items:center;gap:8px;max-width:100%} :where(html.ysa-connected-preview) .ysa-color-editor__trigger{justify-content:flex-start;gap:10px;min-width:90px;min-height:38px;padding:7px 10px;font-size:12px} :where(html.ysa-connected-preview) .ysa-color-editor__swatch-shell{display:block;width:22px;height:22px;overflow:hidden;border:1px solid var(--ysa-line);border-radius:6px;background:repeating-conic-gradient(var(--ysa-line) 0 25%,white 0 50%) 0/8px 8px} :where(html.ysa-connected-preview) .ysa-color-editor__swatch{display:block;width:100%;height:100%;background:var(--ysa-current-color,transparent)} :where(html.ysa-connected-preview) .ysa-color-editor__swatch.is-empty{background:transparent} :where(html.ysa-connected-preview) .ysa-color-editor__chevron{margin-left:auto;font-size:10px;color:var(--ysa-text-muted)} :where(html.ysa-connected-preview) .ysa-color-editor__source{position:absolute;width:1px;height:1px;min-height:0;padding:0;border:0;opacity:0;pointer-events:none} :where(html.ysa-connected-preview) .ysa-color-popover{position:fixed;z-index:4500;width:330px;max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);overflow:auto;padding:16px;border:1px solid var(--ysa-line);border-radius:18px;background:var(--ysa-sheet);box-shadow:var(--ysa-shadow-menu)} :where(html.ysa-connected-preview) .ysa-color-popover__header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:16px} :where(html.ysa-connected-preview) .ysa-color-popover__header strong{font-size:14px;font-weight:600} :where(html.ysa-connected-preview) .ysa-color-popover__hint{display:block;margin-top:4px;color:var(--ysa-text-muted);font-size:10px} :where(html.ysa-connected-preview) .ysa-color-popover__icon-button{width:26px;height:26px;min-height:26px;padding:0;border:0;background:var(--ysa-canvas);font-size:20px;font-weight:400} :where(html.ysa-connected-preview) .ysa-color-popover__comparison{display:flex;align-items:center;gap:14px;margin-bottom:14px} :where(html.ysa-connected-preview) .ysa-color-popover__comparison-item{display:flex;align-items:center;gap:7px;font-size:10px;color:var(--ysa-text-muted)} :where(html.ysa-connected-preview) .ysa-color-popover__comparison-item i{display:block;width:24px;height:24px;border:1px solid var(--ysa-line);border-radius:6px;background:var(--ysa-current-color,transparent)} :where(html.ysa-connected-preview) .ysa-color-popover__eyedropper{margin-left:auto;min-height:28px;padding:4px 7px;font-size:9px} :where(html.ysa-connected-preview) .ysa-color-popover__plane{position:relative;display:block;height:154px;margin-bottom:16px;border-radius:10px;touch-action:none;overflow:hidden;cursor:crosshair;background:var(--ysa-picker-hue,red)} :where(html.ysa-connected-preview) :is(.ysa-color-popover__plane-white,.ysa-color-popover__plane-black){position:absolute;inset:0;pointer-events:none} :where(html.ysa-connected-preview) .ysa-color-popover__plane-white{background:linear-gradient(90deg,white,transparent)} :where(html.ysa-connected-preview) .ysa-color-popover__plane-black{background:linear-gradient(0deg,black,transparent)} :where(html.ysa-connected-preview) .ysa-color-popover__plane-thumb{position:absolute;display:block;width:13px;height:13px;transform:translate(-50%,-50%);border:2px solid white;border-radius:50%;box-shadow:0 0 0 1px rgba(14,37,35,.5);pointer-events:none;background:var(--ysa-thumb-color,transparent)} :where(html.ysa-connected-preview) .ysa-color-popover__slider-row{display:grid;grid-template-columns:42px 1fr 34px;align-items:center;gap:8px;margin-top:10px;font-size:10px;color:var(--ysa-text-muted)} :where(html.ysa-connected-preview) .ysa-color-popover__slider-row input{display:block;width:100%;height:12px;min-height:0;margin:0;padding:0;border:0;border-radius:999px;appearance:none;cursor:pointer;accent-color:white} :where(html.ysa-connected-preview) .ysa-color-popover input[data-role=alpha]{background:linear-gradient(90deg,transparent,var(--ysa-picker-color))} :where(html.ysa-connected-preview) .ysa-color-popover input[data-role=hue]{background:linear-gradient(90deg,red,#ff0,#0f0,#0ff,#00f,#f0f,red)} :where(html.ysa-connected-preview) .ysa-color-popover input[type=range]::-webkit-slider-thumb{appearance:none;width:14px;height:14px;border:2px solid white;border-radius:50%;background:transparent;box-shadow:0 0 0 1px var(--ysa-text-muted)} :where(html.ysa-connected-preview) .ysa-color-popover__alpha-track{border-radius:999px;background:repeating-conic-gradient(var(--ysa-line) 0 25%,white 0 50%) 0/8px 8px} :where(html.ysa-connected-preview) .ysa-color-popover__slider-row output{text-align:right;font-variant-numeric:tabular-nums;font-size:10px} :where(html.ysa-connected-preview) .ysa-color-popover__format-row{display:flex;align-items:center;justify-content:space-between;margin-top:18px;font-size:11px} :where(html.ysa-connected-preview) .ysa-color-popover__format-toggle{display:flex;padding:3px;border:1px solid var(--ysa-line);border-radius:8px;background:var(--ysa-canvas)} :where(html.ysa-connected-preview) .ysa-color-popover__format-toggle button{min-height:24px;padding:3px 9px;border:0;border-radius:5px;background:transparent;font-size:10px} :where(html.ysa-connected-preview) .ysa-color-popover__format-toggle [aria-checked=true]{background:var(--ysa-sheet);box-shadow:var(--ysa-shadow-card)} :where(html.ysa-connected-preview) .ysa-color-popover__value-row{display:flex;align-items:flex-end;gap:8px;margin-top:12px} :where(html.ysa-connected-preview) .ysa-color-popover__value-row label{flex:1;min-width:0;font-size:10px} :where(html.ysa-connected-preview) .ysa-color-popover__value-row input{margin-top:5px;font:12px var(--ysa-font-mono)} :where(html.ysa-connected-preview) .ysa-color-popover__value-row button{min-height:38px;padding:7px 10px;font-size:10px} :where(html.ysa-connected-preview) .ysa-color-popover__error{margin-top:10px;color:var(--ysa-danger-text);font-size:10px;line-height:1.5} :where(html.ysa-connected-preview) .ysa-color-popover__swatch-section{margin-top:16px;font-size:10px;color:var(--ysa-text-muted)} :where(html.ysa-connected-preview) .ysa-color-popover__palette{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px} :where(html.ysa-connected-preview) .ysa-color-popover__swatch-button{width:22px;height:22px;min-height:22px;padding:0;border:1px solid var(--ysa-line);border-radius:6px;background:var(--ysa-swatch-color,transparent)} :where(html.ysa-connected-preview) .ysa-color-popover__swatch-button.is-selected{outline:2px solid var(--ysa-ink);outline-offset:2px} :where(html.ysa-connected-preview) .ysa-color-popover__footer{display:flex;align-items:center;gap:7px;margin-top:18px;padding-top:14px;border-top:1px solid var(--ysa-line)} :where(html.ysa-connected-preview) .ysa-color-popover__footer>span{flex:1} :where(html.ysa-connected-preview) .ysa-color-popover__footer button{min-height:32px;padding:6px 10px;font-size:10px} :where(html.ysa-connected-preview) .ysa-color-popover__apply{border-color:var(--ysa-ink);background:var(--ysa-ink);color:var(--ysa-on-ink)} :where(html.ysa-connected-preview) .ysa-color-popover__clear{color:var(--ysa-text-muted)} /* Existing live-chat and system messages share one restrained toast frame. */ :where(html.ysa-connected-preview) .ysa_lcn_wrap{position:fixed;z-index:2200;top:48px;right:24px;width:380px;max-width:calc(100vw - 32px);pointer-events:none} :where(html.ysa-connected-preview) .ysa_lcn_toast{position:relative;width:100%;margin-bottom:10px;padding:20px;border:1px solid var(--ysa-line);border-radius:18px;background:var(--ysa-sheet);box-shadow:var(--ysa-shadow-menu);pointer-events:auto} :where(html.ysa-connected-preview) .ysa_lcn_title{padding-right:28px;font-family:var(--ysa-font-heading);font-size:21px;line-height:1.25} :where(html.ysa-connected-preview) .ysa_lcn_sub{margin-top:8px;color:var(--ysa-text-muted);font-size:12px;line-height:1.6} :where(html.ysa-connected-preview) .ysa_lcn_notification_icon{position:absolute;top:20px;right:20px;display:grid;place-items:center;width:25px;height:25px;border-radius:8px;background:var(--ysa-sage-soft);color:var(--ysa-ink);font-size:13px} :where(html.ysa-connected-preview) .ysa_lcn_btns{display:flex;flex-wrap:wrap;gap:7px;margin-top:18px} :where(html.ysa-connected-preview) .ysa_lcn_btn{min-height:32px;padding:7px 10px;font-size:10px} :where(html.ysa-connected-preview) .ysa_lcn_btn_open{border-color:var(--ysa-ink);background:var(--ysa-ink);color:var(--ysa-on-ink)} :where(html.ysa-connected-preview) .ysa_lcn_btn_del{color:var(--ysa-danger-text)} :where(html.ysa-connected-preview) #xhr_notifications{position:fixed;z-index:2600;top:48px;right:24px;width:380px;max-width:calc(100vw - 32px)} :where(html.ysa-connected-preview) .notifications_popup{position:relative;margin-bottom:12px;padding:24px;overflow:hidden;border:1px solid var(--ysa-line);border-radius:20px;background:var(--ysa-sheet);box-shadow:var(--ysa-shadow-menu)} :where(html.ysa-connected-preview) .notifications_popup h4{margin-bottom:12px;font-size:21px} :where(html.ysa-connected-preview) .notifications_popup>div{font-size:13px;line-height:1.65;color:var(--ysa-text-3)} :where(html.ysa-connected-preview) .notifications_popup>a{display:flex;align-items:center;justify-content:center;min-height:36px;margin-top:20px;padding:8px 12px;border-radius:10px;background:var(--ysa-ink);color:var(--ysa-on-ink);font-size:12px;text-align:center} :where(html.ysa-connected-preview) .notifications_popup .timebar{position:absolute;bottom:0;left:0;width:100%;height:3px;background:var(--ysa-sage)} :where(html.ysa-connected-preview) #form_response{position:fixed;z-index:5000;left:50%;bottom:24px;display:none;max-width:calc(100vw - 32px);transform:translateX(-50%);padding:12px 18px;border:1px solid var(--ysa-line);border-radius:999px;background:var(--ysa-ink);color:var(--ysa-on-ink);box-shadow:var(--ysa-shadow-popover);font:600 12px var(--ysa-font-sans);text-align:center} :where(html.ysa-connected-preview) :is(#error_message,#success_message){font-size:12px;line-height:1.6} :where(html.ysa-connected-preview) #error_message{color:var(--ysa-danger-text)} :where(html.ysa-connected-preview) #success_message{color:var(--ysa-ok)} :where(html.ysa-connected-preview) :is(#error_message,#success_message):empty{display:none} :where(html.ysa-connected-preview) .container-page200{width:min(860px,100%);padding:36px;border:1px solid var(--ysa-line);border-radius:24px;background:var(--ysa-sheet)} :where(html.ysa-connected-preview) .container-page200 p{font-size:13px;line-height:1.75} :where(html.ysa-connected-preview) .ysa-tooltip-bubble{position:fixed;z-index:6000;left:0;top:0;max-width:calc(100vw - 24px);opacity:0;pointer-events:none;transition:opacity .16s ease} :where(html.ysa-connected-preview) .ysa-tooltip-bubble.is-visible{opacity:1} :where(html.ysa-connected-preview) .ysa-tooltip-bubble-inner{max-width:360px;padding:8px 11px;border-radius:9px;background:var(--ysa-ink);color:var(--ysa-on-ink);box-shadow:var(--ysa-shadow-popover);font:400 11px/1.5 var(--ysa-font-sans);white-space:nowrap} :where(html.ysa-connected-preview) .ysa-tooltip-bubble[data-multiline='1'] .ysa-tooltip-bubble-inner{white-space:pre-line;border-radius:12px} :where(html.ysa-connected-preview) .ysa-tooltip-arrow{position:absolute;width:7px;height:7px;border-radius:1px;background:var(--ysa-ink);transform:translate(-50%,-50%) rotate(45deg)} @media(max-width:1000px){:where(html.ysa-connected-preview) .ysa-auth{grid-template-columns:minmax(300px,.8fr) minmax(0,1fr);gap:16px;margin-top:16px;padding:0 16px 16px}:where(html.ysa-connected-preview) .ysa-auth-brand{padding:32px}:where(html.ysa-connected-preview) .ysa-auth-brand h1{font-size:38px}:where(html.ysa-connected-preview) .ysa-auth-main{padding:70px 24px 24px}} @media(max-width:720px){ :where(html.ysa-connected-preview) :is(dialog,.ysa-account-switch-dialog,.ysa-sticky-note-dialog){max-width:calc(100vw - 24px);max-height:calc(100dvh - 64px);padding:22px;border-radius:20px} :where(html.ysa-connected-preview) :is(dialog h2,.ysa-account-switch-head h2,.ysa-sticky-note-dialog h2){font-size:23px} :where(html.ysa-connected-preview) .popup{padding:70px 12px 100px} :where(html.ysa-connected-preview) .popup_content{padding:22px;border-radius:20px} :where(html.ysa-connected-preview) .popup_close_button{top:20px;right:16px} :where(html.ysa-connected-preview) .ysa-command-popup{padding-top:90px} :where(html.ysa-connected-preview) .ysa-command-head{gap:8px;padding-left:10px;padding-right:10px} :where(html.ysa-connected-preview) .ysa-command-head input{font-size:16px} :where(html.ysa-connected-preview) .ysa-account-switch-modal{padding:12px} :where(html.ysa-connected-preview) .ysa-account-switch-dialog{width:100%;padding:22px} :where(html.ysa-connected-preview) .ysa-auth{display:block;margin-top:12px;padding:0 12px 12px} :where(html.ysa-connected-preview) .ysa-auth-brand{display:none} :where(html.ysa-connected-preview) .ysa-auth-main{min-height:calc(100dvh - 24px);padding:82px 24px 28px;border-radius:24px} :where(html.ysa-connected-preview) .ysa-auth-main::before{content:'';position:absolute;top:26px;left:24px;width:154px;height:27px;background:url('/img/youshouldask-logo-wide.svg') left center/contain no-repeat} :where(html.ysa-connected-preview) .ysa-auth-language{top:25px;right:20px} :where(html.ysa-connected-preview) .ysa-auth-card{max-width:400px} :where(html.ysa-connected-preview) .ysa-auth-heading{margin-bottom:24px} :where(html.ysa-connected-preview) .ysa-auth-heading h2{font-size:29px} :where(html.ysa-connected-preview) .ysa-auth input.input100{font-size:16px} :where(html.ysa-connected-preview) .ysa-auth-footer{margin-top:30px;font-size:10px} :where(html.ysa-connected-preview) .ysa-auth-signup-panel{top:8px;right:8px;bottom:8px;width:calc(100vw - 16px);padding:24px} :where(html.ysa-connected-preview) .ysa-auth-panel-topbar{margin-bottom:28px} :where(html.ysa-connected-preview) .ysa-auth-panel-heading h2{font-size:28px} :where(html.ysa-connected-preview) .ysa-auth-name-row{gap:10px} :where(html.ysa-connected-preview) .ysa-auth-consent{font-size:11px} :where(html.ysa-connected-preview) .ysa-qr-login{padding:16px} :where(html.ysa-connected-preview) .ysa-cookie-banner{left:12px;bottom:12px;max-width:calc(100vw - 24px);padding:20px;border-radius:20px} :where(html.ysa-connected-preview) .ysa-cookie-preferences{padding:0} :where(html.ysa-connected-preview) .ysa-cookie-preferences-head{padding:20px} :where(html.ysa-connected-preview) .ysa-cookie-preferences-body{padding:20px} :where(html.ysa-connected-preview) .ysa-cookie-category{gap:14px} :where(html.ysa-connected-preview) .ysa-cookie-required{max-width:76px;text-align:right;line-height:1.5} :where(html.ysa-connected-preview) .ysa-cookie-preferences-actions{padding:16px 20px} :where(html.ysa-connected-preview) .ysa-cookie-status{bottom:98px;max-width:calc(100vw - 32px);text-align:center} :where(html.ysa-connected-preview) .ysa-workspace-notifications-popover{position:fixed;top:46px;right:12px;left:12px;width:auto;max-width:none;padding:18px} :where(html.ysa-connected-preview) .ysa-sticky-note-dialog-backdrop{padding:12px} :where(html.ysa-connected-preview) .ysa-sticky-note-dialog{padding:0;max-height:calc(100dvh - 24px)} :where(html.ysa-connected-preview) .ysa-sticky-note-dialog>header{padding:20px} :where(html.ysa-connected-preview) #ysa-sticky-note-form{padding:18px 20px 20px} :where(html.ysa-connected-preview) .ysa-sticky-note-page-count{flex-basis:100%} :where(html.ysa-connected-preview) .ysa-sticky-note{width:min(260px,calc(100vw - 32px))} :where(html.ysa-connected-preview) .ysa-sticky-note-toast{bottom:98px} :where(html.ysa-connected-preview) .ysa-color-popover__value-row input{font-size:16px} } @media(max-width:600px){:where(html.ysa-connected-preview) .ysa-color-popover{position:fixed;left:12px;right:12px;top:auto;bottom:12px;width:auto;max-width:none;max-height:calc(100dvh - 24px);border-radius:20px;padding:18px}} @media(max-width:360px){:where(html.ysa-connected-preview) .ysa-auth-main{padding-right:18px;padding-left:18px}:where(html.ysa-connected-preview) .ysa-auth-main::before{left:18px;width:132px}:where(html.ysa-connected-preview) .ysa-auth-language{right:16px}:where(html.ysa-connected-preview) .ysa-auth-language select{font-size:10px}:where(html.ysa-connected-preview) .code-input{gap:5px}:where(html.ysa-connected-preview) .code-input input.code{height:48px;min-height:48px;font-size:21px}:where(html.ysa-connected-preview) .ysa-auth-name-row{grid-template-columns:1fr}} @media(prefers-reduced-motion:reduce){:where(html.ysa-connected-preview) body>.ysa-auth{animation:none}} /* Prototype entry motion. Geometry, native dismissal and focus handlers stay intact. */ :where(html.ysa-connected-preview) dialog[open]{animation:ysa-blank-native-dialog-in 200ms var(--ysa-motion-ease)} :where(html.ysa-connected-preview) :is(.popup_content,.ysa-account-switch-modal.is-open .ysa-account-switch-dialog){animation:ysa-blank-dialog-in 200ms var(--ysa-motion-ease)} :where(html.ysa-connected-preview) dialog[open]::backdrop,:where(html.ysa-connected-preview) .ysa-account-switch-modal.is-open .ysa-account-switch-backdrop{animation:ysa-blank-layer-in 160ms ease} :where(html.ysa-connected-preview) :is(.ysa-workspace-notifications-popover,.ysa-color-popover){animation:ysa-blank-popover-in 120ms var(--ysa-motion-ease)} :where(html.ysa-connected-preview) .notifications_popup{animation:ysa-blank-popover-in 160ms var(--ysa-motion-ease)} @keyframes ysa-blank-native-dialog-in{from{opacity:0;translate:0 10px}to{opacity:1;translate:0 0}} @keyframes ysa-blank-dialog-in{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}} @keyframes ysa-blank-layer-in{from{opacity:0}to{opacity:1}} @keyframes ysa-blank-popover-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}} /* Shared rich-content editor dialog. Original plugin nodes and state stay authoritative. */ html.ysa-connected-preview .jt-modal-backdrop { display:none; position:fixed; inset:0; z-index:4100; background:#0e252366; backdrop-filter:blur(3px); padding:24px; align-items:center; justify-content:center; } html.ysa-connected-preview .jt-modal-backdrop.is-open:not([aria-hidden="true"]) { display:flex; } html.ysa-connected-preview .jt-modal-backdrop .jt-modal { width:min(700px,100%); max-height:calc(100dvh - 48px); overflow:auto; background:#fff; border:1px solid #e0e4df; border-radius:20px; color:#0e2523; } html.ysa-connected-preview .jt-modal-backdrop :is(.jt-h,.jt-f) { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:18px 22px; } html.ysa-connected-preview .jt-modal-backdrop .jt-h { border-bottom:1px solid #e0e4df; } html.ysa-connected-preview .jt-modal-backdrop .jt-h h3 { margin:0; font:400 22px "PP Palma",Inter,sans-serif; } html.ysa-connected-preview .jt-modal-backdrop .jt-x { width:34px; height:34px; min-height:34px; padding:4px; border:1px solid #e0e4df; background:#fff; border-radius:9px; font-size:22px; } html.ysa-connected-preview .jt-modal-backdrop .jt-b { padding:22px; } html.ysa-connected-preview .jt-modal-backdrop .jt-b :is(p,.hint) { color:#687673; font-size:12px; line-height:1.6; } html.ysa-connected-preview .jt-modal-backdrop textarea { width:100%; min-height:220px; } html.ysa-connected-preview .jt-modal-backdrop .jt-f { border-top:1px solid #e0e4df; } html.ysa-connected-preview .jt-modal-backdrop .jt-f>div:last-child { display:flex; gap:8px; } html.ysa-connected-preview .jt-modal-backdrop .jt-btn.black { color:#fff; background:#0e2523; } html.ysa-connected-preview .jt-modal-backdrop .jt-buttons-rows { display:grid; gap:12px; } html.ysa-connected-preview .jt-modal-backdrop .jt-buttons-row { display:grid; grid-template-columns:1fr 1fr 36px; align-items:end; gap:10px; padding-bottom:14px; border-bottom:1px solid #e0e4df; } html.ysa-connected-preview .jt-modal-backdrop .jt-buttons-row label { display:grid; gap:6px; font-size:12px; font-weight:600; } html.ysa-connected-preview .jt-modal-backdrop .jt-buttons-row input { width:100%; } html.ysa-connected-preview .jt-modal-backdrop .jt-buttons-preview { display:flex; gap:8px; flex-wrap:wrap; margin-top:10px; } html.ysa-connected-preview .jt-modal-backdrop .jt-buttons-preview-item { border:1px solid #a5c4c3; border-radius:14px; padding:6px 12px; background:#edf3ed; font-size:12px; } html.ysa-connected-preview .jt-modal-backdrop .jt-buttons-add { margin:14px 0; } html.ysa-connected-preview .jt-modal-backdrop .jt-buttons-remove { width:36px; min-height:40px; padding:6px; } html.ysa-connected-preview .jt-modal-backdrop .err { color:#963e36; font-size:12px; margin-top:12px; } html.ysa-connected-preview .jt-modal-backdrop .jt-buttons-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr) auto;gap:10px;align-items:end;margin:12px 0} html.ysa-connected-preview .jt-modal-backdrop .jt-buttons-row label{display:grid;gap:6px} html.ysa-connected-preview .jt-modal-backdrop .jt-buttons-preview{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0} html.ysa-connected-preview .jt-modal-backdrop .jt-buttons-preview-item{padding:8px 12px;border:1px solid var(--ysa-line);border-radius:999px;font-size:13px} @media(max-width:720px){ html.ysa-connected-preview .jt-modal-backdrop { padding:12px; } html.ysa-connected-preview .jt-modal-backdrop .jt-modal { max-height:calc(100dvh - 24px); } html.ysa-connected-preview .jt-modal-backdrop :is(.jt-h,.jt-b,.jt-f) { padding:16px; } html.ysa-connected-preview .jt-modal-backdrop .jt-f { flex-wrap:wrap; } html.ysa-connected-preview .jt-modal-backdrop .jt-buttons-row { grid-template-columns:minmax(0,1fr) 36px; } html.ysa-connected-preview .jt-modal-backdrop .jt-buttons-row label { grid-column:1; } html.ysa-connected-preview .jt-modal-backdrop .jt-buttons-row button { grid-column:2; grid-row:1/3; } html.ysa-connected-preview .jt-modal-backdrop .jt-buttons-row{grid-template-columns:minmax(0,1fr) auto} html.ysa-connected-preview .jt-modal-backdrop .jt-buttons-row label{grid-column:1} html.ysa-connected-preview .jt-modal-backdrop .jt-buttons-row .jt-buttons-remove{grid-column:2;grid-row:1 / 3} } /* Public recovery and legal pages retain their original fields and copy. */ html.ysa-connected-preview .limiter input[name="password_dummy"]{display:none!important} html.ysa-connected-preview .limiter .btn-show-pass{position:absolute;right:5px;top:auto;bottom:5px;display:grid;place-items:center;width:34px;height:34px;cursor:pointer} html.ysa-connected-preview .limiter .btn-show-pass~input:not([name="password_dummy"]){padding-right:44px} html.ysa-connected-preview .limiter .container-page200{width:min(820px,100%);min-width:0;padding:36px;border:1px solid var(--ysa-line);border-radius:24px;background:var(--ysa-sheet);box-shadow:var(--ysa-shadow-sheet)} html.ysa-connected-preview .limiter .container-page200 :is(p,li){font-size:14px;line-height:1.7;overflow-wrap:anywhere} html.ysa-connected-preview .limiter .container-page200 h2{margin-top:18px} html.ysa-connected-preview .limiter .container-page200 ul{margin:0;padding-left:22px} html.ysa-connected-preview .limiter .container-page200 .text-center{padding-top:22px;border-top:1px solid var(--ysa-line)} @media(max-width:720px){html.ysa-connected-preview .limiter .container-page200{padding:24px 20px}} html.ysa-connected-preview .login_avatar{background-image:url('/img/youshouldask-logo-wide.svg')!important} html.ysa-connected-preview .limiter .login100-form-title{display:none} html.ysa-connected-preview .limiter .login100-form-title-small{color:var(--ysa-ink);font:400 28px/1.25 var(--ysa-font-heading)} html.ysa-connected-preview .limiter .wrap-input100{display:flex;flex-direction:column;gap:6px} html.ysa-connected-preview .limiter .focus-input100[data-placeholder]{order:-1;margin:0} html.ysa-connected-preview .container-page200:has(h1) .login100-form-title-small{display:none} /* Generated editor forms use the same field rhythm as the surrounding page. */ html.ysa-connected-preview .jt-modal-backdrop .jt-form-head{margin-bottom:18px;font-size:15px} html.ysa-connected-preview .jt-modal-backdrop .jt-fields{display:grid;gap:14px;margin:14px 0} html.ysa-connected-preview .jt-modal-backdrop .jt-field{display:grid;gap:6px;min-width:0;margin-bottom:14px;font-size:12px;color:var(--ysa-text-muted)} html.ysa-connected-preview .jt-modal-backdrop .jt-field input{color:var(--ysa-ink)} html.ysa-connected-preview .jt-modal-backdrop .jt-param-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr) auto;gap:8px;margin:10px 0} html.ysa-connected-preview .jt-modal-backdrop .err:not(:empty){margin-top:14px;padding:12px;border:1px solid var(--ysa-danger-line);border-radius:10px;background:var(--ysa-danger-soft);color:var(--ysa-danger-text);font-size:12px;overflow-wrap:anywhere} html.ysa-connected-preview #framework_main .jt-toolbar{display:flex;flex-wrap:wrap;gap:4px;padding:9px;border:1px solid var(--ysa-line);border-radius:12px 12px 0 0;background:var(--ysa-canvas-tint)} html.ysa-connected-preview #framework_main .jt-toolbar.is-sticky{position:sticky;top:0;z-index:2} html.ysa-connected-preview #framework_main .jt-tb-btn{min-width:30px;min-height:30px;padding:4px 8px} @media(max-width:720px){html.ysa-connected-preview .jt-modal-backdrop .jt-param-row{grid-template-columns:minmax(0,1fr) auto}html.ysa-connected-preview .jt-modal-backdrop .jt-param-row .jt-param-key,html.ysa-connected-preview .jt-modal-backdrop .jt-param-row .jt-param-val{grid-column:1}html.ysa-connected-preview .jt-modal-backdrop .jt-param-row .jt-param-del{grid-column:2;grid-row:1 / 3}} html.ysa-connected-preview .jt-modal-backdrop :is(input,select,textarea){font-weight:400} /* Shared loading words are defined app-wide in words-loader.css. Native roots retain their original show/hide, popup-backdrop and explicit hidden states. */ html.ysa-connected-preview body>.loading.ysa-popup-backdrop .loader-wrap{visibility:hidden} html.ysa-connected-preview body>:is(.loading,#ysa_global_loader)[hidden]{display:none!important} /* Existing shared confirmation, alert and input helpers. Preview only. */ html.ysa-connected-preview :is(.confirm-backdrop,.alert-backdrop,.prompt-backdrop){position:fixed;inset:0;z-index:4000;display:grid;place-items:center;padding:24px;background:var(--ysa-on-ink-overlay);backdrop-filter:blur(4px)} html.ysa-connected-preview :is(.confirm-modal,.alert-modal,.prompt-modal){width:min(440px,100%);max-height:calc(100dvh - 48px);overflow:auto;padding:28px;border:1px solid var(--ysa-line);border-radius:22px;background:var(--ysa-sheet);color:var(--ysa-ink);box-shadow:var(--ysa-shadow-menu)} html.ysa-connected-preview :is(.confirm-title,.alert-title,.prompt-title){font:400 25px/1.2 var(--ysa-font-heading);margin-bottom:16px} html.ysa-connected-preview :is(.confirm-message,.alert-message,.prompt-message){font:400 14px/1.6 var(--ysa-font-sans);overflow-wrap:anywhere;color:var(--ysa-text-muted)} html.ysa-connected-preview :is(.confirm-buttons,.alert-buttons,.prompt-buttons){display:flex;justify-content:flex-end;flex-wrap:wrap;gap:10px;margin-top:24px} html.ysa-connected-preview :is(.confirm-btn,.alert-btn,.prompt-btn){min-height:44px;padding:10px 18px;border:1px solid var(--ysa-ink);border-radius:10px;background:var(--ysa-ink);color:var(--ysa-on-ink);font:600 13px/1.4 var(--ysa-font-sans)} html.ysa-connected-preview :is(.confirm-cancel,.prompt-cancel){background:var(--ysa-sheet);border-color:var(--ysa-line);color:var(--ysa-ink)} html.ysa-connected-preview .prompt-input{display:block;width:100%;min-height:44px;margin-top:20px;padding:10px 12px;border:1px solid var(--ysa-line-strong);border-radius:10px;background:var(--ysa-sheet);color:var(--ysa-ink);font:400 14px/1.4 var(--ysa-font-sans)} @media(max-width:720px){html.ysa-connected-preview :is(.confirm-backdrop,.alert-backdrop,.prompt-backdrop){padding:12px}html.ysa-connected-preview :is(.confirm-modal,.alert-modal,.prompt-modal){padding:20px;max-height:calc(100dvh - 24px)}} /* Keep the native color samples compact while enlarging their mobile hit areas. */ @media(max-width:720px){ html.ysa-connected-preview .ysa-color-editor__trigger:not(:where([data-ysa-customer-preview],[data-ysa-customer-preview] *)){min-height:44px} html.ysa-connected-preview .ysa-color-popover:not(:where([data-ysa-customer-preview],[data-ysa-customer-preview] *)){display:flex;flex-direction:column;overflow:hidden} html.ysa-connected-preview .ysa-color-popover:not(:where([data-ysa-customer-preview],[data-ysa-customer-preview] *)) :is(.ysa-color-popover__header,.ysa-color-popover__footer){flex-shrink:0} html.ysa-connected-preview .ysa-color-popover:not(:where([data-ysa-customer-preview],[data-ysa-customer-preview] *)) .ysa-color-popover__body{min-height:0;overflow:auto} html.ysa-connected-preview .ysa-color-popover:not(:where([data-ysa-customer-preview],[data-ysa-customer-preview] *)) button{min-width:44px;min-height:44px;font-size:12px;line-height:1.4} html.ysa-connected-preview .ysa-color-popover:not(:where([data-ysa-customer-preview],[data-ysa-customer-preview] *)) .ysa-color-popover__icon-button{width:44px;height:44px;font-size:20px} html.ysa-connected-preview .ysa-color-popover:not(:where([data-ysa-customer-preview],[data-ysa-customer-preview] *)) .ysa-color-popover__comparison{flex-wrap:wrap;row-gap:8px} html.ysa-connected-preview .ysa-color-popover:not(:where([data-ysa-customer-preview],[data-ysa-customer-preview] *)) .ysa-color-popover__slider-row input[type=range]{height:44px;min-height:44px;background-size:100% 12px;background-repeat:no-repeat;background-position:center} html.ysa-connected-preview .ysa-color-popover:not(:where([data-ysa-customer-preview],[data-ysa-customer-preview] *)) .ysa-color-popover__alpha-track{background-size:8px 12px;background-repeat:repeat-x;background-position:center} html.ysa-connected-preview .ysa-color-popover:not(:where([data-ysa-customer-preview],[data-ysa-customer-preview] *)) .ysa-color-popover__value-row input{min-height:44px} html.ysa-connected-preview .ysa-color-popover:not(:where([data-ysa-customer-preview],[data-ysa-customer-preview] *)) .ysa-color-popover__palette{gap:2px} html.ysa-connected-preview .ysa-color-popover:not(:where([data-ysa-customer-preview],[data-ysa-customer-preview] *)) .ysa-color-popover__swatch-button{position:relative;width:44px;height:44px;padding:0;border:0;background:transparent;outline:0} html.ysa-connected-preview .ysa-color-popover:not(:where([data-ysa-customer-preview],[data-ysa-customer-preview] *)) .ysa-color-popover__swatch-button::before{content:'';position:absolute;left:50%;top:50%;width:22px;height:22px;transform:translate(-50%,-50%);border:1px solid var(--ysa-line);border-radius:6px;background:var(--ysa-swatch-color,transparent)} html.ysa-connected-preview .ysa-color-popover:not(:where([data-ysa-customer-preview],[data-ysa-customer-preview] *)) .ysa-color-popover__swatch-button.is-selected::before{outline:2px solid var(--ysa-ink);outline-offset:2px} } /* Native instruction tokens share one inline treatment across all editor hosts. */ html.ysa-connected-preview :is(#framework_main,#popup,#version_drawer) .jt-editor .json-tag[contenteditable=false]:not(:where([data-ysa-customer-preview],[data-ysa-customer-preview] *)){display:inline-flex;align-items:center;vertical-align:middle;gap:6px;max-width:calc(100% - 8px);min-height:34px;margin:3px 4px;padding:6px 10px;border:1px solid var(--ysa-ink);border-radius:999px;background:var(--ysa-ink);color:var(--ysa-on-ink);font:500 13px/1.45 var(--ysa-font-sans);white-space:normal;overflow-wrap:anywhere;user-select:none;cursor:pointer} html.ysa-connected-preview .jt-editor .json-tag:not(:where([data-ysa-customer-preview],[data-ysa-customer-preview] *)) .jt-label{min-width:0;color:inherit;font:inherit} html.ysa-connected-preview .jt-editor .json-tag:not(:where([data-ysa-customer-preview],[data-ysa-customer-preview] *)) .jt-badge{display:inline-flex;align-items:center;gap:5px;flex-shrink:0;color:inherit;font:inherit} html.ysa-connected-preview .jt-editor .json-tag:not(:where([data-ysa-customer-preview],[data-ysa-customer-preview] *)) :is(i,svg){flex:none;width:14px;height:14px;font-size:14px;color:inherit;vertical-align:middle} html.ysa-connected-preview :is(#framework_main,#popup,#version_drawer) .jt-editor .json-tag:not(:where([data-ysa-customer-preview],[data-ysa-customer-preview] *)).jt-lead{border-color:var(--ysa-danger-line);background:var(--ysa-danger-soft);color:var(--ysa-danger-text);cursor:default} html.ysa-connected-preview :is(#framework_main,#popup,#version_drawer) .jt-editor .json-tag:not(:where([data-ysa-customer-preview],[data-ysa-customer-preview] *)):is(.jt-profile-campaign,.jt-traffic--reply_eligible){border-color:var(--ysa-sage);background:var(--ysa-sage-soft);color:var(--ysa-ink)} html.ysa-connected-preview :is(#framework_main,#popup,#version_drawer) .jt-editor .json-tag:not(:where([data-ysa-customer-preview],[data-ysa-customer-preview] *)).jt-profile-campaign{cursor:default} html.ysa-connected-preview :is(#framework_main,#popup,#version_drawer) .jt-editor .json-tag:not(:where([data-ysa-customer-preview],[data-ysa-customer-preview] *)).jt-traffic--human_review_required{border-color:var(--ysa-line-strong);background:var(--ysa-caution-soft);color:var(--ysa-caution-text)} html.ysa-connected-preview :is(#framework_main,#popup,#version_drawer) .jt-editor .json-tag:not(:where([data-ysa-customer-preview],[data-ysa-customer-preview] *)).jt-traffic--do_not_respond{border-color:var(--ysa-danger-line);background:var(--ysa-danger-soft);color:var(--ysa-danger-text)} html.ysa-connected-preview :is(#framework_main,#popup,#version_drawer) .jt-editor .json-tag:not(:where([data-ysa-customer-preview],[data-ysa-customer-preview] *)).jt-buttons{flex-wrap:wrap;gap:6px;padding:0;border:0;border-radius:0;background:transparent;color:var(--ysa-info)} html.ysa-connected-preview :is(#framework_main,#popup,#version_drawer) .jt-editor .jt-button-choice:not(:where([data-ysa-customer-preview],[data-ysa-customer-preview] *)){max-width:100%;padding:6px 10px;border:1px solid var(--ysa-line-strong);border-radius:999px;background:var(--ysa-info-soft);color:var(--ysa-info);font:500 13px/1.45 var(--ysa-font-sans);overflow-wrap:anywhere} html.ysa-connected-preview :is(#framework_main,#popup,#version_drawer) .jt-editor .json-tag:not(:where([data-ysa-customer-preview],[data-ysa-customer-preview] *)) .jt-persona-avatar{flex:none;width:24px;height:24px;border-radius:50%;object-fit:cover} html.ysa-connected-preview .jt-editor .json-tag:not(:where([data-ysa-customer-preview],[data-ysa-customer-preview] *)).jt-traffic .jt-badge{flex-shrink:1;min-width:0;white-space:normal;overflow-wrap:anywhere} html.ysa-connected-preview .jt-editor .json-tag:not(:where([data-ysa-customer-preview],[data-ysa-customer-preview] *))[role=button]:hover{filter:brightness(.95)} html.ysa-connected-preview .jt-editor .json-tag:not(:where([data-ysa-customer-preview],[data-ysa-customer-preview] *)):focus-visible{outline:2px solid var(--ysa-ink)!important;outline-offset:3px!important} /* Connector insertion controls use the same shape and icon alignment. */ html.ysa-connected-preview #framework_main .ysa-flow-edit-page .ysa-flow-tools-panel .jt-btn{display:inline-flex;align-items:center;justify-content:flex-start;gap:7px;min-height:44px;padding:9px 12px;margin:0 4px 8px 0;border:1px solid var(--ysa-line-strong);border-radius:10px;background:var(--ysa-sheet);color:var(--ysa-ink);font:500 13px/1.4 var(--ysa-font-sans);white-space:normal;overflow-wrap:anywhere} html.ysa-connected-preview #framework_main .ysa-flow-tools-panel .jt-btn :is(i,svg){flex:none;width:15px;height:15px;font-size:15px;color:inherit} html.ysa-connected-preview #framework_main .ysa-flow-tools-panel .jt-btn:not(:disabled):hover{border-color:var(--ysa-sage);background:var(--ysa-canvas)} /* Keep headings and actions visible while the native form body scrolls. */ html.ysa-connected-preview .jt-modal-backdrop .jt-modal{display:flex;flex-direction:column;overflow:hidden} html.ysa-connected-preview .jt-modal-backdrop :is(.jt-h,.jt-f){flex:none;flex-wrap:wrap} html.ysa-connected-preview .jt-modal-backdrop .jt-h{flex-wrap:nowrap;align-items:flex-start} html.ysa-connected-preview .jt-modal-backdrop .jt-h h3{flex:1;min-width:0;overflow-wrap:anywhere} html.ysa-connected-preview .jt-modal-backdrop .jt-x{flex:none;width:44px;height:44px;min-height:44px} html.ysa-connected-preview .jt-modal-backdrop .jt-b{min-height:0;overflow:auto;overscroll-behavior:contain} html.ysa-connected-preview .jt-modal-backdrop .jt-f>div:last-child{margin-left:auto;flex-wrap:wrap} html.ysa-connected-preview .jt-modal-backdrop .jt-btn{min-height:44px;padding:9px 14px;border-radius:10px;font-size:13px} html.ysa-connected-preview .jt-modal-backdrop .jt-connector-form-head{margin:0 0 20px} html.ysa-connected-preview .jt-modal-backdrop .jt-connector-form-head>div{display:flex;align-items:center;flex-wrap:wrap;gap:10px} html.ysa-connected-preview .jt-modal-backdrop .jt-connector-form-head strong{font:400 20px/1.3 var(--ysa-font-heading);color:var(--ysa-ink)} html.ysa-connected-preview .jt-modal-backdrop .jt-connector-form-head>div>span{display:inline-flex;max-width:100%;padding:4px 9px;border-radius:20px;background:var(--ysa-sage-soft);color:var(--ysa-ink);font-size:12px;overflow-wrap:anywhere} html.ysa-connected-preview .jt-modal-backdrop .jt-connector-form-head p{margin:10px 0 0;font-size:13px;line-height:1.6} html.ysa-connected-preview .jt-modal-backdrop .jt-connector-fields{display:grid;grid-template-columns:minmax(0,1fr);gap:16px} html.ysa-connected-preview .jt-modal-backdrop :is(.jt-connector-field,.jt-connector-instance-field,.jt-connector-result-field){display:grid;grid-template-columns:minmax(0,1fr);gap:7px;margin:0;min-width:0;overflow-wrap:anywhere} html.ysa-connected-preview .jt-modal-backdrop :is(.jt-connector-field,.jt-connector-instance-field,.jt-connector-result-field)>span{color:var(--ysa-ink);font-size:13px;font-weight:600} html.ysa-connected-preview .jt-modal-backdrop .jt-connector-field>span b{color:var(--ysa-danger-text)} html.ysa-connected-preview .jt-modal-backdrop :is(.jt-connector-field,.jt-connector-instance-field,.jt-connector-result-field) small{font-size:12px;line-height:1.5;color:var(--ysa-text-muted)} html.ysa-connected-preview .jt-modal-backdrop .jt-connector-instance-field{margin-bottom:20px} html.ysa-connected-preview .jt-modal-backdrop :is(.jt-input,.jt-silent){box-sizing:border-box;width:100%;max-width:100%;min-width:0;min-height:44px;font-size:14px} html.ysa-connected-preview .jt-modal-backdrop select.jt-input{height:44px} html.ysa-connected-preview .jt-modal-backdrop .jt-connector-field textarea.jt-input{height:128px;min-height:104px;padding:10px 12px;line-height:1.5} html.ysa-connected-preview .jt-modal-backdrop .jt-connector-result-field{margin-top:24px;padding-top:20px;border-top:1px solid var(--ysa-line)} @media(max-width:720px){ html.ysa-connected-preview :is(#framework_main,#popup,#version_drawer) .jt-editor .json-tag:not(:where([data-ysa-customer-preview],[data-ysa-customer-preview] *))[contenteditable=false]{min-height:44px} html.ysa-connected-preview :is(#framework_main,#popup,#version_drawer) .jt-editor .jt-button-choice:not(:where([data-ysa-customer-preview],[data-ysa-customer-preview] *)){display:inline-flex;align-items:center;min-height:44px} } /* Notes belong to scrollable content, clipped to its visible page viewport. */ html body > #ysa-sticky-notes-layer.ysa-sticky-notes-layer{position:fixed;inset:auto;overflow:hidden}