:root{--bg:#08080f;--surface:#12121b;--surface2:#1b1a27;--fg:#f7f7fb;--muted:#a5a4b3;--faint:#6f6d7e;--line:#ffffff16;--accent:#a855f7;--accent2:#ec4899}*{box-sizing:border-box} [hidden]{display:none !important} body{margin:0;background:radial-gradient(ellipse at 60% -30%,#28203d,#0b0a12 48%,#08080f);color:var(--fg);font:14px Inter,ui-sans-serif,system-ui,sans-serif;min-height:100vh}.shell{max-width:1180px;margin:auto;padding:0 24px}.appbar{height:70px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;background:#0b0a12cc;backdrop-filter:blur(16px);position:sticky;top:0;z-index:5;animation:barIn .7s ease both}.brand{color:#fff;text-decoration:none;font-size:18px;font-weight:700;display:flex;align-items:center;gap:8px}.brand i{font-style:normal;font-size:15px;display:grid;place-items:center;width:27px;height:27px;border-radius:8px;background:linear-gradient(135deg,#f472b6,#8b5cf6)}.nav{display:flex;gap:4px}.nav a{color:var(--muted);text-decoration:none;padding:8px 13px;border-radius:999px;font-size:13px;transition:transform .2s,background .2s,color .2s}.nav a:hover,.nav a.on{color:#fff;background:#ffffff0c;transform:translateY(-1px)}.bar-actions{display:flex;align-items:center;gap:10px}.credit{border:1px solid var(--line);border-radius:999px;padding:7px 12px;color:#d8b4fe;font-size:12px}.user-menu,.outline{border:1px solid var(--line);background:#ffffff06;color:var(--fg);border-radius:999px;padding:8px 13px;cursor:pointer}.page{padding:38px 0 70px;animation:pageIn .55s ease both}.page-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:24px}.page-head h1{font-size:31px;letter-spacing:-.04em;margin:0 0 5px}.page-head p{color:var(--muted);margin:0}.panel{border:1px solid var(--line);background:linear-gradient(145deg,#ffffff0a,#ffffff03);border-radius:20px;padding:22px;animation:panelIn .6s cubic-bezier(.2,.7,.2,1) both;transition:border-color .25s,box-shadow .25s,transform .25s}.panel:hover{border-color:#a78bfa33;box-shadow:0 24px 80px -55px #a855f7}.workspace{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(340px,.95fr);gap:20px}.field-label{display:block;color:#d7d5e0;font-size:12px;margin:0 0 8px}.prompt{width:100%;min-height:150px;border:1px solid var(--line);border-radius:13px;background:#ffffff07;color:#fff;padding:14px;resize:vertical;outline:0;font:14px/1.7 inherit}.prompt:focus,.select:focus,.text-input:focus{border-color:#a78bfa;box-shadow:0 0 0 3px #a78bfa22}.counter{float:right;color:var(--faint);font-size:11px;margin-top:5px}.select,.text-input{width:100%;border:1px solid var(--line);border-radius:10px;background:var(--surface2);color:#fff;padding:11px 12px;outline:0}.row{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:18px}.choices{display:flex;flex-wrap:wrap;gap:7px}.choice{border:1px solid var(--line);border-radius:9px;background:#ffffff05;color:var(--muted);padding:8px 12px;cursor:pointer;font-size:12px}.choice.on{color:#fff;border-color:#a78bfa99;background:#a855f726}.dropzone{border:1px dashed #a78bfa66;border-radius:13px;padding:22px;text-align:center;color:var(--muted);cursor:pointer;background:#a855f70b;margin-top:18px;transition:background .25s,border-color .25s,transform .25s}.dropzone:hover{background:#a855f716;border-color:#d8b4fe;transform:translateY(-2px)}.dropzone strong{display:block;color:#d8b4fe;margin-bottom:5px}.dropzone input{display:none}.refs{display:flex;gap:7px;margin-top:9px}.refs img{width:58px;height:58px;object-fit:cover;border-radius:8px;border:1px solid var(--line);animation:popIn .35s ease both}.submit{width:100%;border:0;border-radius:11px;background:linear-gradient(135deg,#e879f9,#8b5cf6);color:#fff;padding:13px;font-weight:700;cursor:pointer;margin-top:20px;transition:transform .2s,filter .2s,box-shadow .2s}.submit:hover:not(:disabled){transform:translateY(-2px);filter:brightness(1.08);box-shadow:0 12px 30px -15px #c084fc}.submit:disabled{opacity:.55;cursor:not-allowed}.preview{min-height:500px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.preview.empty:before{content:"✦";position:absolute;font-size:80px;color:#d8b4fe22;filter:blur(.2px);animation:starBreath 3.5s ease-in-out infinite}.preview-copy{text-align:center;color:var(--muted);position:relative}.preview-copy h3{color:#e8e6ef;margin:0 0 7px}.result-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;width:100%;align-self:stretch}.result-grid img{width:100%;height:100%;min-height:210px;object-fit:cover;border-radius:12px;border:1px solid var(--line);transition:transform .3s,filter .3s}.result-grid a:hover img{transform:scale(1.02);filter:saturate(1.1)}.job-badge{position:absolute;top:14px;right:14px;color:#d8b4fe;background:#a855f71c;border-radius:999px;padding:5px 9px;font-size:11px}.tabs{display:flex;gap:8px;margin-bottom:20px}.tab{border:1px solid var(--line);background:#ffffff05;color:var(--muted);border-radius:999px;padding:8px 15px;cursor:pointer;transition:transform .2s,background .2s,border-color .2s}.tab:hover{transform:translateY(-1px)}.tab.on{color:#fff;background:#a855f72b;border-color:#a78bfa80}.filters{display:flex;gap:10px;margin-bottom:20px}.filters .text-input{max-width:300px}.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.work{position:relative;border-radius:14px;overflow:hidden;border:1px solid var(--line);background:var(--surface);aspect-ratio:4/5;animation:panelIn .55s ease both}.work img{width:100%;height:100%;object-fit:cover;transition:transform .4s}.work:hover img{transform:scale(1.05)}.work .meta{position:absolute;inset:auto 0 0;padding:30px 11px 10px;background:linear-gradient(transparent,#000c);font-size:11px}.work .meta b{display:block;font-size:12px;margin-bottom:3px}.empty-state{text-align:center;padding:90px 20px;color:var(--muted);grid-column:1/-1}.empty-state strong{display:block;color:#ddd;font-size:16px;margin-bottom:8px}.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.settings-card h2{font-size:17px;margin:0 0 8px}.settings-card>p{color:var(--muted);font-size:12px;line-height:1.6}.kv{display:grid;grid-template-columns:100px 1fr;gap:11px;padding:10px 0;border-bottom:1px solid var(--line);font-size:13px}.kv label{color:var(--faint)}.api-key{font-family:ui-monospace,monospace;color:#d8b4fe;word-break:break-all;background:#a855f712;border:1px solid #a855f733;border-radius:9px;padding:11px;margin:13px 0;font-size:12px}.btn{border:1px solid var(--line);background:#ffffff08;color:#fff;border-radius:9px;padding:9px 13px;cursor:pointer;transition:transform .2s,background .2s}.btn:hover{transform:translateY(-1px);background:#ffffff12}.btn.primary{border:0;background:linear-gradient(135deg,#e879f9,#8b5cf6)}.stack{display:grid;gap:9px}.toast{position:fixed;left:50%;bottom:26px;transform:translate(-50%,20px);background:#201e2d;border:1px solid var(--line);border-radius:999px;padding:10px 16px;color:#fff;opacity:0;transition:.2s;z-index:20}.toast.show{opacity:1;transform:translate(-50%,0)}@keyframes barIn{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}@keyframes pageIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@keyframes panelIn{from{opacity:0;transform:translateY(14px) scale(.99)}to{opacity:1;transform:none}}@keyframes popIn{from{opacity:0;transform:scale(.85)}to{opacity:1;transform:none}}@keyframes starBreath{0%,100%{opacity:.45;transform:scale(.9) rotate(0)}50%{opacity:1;transform:scale(1.08) rotate(12deg)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms !important;transition-duration:.001ms !important}}@media(max-width:850px){.workspace,.settings-grid{grid-template-columns:1fr}.gallery{grid-template-columns:repeat(2,1fr)}.nav{display:none}}@media(max-width:520px){.shell{padding:0 16px}.credit{display:none}.page{padding-top:25px}.row{grid-template-columns:1fr}.gallery{grid-template-columns:1fr 1fr}.appbar{height:62px}.page-head h1{font-size:26px}}
:root{--progress-ring:conic-gradient(#c084fc,#ec4899,#38bdf8,#c084fc)}.progress-card{display:flex;flex-direction:column;align-items:center}.progress-ring{width:92px;height:92px;border-radius:50%;display:grid;place-items:center;margin-bottom:20px;background:var(--progress-ring);position:relative;animation:spinGlow 2.2s linear infinite}.progress-ring:before{content:"";position:absolute;inset:6px;border-radius:50%;background:var(--surface)}.progress-ring span{position:relative;color:#e9d5ff;font-size:14px;font-weight:700}@keyframes spinGlow{to{filter:hue-rotate(360deg);transform:rotate(360deg)}}
.package-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.package{display:grid;gap:6px;padding:14px;border:1px solid var(--line);border-radius:13px;background:#ffffff06}.package b{font-size:13px}.package strong{font-size:18px;color:#e9d5ff}.package span{font-size:12px;color:var(--muted)}.package button{margin-top:6px}@media(max-width:700px){.package-grid{grid-template-columns:1fr}}

.auth-kicker{margin:8px 0 0;color:var(--muted);font-size:12px}.auth-hint{margin:0;color:var(--faint);font-size:11px}.auth-message{min-height:20px;margin:12px 0 0;color:#fda4af;font-size:12px}.auth-card .brand{margin-bottom:2px}.auth-card .submit{position:relative;overflow:hidden;box-shadow:0 12px 35px -18px #c084fc}.auth-card .submit:after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 20%,#fff5 50%,transparent 80%);transform:translateX(-120%);animation:buttonSheen 3.8s ease-in-out infinite}@keyframes buttonSheen{0%,55%,100%{transform:translateX(-120%)}70%{transform:translateX(120%)}}

/* Ensure the inactive authentication form never participates in layout. */
[hidden]{display:none !important}
html{min-height:100%;background:#08080f}.login-page{position:relative;isolation:isolate;overflow:hidden;min-height:100vh;display:grid;place-items:center;padding:28px 20px;background:radial-gradient(circle at 50% 20%,#39205d44,transparent 40%)}.auth-card{width:min(420px,100%);padding:30px}
.login-page:before,.login-page:after{content:"";position:absolute;width:26rem;height:26rem;border-radius:50%;filter:blur(90px);opacity:.18;pointer-events:none;z-index:-1;animation:loginOrb 12s ease-in-out infinite alternate}.login-page:before{left:-12rem;top:15%;background:#8b5cf6}.login-page:after{right:-12rem;bottom:8%;background:#ec4899;animation-delay:-5s}
.auth-card{animation:authIn .65s cubic-bezier(.2,.7,.2,1) both;box-shadow:0 28px 100px -40px #a855f7aa}.auth-card .brand{margin-bottom:4px}.auth-card .tabs{margin-top:24px}.auth-card .tab{min-width:74px}.auth-card form{animation:authFormIn .35s ease both}.auth-card .submit{box-shadow:0 12px 35px -18px #c084fc;position:relative;overflow:hidden}.auth-card .submit:after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 20%,#fff5 50%,transparent 80%);transform:translateX(-120%);animation:buttonSheen 3.8s ease-in-out infinite}
@keyframes authIn{from{opacity:0;transform:translateY(18px) scale(.98)}to{opacity:1;transform:none}}@keyframes authFormIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}@keyframes loginOrb{to{transform:translate(7%, -5%) scale(1.12)}}@keyframes buttonSheen{0%,55%,100%{transform:translateX(-120%)}70%{transform:translateX(120%)}}
[hidden]{display:none !important}
html{overflow-x:hidden}
.language-toggle{min-width:48px;height:34px;border:1px solid var(--line);border-radius:8px;background:#ffffff06;color:var(--fg);font:600 12px/1 inherit;cursor:pointer;transition:border-color .2s,background .2s}.language-toggle:hover{border-color:#a78bfa88;background:#ffffff0d}.auth-language{position:absolute;right:16px;top:16px}.auth-card{position:relative}.mobile-nav-actions{display:flex;align-items:center;gap:8px}@media(max-width:520px){.bar-actions{gap:6px}.user-menu{padding:8px 10px}.language-toggle{min-width:44px}}
.appbar-inner{display:flex;width:100%;align-items:center;justify-content:space-between}.settings-subhead{margin-top:28px !important}.button-row{display:flex;gap:8px;flex-wrap:wrap}.key-help{margin-top:12px !important}.key-help a,.docs-note a{color:#d8b4fe}.recent-orders h3{font-size:14px;margin:22px 0 4px}.gallery-pager{display:flex;justify-content:center;align-items:center;gap:14px;margin-top:26px;color:var(--muted)}.work>a{display:block;width:100%;height:100%}.work-delete,.work-download{position:absolute;top:8px;width:30px;height:30px;border:1px solid #ffffff22;border-radius:8px;background:#090910cc;color:#fff;cursor:pointer;opacity:0;transition:opacity .2s,background .2s;z-index:2}.work-delete{right:8px;font-size:18px}.work-download{left:8px;display:grid !important;place-items:center;text-decoration:none;font-size:16px}.work .work-download{width:30px;height:30px}.work:hover .work-delete,.work-delete:focus,.work:hover .work-download,.work-download:focus{opacity:1}.work-status{display:grid;place-items:center;padding:22px;color:var(--muted)}.work-status>div{display:grid;gap:7px;text-align:center}.work-status strong{color:var(--fg)}
.docs-page{padding:38px 24px 90px}.docs-hero{padding:16px 0 38px;max-width:940px}.docs-badge{display:inline-flex;padding:6px 9px;border:1px solid #c084fc44;border-radius:7px;background:#a855f714;color:#e9d5ff;font-size:11px;font-weight:700}.docs-hero h1{font-size:clamp(40px,7vw,72px);letter-spacing:0;margin:13px 0 8px}.docs-hero>p{max-width:760px;color:var(--muted);font-size:16px;line-height:1.7;margin:0}.capability-callout{display:flex;gap:10px;align-items:baseline;margin-top:20px;padding-left:14px;border-left:2px solid #c084fc;color:var(--muted)}.capability-callout strong{color:var(--fg);white-space:nowrap}.docs-split{display:grid;grid-template-columns:1fr 1fr;gap:14px}.docs-panel{border:1px solid var(--line);border-radius:8px;background:#ffffff05;padding:24px}.docs-panel h2{font-size:14px;margin:0 0 18px}.docs-kv{display:grid;grid-template-columns:120px 1fr;gap:14px;padding:9px 0;color:var(--muted)}.docs-kv code{color:#e9d5ff;text-align:right;word-break:break-all}.endpoint-row{display:grid;grid-template-columns:46px minmax(180px,1fr) auto;align-items:center;gap:9px;padding:8px 0;color:var(--muted)}.endpoint-row code{color:#ddd}.method{width:42px;padding:3px 4px;border-radius:4px;text-align:center;font-size:10px}.method.get{background:#10b98122;color:#6ee7b7}.method.post{background:#38bdf822;color:#7dd3fc}.docs-note{color:var(--muted);font-size:12px;line-height:1.65;margin:16px 0 0}.docs-section{padding:54px 0 4px}.docs-section-head{display:grid;grid-template-columns:44px 1fr;gap:14px;align-items:start;margin-bottom:20px}.docs-section-head>span{display:grid;place-items:center;width:38px;height:38px;border:1px solid var(--line);border-radius:7px;color:#d8b4fe;font-weight:700}.docs-section-head h2{font-size:26px;margin:2px 0 4px}.docs-section-head p{color:var(--muted);margin:0;line-height:1.6}.code-block{overflow:hidden;border:1px solid var(--line);border-radius:8px;background:#09090f}.code-head{height:42px;padding:0 14px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);color:var(--muted);font-size:12px}.copy-code{border:0;background:transparent;color:#d8b4fe;cursor:pointer}.code-block pre{margin:0;padding:20px;overflow:auto;color:#d7d4df;font:12px/1.75 ui-monospace,SFMono-Regular,Consolas,monospace}.model-reference{border:1px solid var(--line);border-radius:8px;background:#ffffff04;padding:20px}.model-reference-main{display:grid;grid-template-columns:2fr 1fr 1fr;gap:18px}.model-reference-main>div{display:grid;gap:5px}.model-reference-main span{color:var(--faint);font-size:10px}.model-reference-main strong{font-size:15px}.model-capabilities{display:flex;gap:7px;flex-wrap:wrap;margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}.model-capabilities span,.model-capabilities code{padding:5px 8px;border-radius:5px;background:#ffffff08;color:#c9c6d2;font-size:11px}.docs-table-wrap{overflow:auto;border:1px solid var(--line);border-radius:8px}.docs-table{width:100%;border-collapse:collapse;min-width:700px}.docs-table th,.docs-table td{text-align:left;padding:13px 14px;border-bottom:1px solid var(--line);font-size:12px;line-height:1.5}.docs-table th{color:var(--faint);font-weight:600;background:#ffffff04}.docs-table td{color:var(--muted)}.docs-table td:first-child,.docs-table code{color:#e9d5ff}.docs-table tr:last-child td{border-bottom:0}.docs-subtitle{font-size:15px;margin:24px 0 12px}.ratio-reference{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.ratio-reference>div{display:grid;gap:5px;padding:12px;border:1px solid var(--line);border-radius:7px;background:#ffffff04}.ratio-reference strong{font-size:12px}.ratio-reference code{color:#d8b4fe;font-size:11px}.example-tabs{display:flex;gap:7px;margin-bottom:10px;overflow:auto}.example-tabs button{border:1px solid var(--line);border-radius:7px;background:#ffffff05;color:var(--muted);padding:8px 11px;white-space:nowrap;cursor:pointer}.example-tabs button.on{background:#a855f724;border-color:#c084fc55;color:#fff}.billing-points{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:14px;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:var(--line)}.billing-points>div{display:grid;gap:7px;padding:18px;background:#11111a}.billing-points span{color:var(--muted);font-size:12px;line-height:1.6}.error-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.error-grid>div{display:flex;gap:10px;padding:13px;border:1px solid var(--line);border-radius:7px;background:#ffffff04;color:var(--muted);font-size:12px}.error-grid code{color:#fda4af}.result-note{margin:0 0 12px;padding:9px 11px;border:1px solid #f59e0b44;border-radius:7px;background:#f59e0b12;color:#fcd34d;font-size:12px}
@media(max-width:800px){.docs-split,.billing-points{grid-template-columns:1fr}.ratio-reference{grid-template-columns:repeat(2,1fr)}.endpoint-row{grid-template-columns:46px 1fr}.endpoint-row span{grid-column:2}.model-reference-main{grid-template-columns:1fr}.capability-callout{align-items:flex-start;flex-direction:column}.work-delete,.work-download{opacity:1}}
.model-reference-item+.model-reference-item{margin-top:20px;padding-top:20px;border-top:1px solid var(--line)}.model-reference-main code{color:#aaa4b8;font-size:11px}.model-reference-description{margin:14px 0 0;color:var(--muted);font-size:12px;line-height:1.6;white-space:pre-wrap;overflow-wrap:anywhere}
@media(max-width:520px){.docs-page{padding:24px 16px 70px}.docs-hero h1{font-size:42px}.docs-section{padding-top:42px}.docs-kv{grid-template-columns:1fr}.docs-kv code{text-align:left}.docs-panel{padding:18px}.error-grid{grid-template-columns:1fr}.ratio-reference{grid-template-columns:1fr 1fr}}
@media(max-width:850px){.appbar{animation:none;backdrop-filter:none}.appbar .nav{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:50;height:58px;align-items:center;justify-content:center;gap:2px;padding:7px 8px calc(7px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:#0b0a12f2;backdrop-filter:blur(16px);overflow-x:auto}.appbar .nav a{flex:0 0 auto;padding:8px 10px;border-radius:7px;font-size:11px}.page,.studio-page,.docs-page{padding-bottom:82px}}
.site-announcement{margin-bottom:16px;border:1px solid #f3be5345;border-radius:6px;background:#f3be530d;color:#e7c67d;padding:10px 13px;font-size:12px;line-height:1.55}.shell-announcement{width:100%}.payment-methods{display:flex;gap:6px;flex-wrap:wrap;margin:12px 0}.payment-method{min-width:86px;border:1px solid var(--line);border-radius:7px;background:#ffffff05;color:var(--muted);padding:8px 11px;cursor:pointer}.payment-method.on{border-color:#a78bfa88;background:#a855f721;color:#fff}.referral-history{margin-top:18px}.referral-history h3{font-size:13px;margin:0 0 5px}.referral-entry{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;padding:9px 0;border-bottom:1px solid var(--line)}.referral-entry b{font-size:12px}.referral-entry span,.referral-entry time{color:var(--faint);font-size:10px}.referral-entry .rewarded{color:#86efac}.payment-result{margin:0 0 18px;border:1px solid #22c55e44;border-radius:7px;background:#22c55e12;color:#bbf7d0;padding:11px 13px}.payment-result.invalid{border-color:#f8717144;background:#f8717110;color:#fecaca}
.ledger-card{grid-column:1/-1}.ledger-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}.ledger-head p{margin:0;color:var(--muted);font-size:12px}.ledger-summary{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.ledger-summary span{min-width:86px;padding:8px 10px;border:1px solid var(--line);border-radius:7px;background:#ffffff05;color:var(--faint);font-size:10px;text-align:right}.ledger-summary b{display:block;color:var(--fg);font-size:15px}.credit-ledger{margin-top:18px;border-top:1px solid var(--line)}.credit-ledger-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:center;padding:13px 2px;border-bottom:1px solid var(--line)}.credit-ledger-row>div:first-child{min-width:0}.credit-ledger-row b{display:block;overflow-wrap:anywhere;font-size:12px}.credit-ledger-row small{display:block;margin-top:4px;color:var(--faint);font-size:10px}.ledger-amount{text-align:right;font-size:13px;font-weight:700}.ledger-amount.positive{color:#86efac}.ledger-amount.negative{color:#fda4af}.ledger-amount span{color:inherit;font-size:10px;font-weight:500}.ledger-amount small{font-weight:400}.ledger-empty{padding:32px 0;color:var(--faint);text-align:center}.ledger-footer{display:flex;align-items:center;justify-content:center;gap:12px;padding-top:16px}.ledger-page-status{color:var(--faint);font-size:10px}@media(max-width:600px){.ledger-head{display:block}.ledger-summary{justify-content:flex-start;margin-top:14px}.ledger-summary span{flex:1;text-align:left}.credit-ledger-row{align-items:start}.ledger-amount{min-width:88px}.ledger-card{padding:18px}}
.video-nav-locked{opacity:.58;cursor:not-allowed;position:relative}.video-nav-locked::after{content:"\1f512";margin-left:5px;font-size:9px;line-height:1}.landing-video-link.video-nav-locked::after{content:none;margin-left:0}.video-nav-locked:hover{opacity:.9;color:#f6d68a}

/* Mobile application chrome stays usable when all navigation items are present. */
@media(max-width:850px){
  .appbar .nav{justify-content:flex-start;scrollbar-width:none;-ms-overflow-style:none;overscroll-behavior-inline:contain}
  .appbar .nav::-webkit-scrollbar{display:none}
}
@media(max-width:620px){
  .appbar-inner{gap:8px}
  .bar-actions{min-width:0;flex:0 1 auto}
  .user-menu{display:inline-flex;min-width:0;max-width:36vw;align-items:center;white-space:nowrap;overflow:hidden}
  .user-menu>[data-en],.user-menu>[data-zh]{display:none!important}
  .user-menu>[data-username]{display:inline-block;min-width:0;max-width:100%;overflow:hidden;text-overflow:ellipsis;vertical-align:middle}
  .control-title{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:start}
  .capability-state{min-width:0;text-align:right;line-height:1.45;overflow-wrap:anywhere}
}

/* Grid tracks and cards must be allowed to shrink on narrow account screens. */
.settings-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.settings-grid>.settings-card{min-width:0;max-width:100%}
@media(max-width:850px){
  .workspace,.settings-grid{grid-template-columns:minmax(0,1fr)}
}

/* Keep a transient server restart from looking like a forced logout.  The
   shell status is inserted at the top of signed-in pages by app.js and is
   intentionally compact so it does not push the composer or ticket layout
   off-screen. */
.shell-connection-status{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin:0 0 18px;
  padding:10px 12px;
  border:1px solid #f0b35b55;
  border-radius:9px;
  background:#f0b35b12;
  color:#f5d49a;
  font-size:12px;
  line-height:1.45;
}
.shell-connection-status[hidden]{display:none}
.shell-connection-retry{
  flex:0 0 auto;
  border:1px solid #f0b35b66;
  border-radius:6px;
  padding:6px 10px;
  background:#f0b35b1c;
  color:#ffe4b2;
  font:600 11px/1.2 inherit;
  cursor:pointer;
}
.shell-connection-retry:hover{background:#f0b35b2e}
body.light .shell-connection-status{border-color:#b9791f55;background:#fff5df;color:#6c4815}
body.light .shell-connection-retry{border-color:#b9791f66;background:#fff0c9;color:#6c4815}
@media(max-width:520px){
  .shell-connection-status{align-items:flex-start;flex-direction:column;gap:8px}
  .shell-connection-retry{width:100%}
}

/* Beyond-inspired workspace skin: original Circles implementation. */
:root { --beyond-ink:#070b14; --beyond-glass:rgba(19,29,46,.70); --beyond-line:rgba(202,219,239,.20); --beyond-silver:#d8e5f2; --beyond-muted:#93a9c1; --beyond-rose:#e8a1b7; --beyond-ice:#9fd3e7; --beyond-ease:cubic-bezier(.23,1,.32,1); }
body { background: radial-gradient(ellipse at 90% -10%, rgba(232,161,183,.14), transparent 32%), radial-gradient(ellipse at 0 35%, rgba(159,211,231,.14), transparent 35%), #070b14; color:var(--beyond-silver); }
.appbar { background:rgba(7,11,20,.78); border-bottom-color:var(--beyond-line); backdrop-filter:blur(20px); }
.brand { font-family:"Noto Serif SC", Georgia, serif; letter-spacing:.04em; }
.brand i { background:radial-gradient(circle at 30% 25%, #f5d5df, var(--beyond-rose) 42%, #789db9); border-radius:50%; box-shadow:0 0 24px rgba(232,161,183,.3); }
.nav a { transition:transform 160ms var(--beyond-ease), background 160ms ease, color 160ms ease; }
.nav a:hover,.nav a.on { background:rgba(216,229,242,.1); color:var(--beyond-silver); transform:translateY(-1px); }
.panel,.settings-card,.work { border-color:var(--beyond-line); background:linear-gradient(145deg,rgba(216,229,242,.10),rgba(216,229,242,.025)); box-shadow:inset 0 1px rgba(255,255,255,.08); backdrop-filter:blur(16px); }
.page-head h1,.panel h2,.recent-head h2 { font-family:"Noto Serif SC", Georgia, serif; font-weight:500; }
.prompt,.select,.text-input { background:rgba(7,11,20,.46); border-color:var(--beyond-line); color:var(--beyond-silver); }
.prompt:focus,.select:focus,.text-input:focus { border-color:var(--beyond-ice); box-shadow:0 0 0 3px rgba(159,211,231,.14); }
.choice,.tab { border-color:var(--beyond-line); background:rgba(216,229,242,.06); transition:transform 160ms var(--beyond-ease), border-color 160ms ease, background 160ms ease; }
.choice.on,.tab.on { border-color:var(--beyond-rose); background:rgba(232,161,183,.16); color:var(--beyond-silver); }
.dropzone { border-color:rgba(159,211,231,.55); background:rgba(159,211,231,.07); }
.dropzone:hover { border-color:var(--beyond-rose); background:rgba(232,161,183,.10); }
.submit { background:linear-gradient(135deg,#d78fa9,#8bbbd2); color:#101827; box-shadow:0 16px 34px -18px rgba(232,161,183,.8); transition:transform 160ms var(--beyond-ease), filter 160ms ease, box-shadow 160ms ease; }
.submit:active,.outline:active,.user-menu:active,.choice:active,.tab:active { transform:scale(.97); }
.preview.empty:before { color:rgba(159,211,231,.25); }
.work { border-radius:12px; }
.work:hover img { transform:scale(1.035); }
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { animation-duration:.01ms !important; transition-duration:.01ms !important; } }
