:root{--bg-main:#020813;--bg-sidebar:#071426;--bg-card:#09172a;--border:#17304d;--text-main:#f8fbff;--text-muted:#a9b7c9;--accent:#2688ff;--accent-hover:#54a6ff;--accent-soft:#2688ff29;--accent-strong:#0b63e5;--panel:#071426d1;--panel-hover-border:#235b94;color:var(--text-main);background:var(--bg-main);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;font:15px/1.45 Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{min-width:320px;margin:0}button,input,textarea,select{font:inherit}button{cursor:pointer}.auth-page{background:radial-gradient(circle at top, #06285a, var(--bg-main) 45%);place-items:center;min-height:100svh;padding:24px;display:grid}.auth-card{border:1px solid var(--border);background:#071222f5;border-radius:28px;width:min(440px,100%);padding:32px;animation:.5s both rise-in;box-shadow:0 30px 80px #00000059}.brand{color:var(--accent);letter-spacing:-.04em;text-shadow:0 0 18px #2688ff59;font-size:24px;font-weight:900}h1,h2,h3,p{margin-top:0}.auth-card h1{margin:20px 0 8px;font-size:34px;line-height:1.05}.auth-card p,small,.work-card p,.option em{color:var(--text-muted)}label{color:#f3f8ff;gap:8px;margin-top:16px;display:grid}input,textarea,select{border:1px solid var(--border);width:100%;color:var(--text-main);background:#050d19;border-radius:14px;outline:none;padding:12px 14px;transition:border-color .18s,box-shadow .18s,background-color .18s}input:focus,textarea:focus,select:focus{border-color:#2688ffcc;box-shadow:0 0 0 3px #2688ff2e}textarea{resize:vertical;min-height:94px}button,.modal-actions a{border:1px solid var(--border);color:var(--text-main);text-align:center;background:linear-gradient(#0d2038,#08172a);border-radius:14px;padding:11px 14px;text-decoration:none;transition:transform .18s,border-color .18s,background-color .18s,box-shadow .18s,opacity .18s}button:hover,.modal-actions a:hover{transform:translateY(-1px);box-shadow:0 10px 24px #0000002e}button:active,.modal-actions a:active{transform:translateY(0)scale(.99)}button:hover,button.active,.modal-actions a:hover{border-color:var(--accent)}button.active{background:linear-gradient(#2688ff2e,#081a31f5);box-shadow:inset 0 0 0 1px #2688ff2e}button.primary,.auth-card>button:not(.ghost),.generate{background:linear-gradient(135deg, var(--accent-strong), var(--accent));color:#fff;border:0;width:100%;margin-top:16px;font-weight:800;box-shadow:0 12px 28px #2688ff38}button.primary:hover,.generate:hover{background:var(--accent-hover)}button.ghost{background:0 0;width:100%;margin-top:10px}button:disabled{opacity:.45;cursor:not-allowed}.app-shell{background:radial-gradient(circle at 35% 0,#0f4d9438,#0000 34%),linear-gradient(#020813 0%,#01050d 100%);min-height:100svh;animation:.35s both page-fade}.topbar{border-bottom:1px solid var(--border);z-index:5;background:#040c18f0;justify-content:space-between;align-items:center;height:56px;padding:0 18px;animation:.42s both slide-down;display:flex;position:sticky;top:0}.top-actions{color:var(--text-muted);align-items:center;gap:10px;display:flex}.top-buy{white-space:nowrap;margin-top:0}.avatar{background:linear-gradient(135deg, var(--accent-strong), var(--accent));color:#fff;border-radius:50%;place-items:center;width:32px;height:32px;font-weight:800;display:grid;box-shadow:0 12px 28px #2688ff38}.workspace{grid-template-columns:360px minmax(0,1fr);min-height:calc(100svh - 56px);display:grid}.sidebar{border-right:1px solid var(--border);background:linear-gradient(#071426fa,#030a15fa);padding:16px;overflow:auto}.panel{background:var(--panel);border:1px solid var(--border);border-radius:22px;margin-bottom:14px;padding:16px;transition:border-color .18s,box-shadow .18s;animation:.45s both rise-in}.panel:hover{border-color:var(--panel-hover-border);box-shadow:0 18px 44px #00000024}.panel h2{margin-bottom:14px;font-size:18px}.service-grid{gap:8px;display:grid}.service-grid button{text-align:left}.quiz-step{border-top:1px solid var(--border);margin-top:16px;padding-top:16px;animation:.4s both soft-reveal}.quiz-step:first-of-type{border-top:0;padding-top:0}.quiz-step-header{text-align:left;color:#f3f8ff;background:0 0;border:0;grid-template-columns:auto 1fr auto auto;align-items:center;gap:10px;width:100%;margin:0;padding:0;font-weight:800;display:grid}.quiz-step-header:hover{box-shadow:none;transform:none}.quiz-step-number{background:var(--accent);color:#eaf5ff;border-radius:50%;place-items:center;width:24px;height:24px;font-size:13px;display:grid}.quiz-step-title{font-size:15px}.quiz-step-header strong{color:#73b7ff;text-transform:uppercase;letter-spacing:.04em;background:#2688ff2e;border-radius:999px;padding:4px 8px;font-size:11px}.quiz-step-chevron{transform-origin:50%;background:url(/chevron.svg) 50%/contain no-repeat;width:18px;height:18px;transition:transform .24s;display:block}.quiz-step.open .quiz-step-chevron{transform:rotate(180deg)}.quiz-step-content{opacity:0;grid-template-rows:0fr;transition:grid-template-rows .3s,opacity .22s,margin-top .3s;display:grid}.quiz-step.open .quiz-step-content{opacity:1;grid-template-rows:1fr;margin-top:14px}.quiz-step-inner{min-height:0;overflow:hidden}.upload{text-align:center;cursor:pointer;border:1px dashed #164674;border-radius:20px;place-items:center;min-height:190px;padding:16px;transition:border-color .18s,background-color .18s,transform .18s;display:grid;overflow:hidden}.upload:hover{border-color:var(--accent);background:#2688ff1f;transform:translateY(-1px)}.upload b{color:var(--accent);font-size:44px;line-height:1}.upload input{display:none}.upload img,.thumb img{object-fit:cover;border-radius:inherit;width:100%;height:100%}.modal-image img{object-fit:contain;border-radius:inherit;width:100%;max-width:100%;height:auto;max-height:min(72svh,720px);display:block}.format-grid{grid-template-columns:repeat(2,1fr);gap:8px;display:grid}.format-grid button{text-align:left;gap:2px;display:grid}.format-grid button:hover{box-shadow:none;transform:none}.format-grid span{color:var(--text-muted);font-size:12px}.option-grid{gap:8px;display:grid}.option{border:1px solid var(--border);backface-visibility:hidden;background:#07182c;border-radius:16px;grid-template-columns:auto 1fr;align-items:start;margin:0;padding:12px;transition:border-color .18s,background-color .18s;transform:translateZ(0)}.option:hover{border-color:var(--panel-hover-border);background:#0a1b31}.option.active{background:#2688ff24;border-color:#2688ffcc}.option small,.option em{margin-top:3px;display:block}.option em{font-size:12px;font-style:normal}.option input{width:auto;accent-color:var(--accent);margin-top:4px}.ai-row{grid-template-columns:1fr auto;align-items:start;gap:8px;margin-top:16px;display:grid}.ai-row.two{grid-template-columns:1fr auto}.check{align-items:center;gap:8px;display:flex}.check input{width:auto;accent-color:var(--accent)}.color-picker-row{grid-template-columns:48px 1fr;align-items:center;gap:10px;display:grid}.color-picker{cursor:pointer;width:48px;height:44px;padding:3px}.color-hex{text-transform:lowercase;font-family:ui-monospace,SFMono-Regular,Consolas,Liberation Mono,monospace}.summary{border:1px solid var(--border);color:#f3f8ff;background:#07182c;border-radius:14px;margin-top:16px;padding:12px;transition:border-color .18s,background-color .18s}.message{color:#73b7ff;margin:12px 0 0;animation:.25s both soft-reveal}.history{padding:36px 32px;animation:.5s 80ms both soft-reveal}.history-head{justify-content:space-between;align-items:center;gap:16px;margin-bottom:20px;display:flex}.history-head h1{margin:0;font-size:clamp(28px,4vw,46px)}.history-head span{color:var(--text-muted)}.cards{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;display:grid}.empty{border:1px dashed var(--border);color:var(--text-muted);text-align:center;background:linear-gradient(#09172aeb,#050d19f0);border-radius:22px;padding:36px}.work-card{border:1px solid var(--border);cursor:pointer;background:linear-gradient(#09172aeb,#050d19f0);border-radius:22px;padding:10px;transition:transform .2s,border-color .2s,box-shadow .2s;animation:.38s both card-in;position:relative}.work-card:hover{border-color:var(--panel-hover-border);transform:translateY(-3px);box-shadow:0 18px 42px #0003}.work-card button{background:#030a14db;padding:7px 10px;position:absolute;top:18px;right:18px}.thumb{aspect-ratio:3/4;border-radius:16px;place-items:center;display:grid;overflow:hidden}.work-card h3{white-space:nowrap;text-overflow:ellipsis;margin:12px 4px 4px;font-size:16px;overflow:hidden}.work-card p{margin:0 4px 4px}.modal{z-index:10;background:#000000b8;place-items:center;padding:20px;animation:.18s both overlay-fade;display:grid;position:fixed;inset:0}.modal section{border:1px solid var(--border);background:#061120;border-radius:26px;width:min(720px,100%);padding:18px;animation:.24s both modal-pop;position:relative}.close{position:absolute;top:18px;right:18px}.modal-image{border-radius:18px;place-items:center;min-height:180px;margin-bottom:16px;display:grid;overflow:auto}.modal-actions{flex-wrap:wrap;gap:8px;display:flex}@media (width<=820px){.workspace{grid-template-columns:1fr}.sidebar{border-right:0;border-bottom:1px solid var(--border)}.topbar{flex-wrap:wrap;gap:8px;height:auto;min-height:48px;padding-block:8px}.top-actions{flex-wrap:wrap}.history{padding:16px}}@media (width<=480px){.format-grid,.ai-row.two{grid-template-columns:1fr}.auth-card{border-radius:20px;padding:22px}}.generation-modal{z-index:20;text-align:center}.generation-modal section{width:min(420px,100%);padding:28px}.loader{justify-content:center;gap:10px;margin-bottom:18px;display:flex}.loader span{background:var(--accent);border-radius:50%;width:14px;height:14px;animation:.8s ease-in-out infinite loader-bounce}.loader span:nth-child(2){animation-delay:.12s}.loader span:nth-child(3){animation-delay:.24s}.generation-modal p{color:var(--text-muted);margin-bottom:0}@keyframes loader-bounce{0%,80%,to{opacity:.55;transform:translateY(0)}40%{opacity:1;transform:translateY(-10px)}}@keyframes page-fade{0%{opacity:0}to{opacity:1}}@keyframes rise-in{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes soft-reveal{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-down{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}@keyframes card-in{0%{opacity:0;transform:translateY(10px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes overlay-fade{0%{opacity:0}to{opacity:1}}@keyframes modal-pop{0%{opacity:0;transform:translateY(10px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.plan-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:18px;display:grid}.plan-card,.subscription-box{border:1px solid var(--border);background:#07182c;border-radius:18px;padding:14px}.plan-card h3{margin-bottom:8px}.plan-card strong,.subscription-box span,.subscription-box b{margin-bottom:8px;display:block}.paywall>p,.plan-card p{color:var(--text-muted)}.subscription-box{gap:4px;margin-top:16px;display:grid}.primary-link{color:#fff;margin-top:16px;font-weight:800;text-decoration:none;display:inline-block}@media (width<=720px){.plan-grid{grid-template-columns:1fr}}.thumb,.modal-image{position:relative}.locked-overlay{text-align:center;color:#fff;pointer-events:none;background:linear-gradient(#02081333,#020813b8);align-content:center;place-items:center;gap:6px;padding:16px;display:grid;position:absolute;inset:0}.locked-overlay strong{text-shadow:0 2px 10px #00000073;font-size:16px}.locked-overlay small{color:#eef6ffe0;max-width:220px;line-height:1.35}.lock-icon{background:#081222d1;border:1px solid #ffffff38;border-radius:50%;place-items:center;width:42px;height:42px;display:grid;box-shadow:0 12px 26px #00000047}.locked-badge{z-index:2;color:#fff;background:#030a14db;border:1px solid #ffffff29;border-radius:999px;padding:6px 10px;font-size:12px;font-weight:800;position:absolute;top:18px;left:18px}.modal-lock small{max-width:320px}.unlock-cta{width:auto;margin-top:0}