:root{color-scheme:light;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;--ink: #191624;--ink-soft: #4f485e;--muted: #81798f;--surface: #ffffff;--surface-soft: #f8f7fa;--line: #e4e0e9;--line-strong: #cfc7da;--violet: #6f42d9;--violet-soft: #f3efff;--coral: #f34f67;--coral-dark: #d83b55;--teal: #168d83;--teal-soft: #e9f8f5;--danger: #a6273d}*{box-sizing:border-box}html{min-width:320px;background:var(--surface)}body{margin:0;min-width:320px;min-height:100vh;min-height:100svh;color:var(--ink);background:var(--surface)}button,textarea{font:inherit}button{-webkit-tap-highlight-color:transparent}button:focus-visible,textarea:focus-visible{outline:3px solid rgba(111,66,217,.25);outline-offset:3px}.feedback-app{min-height:100vh;min-height:100svh;display:grid;grid-template-rows:82px 1fr}.feedback-header{width:min(100% - 40px,1180px);height:82px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand-logo{width:102px;height:46px;object-fit:contain}.header-note{color:var(--muted);font-size:13px}.feedback-main{width:min(100% - 40px,760px);margin:0 auto;padding:54px 0 42px}.screen-transition{animation:enter-screen .26s ease-out both}@keyframes enter-screen{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}h1,h2,p{margin-top:0}h1{max-width:720px;margin-bottom:18px;font-size:clamp(36px,5vw,58px);line-height:1.04;letter-spacing:0}h2{font-size:36px;line-height:1.12;letter-spacing:0}.eyebrow{margin-bottom:14px;color:var(--violet);font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.lead{max-width:620px;color:var(--ink-soft);font-size:20px;line-height:1.55}.welcome-screen{min-height:calc(100svh - 178px);display:flex;flex-direction:column;justify-content:space-between;gap:72px}.welcome-copy{padding-top:38px}.welcome-footer{display:flex;align-items:center;gap:26px}.welcome-button{min-width:180px}.welcome-meta{display:flex;flex-wrap:wrap;gap:8px;color:var(--muted);font-size:13px;line-height:1.5}.primary-button,.secondary-button,.icon-button{min-height:52px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;gap:10px;cursor:pointer;transition:background-color .16s ease,border-color .16s ease,color .16s ease,transform .16s ease}.primary-button{min-width:164px;padding:0 22px;border:1px solid var(--coral);color:#fff;background:var(--coral);font-weight:750}.primary-button:hover:not(:disabled){background:var(--coral-dark);border-color:var(--coral-dark);transform:translateY(-1px)}.primary-button:disabled{color:#9f99a8;border-color:var(--line);background:#efedf1;cursor:not-allowed}.primary-button svg,.secondary-button svg,.icon-button svg{width:19px;height:19px}.secondary-button{padding:0 20px;border:1px solid var(--line-strong);color:var(--ink);background:var(--surface);font-weight:700}.secondary-button:hover{border-color:var(--violet);color:var(--violet)}.icon-button{width:52px;border:1px solid var(--line-strong);color:var(--ink);background:var(--surface)}.icon-button:hover{color:var(--violet);border-color:var(--violet)}.question-screen,.concept-screen{min-height:calc(100svh - 178px);display:flex;flex-direction:column}.question-progress{margin-bottom:44px}.progress-copy{margin-bottom:10px;display:flex;justify-content:space-between;color:var(--muted);font-size:12px;font-weight:700}.progress-track{width:100%;height:3px;overflow:hidden;background:var(--line)}.progress-track span{height:100%;display:block;background:var(--violet);transition:width .24s ease}.question-heading{margin-bottom:32px}.question-heading h1,.concept-copy h1{font-size:clamp(32px,4vw,46px);line-height:1.1}.question-heading>p:last-child{margin-bottom:0;color:var(--muted);font-size:16px;line-height:1.5}.option-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.option-row{width:100%;min-height:62px;padding:12px 14px 12px 17px;border:1px solid var(--line);border-radius:8px;display:flex;align-items:center;justify-content:space-between;gap:14px;color:var(--ink-soft);background:#ffffffe6;text-align:left;cursor:pointer;transition:border-color .15s ease,background-color .15s ease,color .15s ease}.option-row:hover:not(:disabled){border-color:var(--line-strong);color:var(--ink)}.option-row.is-selected{color:var(--ink);border-color:var(--violet);background:var(--violet-soft)}.option-row:disabled{opacity:.4;cursor:not-allowed}.selection-mark{width:23px;height:23px;flex:0 0 23px;border:1px solid var(--line-strong);border-radius:50%;display:grid;place-items:center;color:#fff;background:var(--surface)}.is-selected .selection-mark{border-color:var(--violet);background:var(--violet)}.selection-mark svg{width:14px;height:14px;stroke-width:3}.navigation-row{margin-top:auto;padding-top:34px;display:flex;align-items:center;justify-content:space-between;gap:16px}.submission-error{margin:22px 0 0;padding:12px 14px;border-left:3px solid var(--danger);color:var(--danger);background:#fff3f5;font-size:14px;line-height:1.5}.feedback-trap{width:1px;height:1px;position:fixed;left:-10000px;overflow:hidden;opacity:0;pointer-events:none}.text-response{position:relative}.text-response textarea{width:100%;min-height:230px;padding:20px 20px 46px;resize:vertical;border:1px solid var(--line-strong);border-radius:8px;color:var(--ink);background:#fffffff0;font-size:18px;line-height:1.55}.text-response textarea::placeholder{color:#a29baa}.text-response>span{position:absolute;right:16px;bottom:15px;color:var(--muted);font-size:12px}.concept-screen{justify-content:center}.concept-copy{margin-bottom:34px}.concept-preview{width:100%;min-height:250px;padding:28px;position:relative;overflow:hidden;border:1px solid var(--line);border-radius:8px;display:grid;grid-template-columns:1fr auto;grid-template-rows:1fr auto;align-items:center;color:var(--ink);background:var(--surface-soft);text-align:left;cursor:pointer}.concept-preview:hover{border-color:var(--violet)}.conversation-visual{min-height:115px;grid-column:1 / -1;position:relative;display:flex;align-items:center;justify-content:center;gap:86px}.bubble{width:108px;height:70px;border-radius:8px;display:flex;align-items:center;justify-content:center;gap:7px;position:relative;z-index:1}.bubble i{width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.62}.bubble-left{color:var(--violet);background:#e9e1ff}.bubble-right{color:var(--danger);background:#ffe3e8}.connection-line{width:120px;height:1px;position:absolute;background:var(--line-strong)}.play-button{width:52px;height:52px;position:absolute;top:82px;left:50%;z-index:2;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;color:var(--coral);background:var(--surface);transform:translate(-50%)}.play-button svg{width:20px;height:20px;margin-left:2px}.preview-copy{display:flex;flex-direction:column;gap:4px}.preview-copy small{color:var(--muted)}.story-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:20;padding:24px;display:grid;place-items:center;background:#19162494;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.story-dialog{width:min(100%,640px);min-height:500px;padding:24px;border-radius:8px;display:flex;flex-direction:column;background:var(--surface);box-shadow:0 24px 80px #19162433}.story-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px}.story-steps{flex:1;display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.story-steps button{height:3px;padding:0;border:0;background:var(--line)}.story-steps button.is-active{background:var(--violet)}.story-close{width:40px;height:40px;padding:0;border:0;display:grid;place-items:center;color:var(--ink-soft);background:transparent;cursor:pointer}.story-close svg{width:21px;height:21px}.story-content{flex:1;padding:54px 34px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;animation:enter-screen .22s ease-out both}.story-content h2{max-width:460px;margin-bottom:14px}.story-content>p:last-child{max-width:500px;margin-bottom:0;color:var(--ink-soft);font-size:18px;line-height:1.55}.story-icon{width:58px;height:58px;margin-bottom:26px;border-radius:8px;display:grid;place-items:center;color:var(--teal);background:var(--teal-soft)}.story-icon svg{width:28px;height:28px}.story-controls{display:flex;align-items:center;justify-content:space-between;gap:16px}.completion-layout{grid-template-rows:82px 1fr}.completion-screen{width:min(100% - 40px,680px);margin:0 auto;padding:78px 0 48px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}.completion-mark{width:58px;height:58px;margin-bottom:34px;border-radius:50%;display:grid;place-items:center;color:#fff;background:var(--teal)}.completion-mark svg{width:28px;height:28px;stroke-width:3}.completion-screen .secondary-button{margin-top:18px}.mock-note{margin:24px 0 0;color:var(--muted);font-size:12px}@media(max-width:680px){body{background:var(--surface)}.feedback-app{grid-template-rows:66px 1fr}.feedback-header{width:calc(100% - 32px);height:66px}.brand-logo{width:88px;height:40px}.header-note{font-size:11px}.feedback-main{width:calc(100% - 32px);padding:32px 0 22px}h1{font-size:39px}.lead{font-size:17px}.welcome-screen,.question-screen,.concept-screen{min-height:calc(100svh - 120px)}.welcome-copy{padding-top:18px}.welcome-footer{display:block}.welcome-button{width:100%}.welcome-meta{margin-top:18px;justify-content:center;text-align:center}.question-progress{margin-bottom:30px}.question-heading{margin-bottom:24px}.question-heading h1,.concept-copy h1{font-size:31px}.option-list{grid-template-columns:1fr;gap:8px}.option-row{min-height:56px}.navigation-row{position:sticky;bottom:0;margin:24px -16px 0;padding:12px 16px max(12px,env(safe-area-inset-bottom));background:#fffffff5;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.navigation-row .primary-button{flex:1}.concept-screen{justify-content:flex-start}.concept-preview{min-height:230px;padding:22px}.conversation-visual{gap:58px}.bubble{width:88px;height:62px}.story-backdrop{padding:0}.story-dialog{width:100%;min-height:100svh;padding:18px 16px max(18px,env(safe-area-inset-bottom));border-radius:0}.story-content{padding:38px 8px}.story-content h2{font-size:31px}.story-controls .primary-button{flex:1}.completion-screen{width:calc(100% - 32px);padding:48px 0 34px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}