/* Shared PHOENIX presentation tokens. Tool behavior stays in original documents. */
:root{color-scheme:light;--phx-background:oklch(0.982 0.004 250);--phx-surface:oklch(1 0 0);--phx-raised:oklch(0.954 0.008 250);--phx-text:oklch(0.27 0.019 250);--phx-muted:oklch(0.48 0.024 250);--phx-line:oklch(0.86 0.015 250);--phx-accent:oklch(0.53 0.19 259);--phx-cyan:oklch(0.47 0.09 200);--phx-success:oklch(0.45 0.10 155);--phx-warning:oklch(0.49 0.10 75);--phx-danger:oklch(0.50 0.17 25);--phx-violet:oklch(0.49 0.13 300);--phx-on-accent:oklch(1 0 0);--phx-shadow:0 8px 24px oklch(0.25 0.02 250 / .06)}
html,body{background:var(--phx-background)!important}
body{color:var(--phx-text);letter-spacing:0}
.phx-icon{display:inline-block;width:1.15em;height:1.15em;vertical-align:-.18em;flex-shrink:0;stroke:currentColor;stroke-width:1.7;fill:none;pointer-events:none}
.ic .phx-icon,.ico .phx-icon{width:1em;height:1em}
.brand>svg,.logo>svg,.hero-in>svg.mark,.card.phx-brand-label>.ic,.item.phx-brand-label>.ic{display:none!important}
.brand .bt b{background:none;color:var(--phx-accent);-webkit-text-fill-color:var(--phx-accent)}
body:has(>#drawer){--phx-band-height:72px;border:0}
body:has(>#drawer)>header .brand{order:-1}
button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--phx-cyan);outline-offset:3px}
.hero:after{display:none!important}
.card,.panel,.acc-item,.ex,.metric,.tile,.note,.stage{box-shadow:none;border-radius:8px}
button{border-radius:8px}
#phxStatus{color:var(--phx-text)!important;min-width:0;max-width:100%;overflow-wrap:anywhere}
body:has(>main.app){flex-wrap:wrap}
body:has(>main.app)>#phxStatus{flex-basis:100%;width:100%}
.btn.pri,.btn.gold,.btn.primary,.tb-btn.on,.seg button.on{color:var(--phx-on-accent)}
@media(max-width:640px){.g2{grid-template-columns:minmax(0,1fr)}.grid{min-width:0}.hero{padding:24px 16px}.hero h1{font-size:28px}.topbar{flex-wrap:wrap}.nav{position:relative;top:0}.brand{min-width:0}header .brand b{white-space:normal}.hbtn{padding:0 8px}header{gap:6px}.row>*{max-width:100%}.btn{padding-inline:16px}.wrap{padding-inline:14px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
body:has(>#drawer)>header,body:has(>#drawer)>.phx-footer{background:var(--phx-accent);color:var(--phx-on-accent);height:var(--phx-band-height);min-height:var(--phx-band-height);flex:none;border:0;padding-inline:20px}
body:has(>#drawer)>header{gap:12px}
body:has(>#drawer)>header .brand b{color:var(--phx-on-accent);font-size:18px;letter-spacing:0}
body:has(>#drawer)>header .brand small{color:var(--phx-on-accent);opacity:.85}
body:has(>#drawer)>header .burger,body:has(>#drawer)>header .hbtn{color:var(--phx-on-accent);background:transparent;border-color:var(--phx-on-accent)}
body:has(>#drawer)>header .burger span{background:var(--phx-on-accent);box-shadow:0 -6px 0 var(--phx-on-accent),0 6px 0 var(--phx-on-accent)}
.phx-footer{display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:600;letter-spacing:0;text-decoration:underline;text-underline-offset:5px}
.phx-language{display:flex;gap:2px;flex:none;border:1px solid var(--phx-on-accent);border-radius:8px;padding:3px}
.phx-language button{height:32px;min-width:36px;padding:0 7px;background:transparent;color:var(--phx-on-accent);border:0;font:600 12px system-ui,sans-serif;cursor:pointer}
.phx-language button[aria-pressed="true"]{background:var(--phx-on-accent);color:var(--phx-accent)}
.phx-language-standalone{position:fixed;right:12px;bottom:12px;z-index:1000;background:var(--phx-accent);box-shadow:var(--phx-shadow)}
@media(max-width:640px){body:has(>#drawer){--phx-band-height:104px}body:has(>#drawer)>header{flex-wrap:wrap;gap:6px;padding:8px 12px}body:has(>#drawer)>header .brand{flex-basis:calc(100% - 56px)}body:has(>#drawer)>header .brand b{font-size:17px}body:has(>#drawer)>header .burger{width:40px;height:40px}body:has(>#drawer)>header .hbtn{height:34px}.phx-language{margin-left:auto}.phx-footer{font-size:12px}}
/* One shared menu; original controls remain in their own documents. */
.phx-navigation-source,.phx-header-source,.phx-home-source,.phx-control-source{display:none!important}
.phx-header-retained .brand,.phx-header-retained .brandmark,.phx-header-retained #brand,.phx-header-retained .keys{display:none!important}
body:has(>#drawer)>header .brand{cursor:pointer}
.phx-theme,.phx-menu-toggle{width:40px;height:40px;flex:none;display:grid;place-items:center;border:1px solid var(--phx-on-accent);background:transparent;color:var(--phx-on-accent);cursor:pointer}
.phx-theme .phx-icon,.phx-menu-toggle .phx-icon{width:22px;height:22px}
.phx-menu-group{padding:8px 0;border-bottom:1px solid var(--phx-line)}
.phx-menu-label{padding:8px 12px;color:var(--phx-muted);font:600 12px/1.4 system-ui,sans-serif;overflow-wrap:anywhere}
.phx-menu-action{display:flex;align-items:center;gap:10px;width:100%;min-height:44px;padding:10px 12px;border:0;background:transparent;color:var(--phx-text);font:500 14px/1.4 system-ui,sans-serif;text-align:left;cursor:pointer}
.phx-menu-action:hover,.phx-menu-action[aria-current="page"]{background:var(--phx-raised);color:var(--phx-accent)}
.phx-menu-action i{font-style:normal}.phx-menu-action small{display:block}.phx-menu-action .hide-s{display:inline!important}
.phx-menu-action:disabled{opacity:.5;cursor:not-allowed}
.phx-standalone-header{display:flex;align-items:center;gap:10px;min-height:72px;padding:12px 16px;background:var(--phx-accent);color:var(--phx-on-accent);position:relative;z-index:100}
.phx-home-brand{min-width:0;flex:1;color:var(--phx-on-accent);font:700 17px/1.2 system-ui,sans-serif;text-decoration:none}
.phx-standalone-menu{position:fixed;top:72px;right:0;bottom:0;width:min(340px,90vw);overflow:auto;background:var(--phx-surface);border-left:1px solid var(--phx-line);z-index:1000;padding:8px}
.phx-standalone-menu[hidden]{display:none!important}
:root[data-phx-theme="dark"]{color-scheme:dark;--phx-background:oklch(0.19 0.008 250);--phx-surface:oklch(0.23 0.009 250);--phx-raised:oklch(0.28 0.012 250);--phx-text:oklch(0.94 0.006 250);--phx-muted:oklch(0.73 0.016 250);--phx-line:oklch(0.39 0.015 250);--phx-cyan:oklch(0.75 0.10 200);--phx-success:oklch(0.73 0.14 155);--phx-warning:oklch(0.80 0.13 75);--phx-danger:oklch(0.72 0.17 25);--phx-violet:oklch(0.73 0.13 300)}
:root[data-phx-theme="dark"]{--bg:var(--phx-background)!important;--bg2:var(--phx-background)!important;--void:var(--phx-background)!important;--card:var(--phx-surface)!important;--panel:var(--phx-surface)!important;--panel2:var(--phx-raised)!important;--panel3:var(--phx-raised)!important;--panel-2:var(--phx-raised)!important;--line:var(--phx-line)!important;--line2:var(--phx-line)!important;--txt:var(--phx-text)!important;--text:var(--phx-text)!important;--txt2:var(--phx-muted)!important;--muted:var(--phx-muted)!important}
:root[data-phx-theme="dark"] .hero h1,:root[data-phx-theme="dark"] .card b{color:var(--phx-text)}
@media(max-width:640px){body:has(>#drawer)>header{display:grid;grid-template-columns:minmax(0,1fr) 40px 40px;grid-template-rows:40px 38px;gap:6px}body:has(>#drawer)>header .brand{grid-column:1;grid-row:1}body:has(>#drawer)>header .burger{grid-column:2;grid-row:1}body:has(>#drawer)>header .phx-theme{grid-column:3;grid-row:1}.phx-language{grid-column:1 / -1;grid-row:2;justify-self:end;margin:0}.phx-standalone-header{flex-wrap:wrap}}
/* Unified top band: brand, back, profile and every tool menu visible on PC; hamburger only on phones. */
.phx-back,.phx-profile{height:40px;flex:none;display:inline-flex;align-items:center;gap:8px;padding:0 14px;border:1px solid var(--phx-on-accent);background:transparent;color:var(--phx-on-accent);font:600 14px/1 system-ui,sans-serif;cursor:pointer;border-radius:8px}
.phx-back[hidden]{display:none!important}
.phx-back:hover,.phx-profile:hover,.phx-top-action:hover{background:color-mix(in oklch,var(--phx-on-accent) 18%,transparent)}
.phx-back .phx-icon,.phx-profile .phx-icon{width:20px;height:20px}
.phx-topmenu{display:flex;flex-wrap:wrap;align-items:center;gap:6px;flex-basis:100%;order:20;min-width:0}
.phx-topmenu:empty{display:none}
.phx-top-action{min-height:40px;display:inline-flex;align-items:center;gap:7px;padding:6px 13px;border:1px solid color-mix(in oklch,var(--phx-on-accent) 55%,transparent);border-radius:8px;background:transparent;color:var(--phx-on-accent);font:600 14px/1.2 system-ui,sans-serif;cursor:pointer;white-space:nowrap}
.phx-top-action i{font-style:normal}.phx-top-action small{display:none}.phx-top-action .hide-s{display:inline!important}
.phx-top-action .dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:currentColor;opacity:.6}
.phx-top-action[aria-current="page"]{background:var(--phx-on-accent);color:var(--phx-accent);border-color:var(--phx-on-accent)}
.phx-top-action:disabled{opacity:.5;cursor:not-allowed}
.phx-top-sep{align-self:stretch;width:1px;margin:4px 6px;background:var(--phx-on-accent);opacity:.45}
body:has(>#drawer)>header .phx-back{order:-2}
body:has(>#drawer)>header .phx-profile{margin-left:auto}
body:has(>#drawer)>header .brand{flex:0 1 auto}
@media(min-width:641px){
  body:has(>#drawer)>header{height:auto;flex-wrap:wrap;row-gap:10px;padding-block:12px}
  body:has(>#drawer)>header .burger,.phx-menu-toggle,.phx-standalone-menu{display:none!important}
  body.open .veil,body.open .drawer{display:none}
  .phx-standalone-header{flex-wrap:wrap;row-gap:10px}
  .phx-standalone-header .phx-home-brand{flex:0 1 auto}
  .phx-standalone-header .phx-profile{margin-left:auto}
}
@media(max-width:640px){
  .phx-topmenu{display:none!important}
  body:has(>#drawer)>header{grid-template-columns:auto minmax(0,1fr) 40px 40px 40px;grid-template-rows:40px 38px}
  body:has(>#drawer)>header .phx-back{grid-column:1;grid-row:1;padding:0 8px}
  body:has(>#drawer)>header .brand{grid-column:2;grid-row:1}
  body:has(>#drawer)>header .phx-profile{grid-column:3;grid-row:1;margin:0;padding:0;justify-content:center}
  body:has(>#drawer)>header .burger{grid-column:4;grid-row:1}
  body:has(>#drawer)>header .phx-theme{grid-column:5;grid-row:1}
  .phx-back span,.phx-profile span{display:none}
}
@media(min-width:641px){body:has(>#drawer)>header .phx-profile{order:4}body:has(>#drawer)>header .phx-language{order:5}body:has(>#drawer)>header .phx-theme{order:6}}
