/* Task-first layout; brand colors and shared editor/rendering controls are retained. */
.site-header { display:flex; min-height:72px; padding-block:.5rem; gap:1.1rem; flex-wrap:nowrap; }
.site-brand { margin:0; }.site-brand img { width:136px; height:54px; }
.site-navigation { order:0; width:auto; flex:1; gap:1.1rem; margin:0; overflow:visible; }
.site-wallet-area { display:flex; align-items:center; gap:.9rem; flex-shrink:0; }
.site-wallet-link { font-size:.8rem; white-space:nowrap; }
.site-plans-link { display:inline-flex; background:var(--accent); color:var(--on-accent); border-color:var(--accent); padding:.65rem .9rem; }
.site-account-menu { position:relative; border:0; padding:0; margin:0; flex-shrink:0; }
.site-account-menu>summary { padding:.55rem .65rem; font-size:.8rem; border-radius:8px; }
.site-account-menu[open]>summary { margin:0; background:var(--panel-soft); }
.site-account-menu>div { position:absolute; z-index:12; right:0; top:calc(100% + 12px); width:220px; display:grid; gap:.25rem; padding:.75rem; background:var(--card); border:1px solid var(--border); border-radius:12px; box-shadow:var(--shadow); }
.site-account-menu a { text-decoration:none; padding:.45rem .6rem; color:var(--ink); font-size:.85rem; border-radius:6px; }
.site-account-menu a:hover { background:var(--panel-soft); }
.site-account-menu .site-appearance { display:grid; font-size:.75rem; padding:.5rem .6rem; border-top:1px solid var(--border); }
.site-demo-banner { font-size:.7rem; padding-block:.35rem; }
.site-pricing-heading { display:flex; justify-content:space-between; align-items:start; gap:1.5rem; margin-bottom:.7rem; }
.site-pricing-heading p { margin:.5rem 0; color:var(--ink-soft); }.site-pricing-heading>a { white-space:nowrap; font-size:.8rem; }
.pricing-disclosure,.account-local-note { color:var(--ink-soft); font-size:.78rem; margin:0 0 1rem; }
.credit-pack-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.credit-pack { min-width:0; border:1px solid var(--border); background:var(--card); border-radius:16px; padding:1.35rem; display:flex; flex-direction:column; gap:.7rem; }
.credit-pack.is-recommended { border:2px solid var(--accent); }
.credit-pack h2 { margin:0; font-size:1.5rem; }.credit-pack p { margin:0; }
.credit-pack .pack-kicker { color:var(--accent); font-weight:600; font-size:.72rem; }
.credit-pack .pack-price { font-size:2rem; font-weight:700; color:var(--ink); }
.credit-pack .pack-description { font-size:.85rem; }
.credit-pack small { color:var(--ink-soft); font-size:.7rem; }.credit-pack button { margin-top:auto; }
.pack-remaining { color:var(--accent); font-size:.8rem; font-weight:600; }
.credit-monthly { display:flex; align-items:center; gap:1rem; margin:1rem 0 2rem; padding:1rem 1.2rem; border:1px solid var(--border); border-radius:12px; background:var(--panel-soft); }
.monthly-title { font-weight:600; }.credit-monthly p { flex:1; font-size:.8rem; color:var(--ink-soft); margin:0; }.credit-monthly button { flex-shrink:0; }
.price-calculator { margin:1.8rem 0; padding:1.5rem; border:1px solid var(--border); border-radius:16px; background:var(--card); }
.price-calculator h2 { font-size:1.4rem; margin:.4rem 0; }.price-calculator p { color:var(--ink-soft); font-size:.8rem; }
.price-calculator-fields { display:grid; grid-template-columns:minmax(0,1.25fr) repeat(2,minmax(0,1fr)) minmax(0,.8fr); gap:.8rem; margin:1rem 0; }
.price-calculator-fields label,.price-calculator-fields input,.price-calculator-fields select { min-width:0; width:100%; }
#creditEstimateResult { font-size:1.6rem; color:var(--accent); }
.credit-resume { background:var(--panel-soft); border:1px solid var(--accent); border-radius:12px; padding:1rem 1.2rem; margin-bottom:1rem; }
.credit-resume p { margin:.4rem 0 .7rem; font-size:.8rem; }.credit-resume button { margin-right:.5rem; }
#creditDialog { width:min(820px,94vw); }#creditDialog .credit-modal-packs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.7rem; }
#creditDialog .credit-pack { padding:.9rem; }#creditDialog .credit-pack h2 { font-size:1.15rem; }#creditDialog .pack-price { font-size:1.5rem; }#creditDialog .credit-pack button { font-size:.75rem; }
.output-snapshot-title { font-weight:600; color:var(--accent); }
.account-section-nav { display:flex; gap:1.5rem; border-bottom:1px solid var(--border); margin:1.2rem 0; overflow:auto; }
.account-section-nav button { border:0; background:none; border-radius:0; padding:.7rem .2rem; white-space:nowrap; }
.account-section-nav button[aria-selected=true] { color:var(--accent); box-shadow:inset 0 -3px var(--accent); }
#accountIdentity .account-columns { display:block; max-width:650px; }
#accountIdentity .account-card { margin-top:1rem; }
#accountProfilePanel>.account-card:first-child { padding-block:1rem; }
#accountDevelopment { margin-top:2rem; font-size:.85rem; }#accountMailbox .account-card { background:transparent; }
.site-home-hero { grid-template-columns:.9fr 1.1fr; padding:2.5rem; gap:2rem; }
.site-home-hero h1 { font-size:clamp(2.4rem,3.6vw,4.1rem); line-height:1.08; }
.site-home-hero p { font-size:.95rem; }.home-start { margin:1.3rem 0; }.home-resume { display:block; margin:1rem 0; font-size:.9rem; font-weight:600; }
.home-demo { border:1px solid var(--border); border-radius:14px; overflow:hidden; background:var(--bg-1); min-width:0; }
.home-demo-heading { display:flex; justify-content:space-between; gap:1rem; padding:.8rem 1rem; font-size:.7rem; color:var(--ink-soft); }
.home-demo canvas { display:block; width:100%; height:auto; }
.home-demo-controls { display:flex; align-items:center; gap:1rem; padding:1rem; border-top:1px solid var(--border); }.home-demo-controls span { color:var(--ink-soft); font-size:.7rem; }
.site-home-steps article { border-top:1px solid var(--border); padding-top:1.3rem; }.site-home-steps h2 { font-size:1.25rem; }.result-number { color:var(--accent); font-size:.7rem; font-weight:700; letter-spacing:.08em; }
.site-home-steps a { font-size:.8rem; }.home-credit-callout { display:flex; gap:2rem; align-items:center; justify-content:space-between; background:var(--panel-soft); padding:2rem; border:1px solid var(--border); border-radius:16px; margin:2rem 0; }
.home-credit-callout h2 { font-size:1.5rem; margin:.5rem 0; }.home-credit-callout p { font-size:.85rem; color:var(--ink-soft); }.home-credit-callout>a { white-space:nowrap; }
#siteSettingsSheet { color:var(--ink); background:var(--card); border:1px solid var(--border); border-radius:16px; padding:1.5rem; width:min(820px,94vw); max-height:90vh; overflow:auto; }
#siteSettingsSheet::backdrop { background:#100c08aa; }
.output-choice-grid { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin:1rem 0; }.output-choice-grid article { border:1px solid var(--border); border-radius:12px; padding:1rem; display:flex; flex-direction:column; gap:.7rem; }.output-choice-grid h3,.output-choice-grid p { margin:0; }.output-choice-grid p { color:var(--ink-soft); font-size:.85rem; }.output-choice-grid strong { font-size:.75rem; color:var(--accent); }.output-choice-grid button { margin-top:auto; }
.note-inspector-hint { padding-bottom:1rem; }.note-inspector-hint p { color:var(--ink-soft); font-size:.85rem; }
#siteNoteInspector:not(.has-selection):not(.manual-note)>details { display:none; }
#siteNoteInspector.has-selection>.note-inspector-hint,#siteNoteInspector.manual-note>.note-inspector-hint { display:none; }
.site-mobile-settings { display:none; }
@media(min-width:801px) {
  body[data-page=studio] .site-content { margin-block:.7rem; }
  body[data-page=studio] #siteStudio { height:calc(100dvh - 122px); min-height:560px; }
  .site-project-header { flex-wrap:nowrap; margin-bottom:.5rem; }.site-project-name { flex:1; }.site-project-name h1 { font-size:1.25rem; }.site-project-name p { margin:.12rem 0; font-size:.72rem; }
  .site-tabs { gap:1.2rem; margin-bottom:.6rem; }.site-tabs button { padding:.45rem .3rem .6rem; }
  .site-workspace { grid-template-columns:minmax(0,1fr) 270px; gap:.8rem; }
  .site-work-main,.site-inspector { padding:1rem; }
  #siteEditTools { margin-bottom:.6rem; }#siteEditMain .editor-navigation label { flex-basis:105px; }#siteEditMain .editor-navigation { gap:.35rem; }
  #siteNoteInspector #siteNoteFields { padding-top:.4rem; }
  .site-transport { padding:.65rem 1rem; margin-top:.6rem; }
}
@media(max-width:1000px) and (min-width:801px) { .site-header { gap:.8rem; }.site-brand img { width:116px; }.site-navigation { gap:.8rem; }.site-wallet-area { gap:.6rem; }.site-navigation a { font-size:.8rem; }.site-home-hero { padding:1.5rem; gap:1.2rem; }.home-demo-controls { flex-direction:column; align-items:start; gap:.5rem; } }
@media(max-width:800px) {
  .site-header { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:.4rem .8rem; padding:.6rem 14px; }.site-brand { grid-column:1; grid-row:1; }.site-brand img { width:120px; height:48px; }
  .site-wallet-area { grid-column:2; grid-row:1; flex-direction:column-reverse; gap:.2rem; align-items:end; }.site-plans-link { font-size:.75rem; padding:.45rem .7rem; }.site-wallet-link { font-size:.65rem; }
  .site-navigation { grid-column:1; grid-row:2; display:flex; gap:1rem; width:auto; overflow:visible; }.site-navigation a { font-size:.75rem; }.site-account-menu { grid-column:2; grid-row:2; justify-self:end; }.site-account-menu>summary { padding:.4rem; }.site-account-menu .site-appearance { justify-self:stretch; }
  .site-pricing-heading { display:block; }.site-pricing-heading>a { display:inline-block; margin:.5rem 0; }.credit-pack-grid { grid-template-columns:1fr; }.credit-pack { padding:1.2rem; }.credit-monthly { align-items:start; flex-direction:column; gap:.6rem; }.price-calculator-fields { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .site-home-hero { grid-template-columns:1fr; padding:1.4rem; }.site-home-hero h1 { font-size:2.7rem; }.home-demo-controls { flex-direction:column; align-items:start; gap:.5rem; }.home-credit-callout { flex-direction:column; align-items:start; padding:1.4rem; gap:.7rem; }
  .site-mobile-settings { display:block; align-self:end; margin:0 0 .6rem auto; padding:.4rem .6rem; font-size:.75rem; }
  .site-mode>.site-inspector { display:none; }#siteSettingsSheet .site-inspector { display:block; border:0; padding:.6rem 0; box-shadow:none; }#siteSettingsSheet .site-inspector>.details { display:block; }
  #siteSettingsSheet { position:fixed; margin:0; inset:auto 0 0; width:100%; max-width:100%; max-height:82dvh; border-radius:18px 18px 0 0; }
  #siteSettingsSheet>button { display:block; margin-left:auto; }
  #creditDialog .credit-modal-packs,.output-choice-grid { grid-template-columns:1fr; }
  .account-section-nav { gap:1.1rem; }.account-section-nav button { font-size:.8rem; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto !important; } }