/* Hotel IT Operations — Unified IT Command visual system.
   Functional styles remain in styles.css; this layer changes presentation only. */
:root{
  --bg:#00091a;--bg2:#00142b;--surface:#00152e;--surface2:#001a38;--line:#17456b;
  --text:#f5fbff;--muted:#9ab0c7;--cyan:#00cccc;--green:#66ff66;--amber:#ffff33;--red:#ff334d;--purple:#ff4dff;
  --shadow:0 18px 52px rgba(0,0,0,.48);--radius:0;--side:286px;--mast:68px;--ticker:38px;--top:106px;--foot:54px;
  color-scheme:dark;font-family:ui-monospace,"Cascadia Mono","SFMono-Regular",Consolas,"Liberation Mono",monospace;
}
html[data-theme="light"]{--bg:#e7eceb;--bg2:#d3e4e4;--surface:#f7fbf8;--surface2:#eaf4f3;--line:#648890;--text:#07111f;--muted:#425b68;--shadow:0 12px 34px rgba(22,49,58,.16);color-scheme:light}
*{border-radius:0!important}html{background:#000;scrollbar-color:var(--cyan) #001020}body{background:var(--bg);letter-spacing:.015em}
body:after{content:"";position:fixed;z-index:1000;inset:0;pointer-events:none;background:repeating-linear-gradient(180deg,transparent 0,transparent 3px,rgba(0,0,0,.15) 3px,rgba(0,0,0,.15) 4px)}
body:before{content:"";position:fixed;z-index:-2;inset:0;background:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:48px 48px}
.ambient{display:none}
#hotel-webgl-canvas{position:fixed;z-index:0;left:var(--side);right:0;top:var(--top);bottom:var(--foot);width:calc(100vw - var(--side));height:calc(100vh - var(--top) - var(--foot));opacity:.30;pointer-events:none;mix-blend-mode:screen}
html[data-theme="light"] #hotel-webgl-canvas{opacity:.16;mix-blend-mode:multiply}
.shape-status{position:fixed;z-index:5;right:1.1rem;top:calc(var(--top) + .8rem);display:flex;gap:.7rem;align-items:center;padding:.34rem .55rem;border:1px solid var(--cyan);background:rgba(0,9,26,.78);color:var(--cyan);font-size:.68rem;letter-spacing:.12em}.shape-status span{color:var(--amber)}
.app-shell{z-index:1;background:transparent}.topbar{height:var(--mast);padding:0 clamp(.7rem,2vw,1.2rem);background:var(--cyan);color:#001020;border:0;border-bottom:0;box-shadow:0 10px 30px rgba(0,0,0,.4);backdrop-filter:none}.brand-wrap{gap:.75rem}.brand{color:#001020}.brand-mark{width:44px;height:44px;border:3px solid #001020;background:transparent;color:#001020;font-size:1.35rem;font-weight:1000;box-shadow:none}.brand b{font-size:1.22rem;letter-spacing:.18em}.brand small{color:#01313b;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase}.masthead-page{font-size:1.35rem;font-weight:1000;letter-spacing:.12em;color:#001020}.top-actions{color:#001020}.icon-btn,.live-pill,.compact-field{border:2px solid #001020;background:transparent;color:#001020;box-shadow:none}.icon-btn:hover{background:#001020;color:var(--cyan);border-color:#001020;transform:none}.live-pill span{background:#001020;box-shadow:none}.compact-field{padding:.2rem .3rem .2rem .5rem}.compact-field select{color:#001020;font-weight:900}.compact-field option{background:#f4f7fb;color:#07111f}
.ticker-wrapper{position:fixed;z-index:99;left:0;right:0;top:var(--mast);height:var(--ticker);display:flex;background:#000;border-top:2px solid #032c2f;border-bottom:2px solid var(--cyan);overflow:hidden}.ticker-label{display:grid;place-items:center;min-width:132px;padding:0 1rem;background:var(--red);color:#fff;font-size:1rem;font-weight:1000;letter-spacing:.25em}.ticker-track{display:flex;align-items:center;min-width:0;flex:1;overflow:hidden}.ticker-text{white-space:nowrap;color:var(--amber);font-size:1rem;font-weight:1000;letter-spacing:.14em;animation:hotel-ticker 40s linear infinite}@keyframes hotel-ticker{from{transform:translateX(0)}to{transform:translateX(-65%)}}
.sidebar{top:var(--top);bottom:var(--foot);width:var(--side);padding:0;background:#00142b;border-right:4px solid var(--line);box-shadow:inset -12px 0 0 rgba(0,0,0,.2);backdrop-filter:none}.property-card{margin:0;padding:1rem;border:0;border-bottom:2px solid var(--cyan);background:#00243d}.property-card .eyebrow{color:var(--cyan)}.property-card strong{color:var(--amber);font-size:1rem;text-transform:uppercase}.property-card small{color:var(--muted)}.property-health{border-top:1px solid var(--line)}.property-health b{color:var(--green)}
.sidebar nav{gap:0}.sidebar nav a{min-height:70px;grid-template-columns:52px 1fr;align-items:center;gap:0 .55rem;padding:.52rem .72rem;border:0;border-bottom:1px solid #082747;background:linear-gradient(180deg,#00142b,#000b1b);color:var(--muted)}.sidebar nav a span{grid-row:1/3;color:var(--cyan);font-size:.95rem;font-weight:900}.sidebar nav a b{color:var(--amber);font-size:.92rem;text-transform:uppercase}.sidebar nav a small{font-size:.68rem;letter-spacing:.12em;text-transform:uppercase}.sidebar nav a:hover,.sidebar nav a.active{background:var(--cyan);box-shadow:inset 6px 0 0 var(--amber)}.sidebar nav a:hover span,.sidebar nav a.active span,.sidebar nav a:hover b,.sidebar nav a.active b,.sidebar nav a:hover small,.sidebar nav a.active small{color:#001020}.sidebar nav a.external-module{border-top:2px solid var(--purple)}.sidebar-foot{margin:0;padding:.8rem;background:#00091a;border-top:2px solid var(--line)}.sidebar-foot span{color:var(--cyan)}.sidebar-foot button{border:2px solid var(--red);background:#24000a;color:#fff;padding:.55rem;font-weight:900}.sidebar-foot button:hover{background:var(--red);color:#fff}
.main{position:relative;z-index:2;padding:calc(var(--top) + 1.3rem) 1.35rem calc(var(--foot) + 1.4rem) calc(var(--side) + 1.35rem);background:linear-gradient(90deg,rgba(0,0,0,.18),transparent)}
.page-head{min-height:98px;margin:-1.3rem -1.35rem 1rem;padding:1.1rem 1.35rem;background:#00243d;border-bottom:2px solid var(--line);align-items:center}.page-head .eyebrow{font-size:.75rem}.page-head h1{color:var(--amber);font-size:clamp(1.55rem,3vw,2.25rem);letter-spacing:.04em;text-transform:uppercase}.page-head p{color:var(--text);font-size:.82rem}.head-actions{align-items:center}.btn{border:2px solid #7990a8;background:#001a38;color:var(--text);padding:.58rem .8rem;font-weight:1000;box-shadow:0 5px 0 rgba(0,0,0,.35);text-transform:uppercase}.btn:hover{border-color:var(--cyan);background:#003540;transform:none}.btn:active{transform:translateY(3px);box-shadow:0 2px 0 rgba(0,0,0,.35)}.btn.primary{background:var(--cyan);color:#001020;border-color:var(--cyan)}.btn.amber{background:var(--amber);color:#001020;border-color:var(--amber)}.btn.danger{background:#3e0d0d;color:#fff;border-color:var(--red)}
.kpi,.panel,.ticket-card,.ap-card,.asset-card,.handover-card,.scenario-card,.dialog,.toast,.session-lock>div,.disclaimer,.field input,.field select,.field textarea,.toolbar input,.toolbar select{border-radius:0}.kpi,.panel{background:rgba(0,21,46,.92);border:1px solid var(--line);box-shadow:none}.kpi{border-top:5px solid var(--accent,var(--cyan))}.kpi span,.kpi small{color:var(--muted)}.kpi strong{color:var(--amber)}.panel-head{background:#001a38;border-bottom:2px solid var(--line)}.panel-head h2{color:var(--amber);text-transform:uppercase;letter-spacing:.05em}.panel-body{background:rgba(0,9,26,.78)}
.ticket-card,.ap-card,.asset-card,.handover-card,.scenario-card{background:#001a38;border:1px solid var(--line);box-shadow:inset 0 0 0 1px rgba(255,255,255,.025)}.ticket-card:before{width:5px;top:0;bottom:0;border-radius:0}.card-title{color:var(--amber)}.meta-line,.subtext{color:var(--muted)}.card-foot{border-top:1px solid var(--line)}.badge{border:1px solid currentColor;border-radius:0;background:#001020}.badge:before{border-radius:0}.metric-bar,.metric-bar i{border-radius:0}.data-table th{background:#00243d;color:var(--cyan)}.data-table td{background:rgba(0,20,43,.72)}.data-table tr:hover td{background:#00303c}
.toolbar input,.toolbar select,.field input,.field select,.field textarea{border:2px solid #7990a8;background:#f4f7fb;color:#07111f}.field label{color:var(--cyan);text-transform:uppercase}.toolbar input:focus,.toolbar select:focus,.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--amber);box-shadow:0 0 0 2px var(--cyan)}
.topology{background:radial-gradient(circle at 50% 50%,rgba(0,204,204,.14),transparent 60%),#00091a;border:2px solid var(--cyan)}.timeline:before{background:var(--line)}.timeline-item:before{border-radius:0;background:var(--cyan);box-shadow:0 0 0 3px #001a38}.audit-row{background:#001a38;border:1px solid var(--line);border-radius:0}.audit-row code{color:var(--cyan)}.progress-ring{border-radius:50%!important}.progress-ring:before{border-radius:50%!important}.architecture .arch-node{background:#001a38;border:1px solid var(--cyan);border-radius:0}.dialog{background:#00152e;border:2px solid var(--cyan)}.dialog::backdrop{background:rgba(0,0,0,.86);backdrop-filter:none}.dialog-shell>header{background:var(--cyan);color:#001020}.dialog-shell>header .eyebrow{color:#001020}.dialog-shell>header .icon-btn{border-color:#001020}.toast{background:#00152e;border:2px solid var(--cyan);border-left:8px solid var(--cyan)}.session-lock{background:rgba(0,0,0,.92);backdrop-filter:none}.permission-matrix>*{background:#001a38}
.statusbar{height:var(--foot);grid-template-columns:180px minmax(230px,1fr) minmax(230px,1fr) 130px;gap:2px;padding:0;background:#050a14;border-top:2px solid var(--line);font-size:.68rem;font-weight:900;letter-spacing:.08em}.statusbar>*{height:100%;display:flex;align-items:center;padding:0 .75rem;overflow:hidden}.statusbar .status-command{justify-content:center;background:var(--red);color:#fff;text-decoration:none;letter-spacing:.22em}.statusbar>span:nth-of-type(1){background:var(--green);color:#001020}.statusbar>span:nth-of-type(1) b{color:#001020}.statusbar>span:nth-of-type(2){background:var(--amber);color:#001020}.statusbar>span:nth-of-type(3){justify-content:center;background:var(--cyan);color:#001020;font-variant-numeric:tabular-nums}
html[data-theme="light"] .kpi,html[data-theme="light"] .panel,html[data-theme="light"] .ticket-card,html[data-theme="light"] .ap-card,html[data-theme="light"] .asset-card,html[data-theme="light"] .handover-card,html[data-theme="light"] .scenario-card,html[data-theme="light"] .audit-row,html[data-theme="light"] .permission-matrix>*{background:rgba(247,251,248,.94)}html[data-theme="light"] .panel-body{background:rgba(234,244,243,.92)}html[data-theme="light"] .card-title,html[data-theme="light"] .panel-head h2,html[data-theme="light"] .page-head h1,html[data-theme="light"] .kpi strong{color:#6b5500}
@media(max-width:920px){:root{--side:0px}.sidebar{top:var(--top);width:min(320px,92vw)}#hotel-webgl-canvas{left:0;width:100vw}.main{padding-left:1rem;padding-right:1rem}.page-head{margin-left:-1rem;margin-right:-1rem;padding-left:1rem;padding-right:1rem}.shape-status{display:none}.statusbar{grid-template-columns:90px 1fr 110px}.statusbar>span:nth-of-type(2){display:none}.statusbar>*{padding:0 .45rem}.menu-btn{border-color:#001020}}
@media(max-width:620px){:root{--mast:64px;--ticker:36px;--top:100px;--foot:46px}.topbar{height:var(--mast);padding:0 .55rem}.ticker-wrapper{top:var(--mast);height:var(--ticker)}.ticker-label{min-width:88px;font-size:.78rem}.ticker-text{font-size:.78rem}.brand-mark{width:36px;height:36px}.brand b{font-size:.8rem}.masthead-page{display:none}.main{padding-top:calc(var(--top) + .8rem);padding-bottom:calc(var(--foot) + .8rem)}.page-head{margin-top:-.8rem}.statusbar{grid-template-columns:72px 1fr 92px;font-size:.56rem}.statusbar .status-command{letter-spacing:.08em}.statusbar>span:nth-of-type(1){white-space:nowrap;text-overflow:ellipsis}.statusbar>span:nth-of-type(3){font-size:.55rem}.compact-field select{max-width:78px}}
@media(prefers-reduced-motion:reduce){.ticker-text{animation:none}}
@media print{body:after,#hotel-webgl-canvas,.shape-status,.ticker-wrapper{display:none!important}}

/* V3 refinement: remove the decorative KPI corner circles highlighted in review. */
.kpi::after{content:none!important;display:none!important}

/* Keep the multilingual selector readable in every supported language. */
#localeSelect{min-width:108px}
html[lang="ja"] body{font-family:ui-monospace,"Noto Sans Mono CJK JP","Yu Gothic UI","Meiryo",monospace}
html[lang="id"] body{font-family:ui-monospace,"Cascadia Mono","SFMono-Regular",Consolas,"Liberation Mono",monospace}
@media(max-width:620px){#localeSelect{min-width:82px;max-width:96px}}


/* V7 mobile navigation correction and original booking dashboard. */
.sidebar-close{display:none;position:absolute;right:.65rem;top:.55rem;width:34px;height:34px;border:2px solid var(--cyan);background:#001020;color:var(--cyan);font-size:1.2rem;font-weight:900;z-index:2}
.booking-layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr);gap:.85rem;margin-top:.85rem}
.booking-chart{height:250px;display:grid;grid-template-columns:repeat(7,minmax(34px,1fr));align-items:end;gap:.65rem;padding:1rem .6rem .35rem;border-left:1px solid var(--line);border-bottom:1px solid var(--line);background:linear-gradient(rgba(0,204,204,.055) 1px,transparent 1px);background-size:100% 25%}
.booking-day{height:100%;display:grid;grid-template-rows:1fr auto auto;gap:.28rem;text-align:center;min-width:0}.booking-day b{font-size:.66rem;color:var(--amber)}.booking-day small{font-size:.56rem;color:var(--muted)}
.booking-bars{display:flex;align-items:end;justify-content:center;gap:5px;height:100%}.booking-bar{display:block;width:min(18px,38%);min-height:8px;border:1px solid currentColor;transition:height .25s}.booking-bar.bookings{background:var(--cyan);color:var(--cyan)}.booking-bar.checkins{background:var(--purple);color:var(--purple)}
.booking-legend{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;margin-top:.7rem;color:var(--muted);font-size:.62rem}.booking-legend i{display:inline-block;width:10px;height:10px;margin-right:.3rem}.legend-booking{background:var(--cyan)}.legend-checkin{background:var(--purple)}
.booking-list{display:grid;gap:.45rem;max-height:310px;overflow:auto}.booking-row{display:grid;grid-template-columns:38px minmax(0,1fr) auto auto;align-items:center;gap:.6rem;padding:.58rem;border:1px solid var(--line);background:#001a38}.booking-avatar{display:grid;place-items:center;width:36px;height:36px;background:var(--cyan);color:#001020;font-weight:1000}.booking-row strong{display:block;font-size:.7rem}.booking-row small{display:block;margin-top:.2rem;color:var(--muted);font-size:.58rem}.booking-row-status{display:grid;justify-items:end;gap:.25rem;font-size:.63rem}.adapter-status{display:flex;align-items:center;gap:.65rem;padding:.7rem;border:1px solid var(--line);background:#001a38}.adapter-status small{display:block;color:var(--muted);margin-top:.2rem}.adapter-dot{width:10px;height:10px;background:var(--green);box-shadow:0 0 12px var(--green)}
.workflow-map{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:center;gap:.4rem}.workflow-map>div{padding:.7rem;border:1px solid var(--cyan);background:#001020;text-align:center}.workflow-map b{display:block;color:var(--amber);font-size:.68rem}.workflow-map small{display:block;color:var(--muted);font-size:.56rem;margin-top:.25rem}.workflow-map>span{color:var(--cyan)}.qlo-events .audit-row{grid-template-columns:125px 120px 1fr 70px}
body.nav-open{overflow:hidden}
@media(max-width:920px){.booking-layout{grid-template-columns:1fr}.sidebar-close{display:grid;place-items:center}.sidebar{z-index:170;top:calc(var(--top) + 8px);bottom:calc(var(--foot) + 8px);left:10px;width:min(340px,calc(100vw - 20px));padding:.65rem;box-shadow:16px 18px 0 rgba(0,0,0,.42),0 0 0 2px var(--cyan);border-right:0}.drawer-scrim{z-index:160;inset:0}.property-card{position:relative;padding-right:3rem}.sidebar nav a{min-height:56px}.sidebar nav a b{font-size:.78rem}.sidebar nav a small{font-size:.58rem}.sidebar-foot{padding:.55rem}.qlo-events .audit-row{grid-template-columns:1fr}.workflow-map{grid-template-columns:1fr}.workflow-map>span{transform:rotate(90deg);text-align:center}}
@media(max-width:620px){:root{--mast:116px;--ticker:36px;--top:152px;--foot:46px}.topbar{height:var(--mast);padding:.45rem .55rem;display:grid;grid-template-rows:48px 48px;align-content:center;gap:.25rem}.brand-wrap{width:100%;min-width:0;justify-content:flex-start}.brand{min-width:0;flex:1}.brand b{display:block;max-width:165px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.72rem}.brand small{display:none}.top-actions{width:100%;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr) 36px 36px;gap:.35rem;min-width:0}.top-actions .masthead-page,.top-actions .live-pill{display:none}.compact-field{width:100%;min-width:0;padding:.18rem .28rem}.compact-field span{display:none}.compact-field select,#localeSelect{width:100%;min-width:0!important;max-width:none!important;font-size:.62rem;overflow:hidden;text-overflow:ellipsis}.icon-btn{min-width:36px;width:36px;height:36px}.ticker-wrapper{top:var(--mast)}.main{padding-top:calc(var(--top) + .8rem)}.booking-chart{height:205px;gap:.3rem;padding-left:.25rem;padding-right:.25rem}.booking-row{grid-template-columns:34px minmax(0,1fr) auto}.booking-row .btn{grid-column:1/-1}.booking-row-status{font-size:.58rem}.booking-kpis{grid-template-columns:1fr 1fr}.sidebar{top:calc(var(--top) + 6px);bottom:calc(var(--foot) + 6px)}.property-card{padding:.7rem 3rem .7rem .75rem}.property-card small{display:none}.sidebar nav a{min-height:52px;grid-template-columns:40px 1fr;padding:.38rem .55rem}.sidebar nav a small{letter-spacing:.06em}.statusbar{z-index:180}}
@media(max-width:430px){.booking-kpis{grid-template-columns:1fr}.booking-chart{height:185px}.booking-day small{display:none}.top-actions{grid-template-columns:minmax(0,1fr) minmax(0,.8fr) 34px}.top-actions #installButton{display:none!important}.brand b{max-width:145px}.sidebar{width:calc(100vw - 16px);left:8px}}

/* =========================================================
   V8 — QloApps workflow + supplied CodePen visual refinement
   Smaller typography, light mobile navigation and section-level
   Japanese explanations. Functional controls keep large hit areas.
   ========================================================= */

/* Denser recruiter typography without shrinking interactive targets. */
body{font-size:.82rem}
.brand b{font-size:.98rem;letter-spacing:.14em}
.brand small{font-size:.6rem}
.masthead-page{font-size:1rem}
.ticker-label{font-size:.78rem;letter-spacing:.18em}
.ticker-text{font-size:.78rem;letter-spacing:.1em}
.property-card strong{font-size:.82rem}
.property-card small,.property-health{font-size:.6rem}
.sidebar nav a{min-height:58px;grid-template-columns:42px 1fr;padding:.42rem .62rem}
.sidebar nav a span{font-size:.76rem}
.sidebar nav a b{font-size:.76rem;letter-spacing:.01em}
.sidebar nav a small{font-size:.56rem;letter-spacing:.08em}
.page-head{min-height:82px}
.page-head .eyebrow{font-size:.62rem}
.page-head h1{font-size:clamp(1.35rem,2.45vw,1.85rem);line-height:1.12}
.page-head p{font-size:.7rem;line-height:1.55;max-width:820px}
.btn{font-size:.64rem;padding:.55rem .72rem;min-height:38px}
.btn.small{font-size:.57rem;padding:.4rem .52rem;min-height:32px}
.kpi{padding:.78rem}
.kpi span{font-size:.58rem}
.kpi strong{font-size:1.38rem;margin:.25rem 0 .08rem}
.kpi small{font-size:.57rem}
.panel-head{padding:.72rem .82rem}
.panel-head h2{font-size:.73rem;line-height:1.35}
.panel-head small{font-size:.56rem}
.panel-body{padding:.78rem}
.data-table th{font-size:.54rem}
.data-table td{font-size:.62rem;padding:.58rem .64rem}
.data-table td strong{font-size:.64rem}
.subtext,.meta-line,.scenario-card small{font-size:.55rem}
.card-title,.scenario-card b{font-size:.68rem}
.audit-row{font-size:.55rem}
.disclaimer{font-size:.57rem}

/* Contextual Okita explanation button on every mapped section. */
.okita-explain-host{position:relative!important}
.okita-section-explain{
  position:absolute;z-index:12;right:.55rem;top:.48rem;display:inline-flex;align-items:center;gap:.35rem;
  min-height:30px;padding:.24rem .48rem;border:1px solid color-mix(in srgb,var(--cyan) 65%,var(--line));
  background:color-mix(in srgb,var(--surface2) 92%,transparent);color:var(--cyan);cursor:pointer;
  font:800 .54rem/1 ui-monospace,"Yu Gothic UI",Meiryo,monospace;letter-spacing:.03em;
  box-shadow:0 5px 14px rgba(0,0,0,.18)
}
.okita-section-explain span{display:grid;place-items:center;width:18px;height:18px;background:var(--cyan);color:#001020;font-weight:1000}
.okita-section-explain:hover,.okita-section-explain:focus-visible{background:var(--cyan);color:#001020;outline:2px solid var(--amber);outline-offset:2px}
.okita-section-explain:hover span,.okita-section-explain:focus-visible span{background:#001020;color:var(--cyan)}
.page-head.okita-explain-host{padding-right:8.5rem}
.kpi-grid.okita-explain-host{padding-top:2.15rem}
.panel.okita-explain-host>.okita-section-explain{top:.38rem}

/* Original QloApps-workflow / CodePen-inspired booking workspace. */
body[data-route="booking"]{
  --bg:#f3f5fa;--bg2:#e9edf5;--surface:#ffffff;--surface2:#f7f8fc;--line:#dce2ed;
  --text:#25314a;--muted:#738097;--cyan:#596ce2;--green:#18a999;--amber:#e38c22;--red:#ef476f;--purple:#9b5de5;
  color-scheme:light;background:#f3f5fa;font-family:Inter,"Segoe UI",system-ui,sans-serif;letter-spacing:0
}
body[data-route="booking"]:before,body[data-route="booking"]:after{display:none}
body[data-route="booking"] #hotel-webgl-canvas,body[data-route="booking"] .shape-status{display:none!important}
body[data-route="booking"] .main{background:#f3f5fa}
body[data-route="booking"] .topbar{background:#ffffff;color:#25314a;border-bottom:1px solid #dfe5ef;box-shadow:0 8px 24px rgba(52,72,104,.09)}
body[data-route="booking"] .brand,body[data-route="booking"] .masthead-page,body[data-route="booking"] .top-actions{color:#25314a}
body[data-route="booking"] .brand-mark{border-color:#596ce2;background:#eef0ff;color:#596ce2}
body[data-route="booking"] .brand small{color:#738097}
body[data-route="booking"] .icon-btn,body[data-route="booking"] .live-pill,body[data-route="booking"] .compact-field{border-color:#cfd7e5;background:#fff;color:#25314a}
body[data-route="booking"] .compact-field select{color:#25314a}
body[data-route="booking"] .live-pill span{background:#18a999}
body[data-route="booking"] .ticker-wrapper{background:#ffffff;border-color:#dfe5ef}
body[data-route="booking"] .ticker-track{background:#ffffff}
body[data-route="booking"] .ticker-text{color:#596078}
body[data-route="booking"] .ticker-label{background:#596ce2}
body[data-route="booking"] .sidebar{background:#ffffff;border-color:#dce2ed;box-shadow:8px 0 24px rgba(52,72,104,.08)}
body[data-route="booking"] .property-card{background:#f0f4ff;border-color:#dce2ed}
body[data-route="booking"] .property-card .eyebrow{color:#596ce2}
body[data-route="booking"] .property-card strong{color:#25314a}
body[data-route="booking"] .property-card small,body[data-route="booking"] .property-health{color:#738097}
body[data-route="booking"] .sidebar nav a{background:#fff;border-color:#edf0f5;color:#738097}
body[data-route="booking"] .sidebar nav a b{color:#25314a}
body[data-route="booking"] .sidebar nav a span{color:#596ce2}
body[data-route="booking"] .sidebar nav a:hover,body[data-route="booking"] .sidebar nav a.active{background:#eef0ff;box-shadow:inset 4px 0 0 #596ce2}
body[data-route="booking"] .sidebar nav a:hover *,body[data-route="booking"] .sidebar nav a.active *{color:#3446b5}
body[data-route="booking"] .sidebar-foot{background:#f7f8fc;border-color:#dce2ed}
body[data-route="booking"] .sidebar-foot button{background:#fff;border-color:#ef476f;color:#c42c53}
body[data-route="booking"] .page-head{margin-bottom:.85rem;background:#fff;border:1px solid #dce2ed!important;border-bottom:1px solid #dce2ed;border-radius:20px!important;box-shadow:0 10px 28px rgba(52,72,104,.08)}
body[data-route="booking"] .page-head h1{color:#25314a;text-transform:none;letter-spacing:-.025em}
body[data-route="booking"] .page-head p{color:#738097}
body[data-route="booking"] .page-head .eyebrow{color:#596ce2}
body[data-route="booking"] .btn{border:1px solid #d0d7e4;background:#fff;color:#34405a;border-radius:10px!important;box-shadow:0 3px 9px rgba(52,72,104,.08);text-transform:none}
body[data-route="booking"] .btn.primary{background:#596ce2;border-color:#596ce2;color:#fff}
body[data-route="booking"] .qlo-dashboard-shell{display:grid;gap:.85rem;max-width:1540px;margin:0 auto}
body[data-route="booking"] .qlo-local-header{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:1rem;padding:.65rem .75rem;background:#fff;border:1px solid #dce2ed;border-radius:18px!important;box-shadow:0 10px 30px rgba(52,72,104,.07)}
.qlo-property-brand,.qlo-profile{display:flex;align-items:center;gap:.6rem;min-width:0}
.qlo-property-logo,.qlo-profile-dot{display:grid;place-items:center;flex:0 0 auto;width:36px;height:36px;border-radius:11px!important;background:#596ce2;color:#fff;font-weight:850;font-size:.72rem}
.qlo-property-brand strong,.qlo-profile b{display:block;color:#25314a;font-size:.68rem}
.qlo-property-brand small,.qlo-profile small{display:block;color:#7a879a;font-size:.52rem;margin-top:.12rem}
.qlo-profile-dot{border-radius:50%!important;background:#f4c37d;color:#4f3312}
.qlo-subnav{display:flex;align-items:center;justify-content:center;gap:.25rem;min-width:0;overflow:auto;scrollbar-width:thin}
.qlo-subnav button{flex:0 0 auto;min-height:38px;padding:.5rem .68rem;border:0;border-radius:10px!important;background:transparent;color:#69758b;font-size:.58rem;font-weight:750;cursor:pointer}
.qlo-subnav button:hover,.qlo-subnav button.active{background:#eef0ff;color:#4457ca}
.qlo-welcome{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(300px,.6fr);gap:1rem;align-items:center;padding:1.05rem 1.15rem;background:linear-gradient(135deg,#ffffff,#f1f3ff);border:1px solid #dce2ed;border-radius:20px!important;box-shadow:0 10px 28px rgba(52,72,104,.07)}
.qlo-kicker{display:block;color:#596ce2;font-size:.53rem;font-weight:850;letter-spacing:.15em}
.qlo-welcome h2{margin:.28rem 0 .32rem;color:#25314a;font-size:1.08rem;font-weight:720}
.qlo-welcome p{margin:0;max-width:720px;color:#718097;font-size:.65rem;line-height:1.55}
.qlo-welcome p b{color:#25314a}
.qlo-welcome-actions{display:grid;grid-template-columns:1fr 1fr;gap:.55rem}
.qlo-action-card{display:grid;grid-template-columns:30px 1fr;gap:.05rem .5rem;align-items:center;min-height:64px;padding:.55rem;border:1px solid #d7deea;border-radius:14px!important;background:#fff;color:#25314a;text-align:left;cursor:pointer}
.qlo-action-card>span{grid-row:1/3;display:grid;place-items:center;width:30px;height:30px;border-radius:9px!important;background:#eef0ff;color:#596ce2;font-size:1rem;font-weight:800}
.qlo-action-card b{font-size:.61rem}.qlo-action-card small{font-size:.5rem;color:#7c899d}
.qlo-action-card:hover{border-color:#596ce2;transform:translateY(-1px)}
.qlo-notice{padding:.62rem .78rem;border:1px solid #f1d5a9;border-radius:12px!important;background:#fff8e9;color:#73562c;font-size:.57rem;line-height:1.55}
body[data-route="booking"] .qlo-card,body[data-route="booking"] .kpi{background:#fff;border:1px solid #dce2ed;border-radius:18px!important;box-shadow:0 10px 26px rgba(52,72,104,.065);overflow:hidden}
body[data-route="booking"] .kpi{border-top:1px solid #dce2ed;padding:.82rem}
body[data-route="booking"] .kpi:before{content:"";display:block;width:28px;height:4px;margin-bottom:.55rem;border-radius:999px!important;background:var(--accent)}
body[data-route="booking"] .kpi span,body[data-route="booking"] .kpi small{color:#7a879a}
body[data-route="booking"] .kpi strong{color:#25314a}
body[data-route="booking"] .panel-head{background:#fff;border-color:#e4e8f0}
body[data-route="booking"] .panel-head h2{color:#25314a;text-transform:none;letter-spacing:0}
body[data-route="booking"] .panel-head small{color:#8190a4}
body[data-route="booking"] .panel-body{background:#fff}
body[data-route="booking"] .booking-chart{border-color:#dfe4ee;background:linear-gradient(rgba(89,108,226,.08) 1px,transparent 1px);background-size:100% 25%}
body[data-route="booking"] .booking-day b{color:#536178}
body[data-route="booking"] .booking-bar.bookings{background:#596ce2;color:#596ce2;border-radius:5px 5px 0 0!important}
body[data-route="booking"] .booking-bar.checkins{background:#9b5de5;color:#9b5de5;border-radius:5px 5px 0 0!important}
body[data-route="booking"] .booking-row{background:#f8f9fc;border-color:#e4e8f0;border-radius:12px!important}
body[data-route="booking"] .booking-avatar{background:#e8ebff;color:#4658c5;border-radius:10px!important}
body[data-route="booking"] .booking-row strong{color:#25314a}
body[data-route="booking"] .booking-row small,body[data-route="booking"] .booking-legend{color:#7a879a}
body[data-route="booking"] .toolbar input{background:#f8f9fc;border:1px solid #dce2ed;color:#25314a;border-radius:11px!important}
body[data-route="booking"] .data-table th{background:#f4f6fb;color:#65738b}
body[data-route="booking"] .data-table td{background:#fff;color:#34405a}
body[data-route="booking"] .data-table tr:hover td{background:#f8f9fc}
body[data-route="booking"] .adapter-status,body[data-route="booking"] .audit-row{background:#f8f9fc;border-color:#e1e6ef;border-radius:12px!important;color:#34405a}
body[data-route="booking"] .workflow-map>div{background:#f8f9fc;border-color:#cfd7e7;border-radius:12px!important}
body[data-route="booking"] .workflow-map b{color:#3446b5}
body[data-route="booking"] .workflow-map small{color:#77859b}
body[data-route="booking"] .statusbar{background:#fff;border-color:#dce2ed;color:#34405a}
body[data-route="booking"] .statusbar>span:nth-of-type(1){background:#dff7ef;color:#176c5f}
body[data-route="booking"] .statusbar>span:nth-of-type(1) b{color:#176c5f}
body[data-route="booking"] .statusbar>span:nth-of-type(2){background:#fff1cc;color:#6f5715}
body[data-route="booking"] .statusbar>span:nth-of-type(3){background:#e7ebff;color:#3446b5}
body[data-route="booking"] .okita-section-explain{background:#fff;color:#4658c5;border-color:#cfd7e7;border-radius:999px!important}
body[data-route="booking"] .okita-section-explain span{border-radius:50%!important;background:#596ce2;color:#fff}

/* Mobile: bright, clickable navbar and drawer on every route. */
@media(max-width:920px){
  body:after{display:none}
  .topbar{background:#f8fcff!important;color:#10233c!important;border-bottom:1px solid #cddbe6!important;box-shadow:0 8px 22px rgba(20,45,70,.14)!important}
  .brand,.brand b,.brand small,.masthead-page,.top-actions{color:#10233c!important}
  .brand-mark{border-color:#117d8a!important;background:#dcf7f7!important;color:#075765!important}
  .icon-btn,.live-pill,.compact-field{min-height:44px;border:1px solid #9fb4c4!important;background:#ffffff!important;color:#10233c!important;box-shadow:0 2px 7px rgba(20,45,70,.08)!important}
  .icon-btn{min-width:44px;width:44px;height:44px}
  .compact-field select{color:#10233c!important;font-weight:750}
  .ticker-wrapper{background:#fff!important;border-bottom-color:#18a5ad!important}
  .ticker-track{background:#fff!important}.ticker-text{color:#4d5b70!important}
  .ticker-label{background:#ef476f!important;color:#fff!important}
  .sidebar{background:#ffffff!important;border:1px solid #b7c8d6!important;box-shadow:0 24px 65px rgba(20,45,70,.28)!important;color:#17283f!important}
  .sidebar-close{display:grid;place-items:center;min-width:44px;width:44px;height:44px;border:1px solid #7ea0b5!important;background:#fff!important;color:#15314b!important;border-radius:12px!important}
  .property-card{background:#edf9fa!important;border:1px solid #c8e6e7!important;border-radius:14px!important;color:#17283f!important}
  .property-card .eyebrow{color:#117d8a!important}.property-card strong{color:#17283f!important}.property-card small,.property-health{color:#5f7184!important}
  .sidebar nav{gap:.28rem;padding-top:.4rem}
  .sidebar nav a{min-height:50px!important;border:1px solid #e0e8ef!important;border-radius:12px!important;background:#fff!important;color:#607185!important;box-shadow:none!important}
  .sidebar nav a span{color:#118c96!important}.sidebar nav a b{color:#17283f!important}.sidebar nav a small{color:#718296!important}
  .sidebar nav a:hover,.sidebar nav a.active{background:#dff7f7!important;border-color:#65cbd0!important;box-shadow:inset 4px 0 0 #117d8a!important}
  .sidebar nav a:hover *,.sidebar nav a.active *{color:#075765!important}
  .sidebar-foot{background:#f5f8fb!important;border:1px solid #dbe4ec!important;border-radius:12px!important}
  .drawer-scrim{background:rgba(25,46,67,.36)!important;backdrop-filter:blur(3px)}
  .okita-section-explain{min-height:34px;background:#fff!important;color:#075765!important;border-color:#79bfc3!important;border-radius:999px!important}
  .okita-section-explain span{border-radius:50%!important}
}

@media(max-width:620px){
  :root{--mast:104px;--ticker:34px;--top:138px;--foot:44px}
  body{font-size:.76rem}
  .topbar{height:var(--mast);padding:.38rem .48rem;grid-template-rows:44px 44px;gap:.22rem}
  .brand-wrap{height:44px}.brand-mark{width:34px;height:34px}.brand b{max-width:160px;font-size:.64rem;letter-spacing:.08em}.brand small{display:none}
  .top-actions{grid-template-columns:minmax(0,1fr) minmax(0,.82fr) 44px 44px;gap:.28rem;height:44px}
  .compact-field{height:44px;padding:.16rem .28rem}.compact-field select,#localeSelect{font-size:.57rem}
  .ticker-label{min-width:78px;font-size:.66rem}.ticker-text{font-size:.64rem;letter-spacing:.07em}
  .sidebar{top:calc(var(--top) + 6px)!important;bottom:calc(var(--foot) + 6px)!important;padding:.55rem!important}
  .sidebar nav a{grid-template-columns:34px 1fr!important;padding:.36rem .48rem!important}.sidebar nav a span{font-size:.68rem!important}.sidebar nav a b{font-size:.68rem!important}.sidebar nav a small{font-size:.52rem!important}
  .main{padding-top:calc(var(--top) + .65rem)}
  .page-head{padding:.75rem .8rem!important;min-height:auto}.page-head h1{font-size:1.18rem}.page-head p{font-size:.62rem;line-height:1.5}.page-head.okita-explain-host{padding-right:.8rem!important;padding-top:3rem!important}
  .head-actions{gap:.35rem}.btn{font-size:.58rem;min-height:36px;padding:.46rem .58rem}
  .kpi-grid.okita-explain-host{padding-top:2.25rem}.kpi strong{font-size:1.18rem}.kpi span,.kpi small{font-size:.52rem}
  .panel-head h2{font-size:.65rem}.panel-head small{font-size:.51rem}.panel-body{padding:.64rem}.data-table td{font-size:.56rem}.data-table th{font-size:.5rem}
  .okita-section-explain{top:.38rem;right:.42rem;font-size:.5rem}.okita-section-explain b{display:inline}
  .qlo-local-header{grid-template-columns:1fr auto!important;gap:.55rem!important;padding:.55rem!important}.qlo-subnav{grid-column:1/-1;justify-content:flex-start;padding-top:.25rem}.qlo-subnav button{min-height:44px;font-size:.54rem;padding:.48rem .62rem}.qlo-profile div{display:none}
  .qlo-welcome{grid-template-columns:1fr!important;padding:.8rem!important}.qlo-welcome h2{font-size:.92rem}.qlo-welcome p{font-size:.58rem}.qlo-welcome-actions{grid-template-columns:1fr 1fr}.qlo-action-card{min-height:58px}.qlo-action-card b{font-size:.56rem}.qlo-action-card small{font-size:.46rem}
  .qlo-notice{font-size:.51rem}.booking-kpis{grid-template-columns:1fr 1fr!important}.booking-chart{height:180px}.booking-row{grid-template-columns:32px minmax(0,1fr) auto}.booking-row .btn{grid-column:1/-1}.booking-row strong{font-size:.6rem}.booking-row small{font-size:.5rem}
}

@media(max-width:430px){
  :root{--mast:102px;--top:136px}
  .top-actions{grid-template-columns:minmax(0,1fr) minmax(0,.82fr) 42px}.top-actions #installButton{display:none!important}
  .brand b{max-width:135px;font-size:.61rem}.booking-kpis{grid-template-columns:1fr!important}.qlo-welcome-actions{grid-template-columns:1fr}.qlo-profile{display:none}.qlo-local-header{grid-template-columns:1fr!important}
  .okita-section-explain b{display:none}.okita-section-explain{width:34px;padding:.2rem;justify-content:center}.okita-section-explain span{width:20px;height:20px}
}

/* V8 drawer stacking correction: the scrim stays below the bright drawer. */
@media(max-width:920px){
  .app-shell{z-index:auto!important}
  .drawer-scrim{z-index:180!important}
  .sidebar{z-index:220!important}
  .sidebar-close{z-index:230!important}
  body.nav-open .okita-auto-guide{opacity:0!important;pointer-events:none!important}
}

/* =========================================================
   V9 — COMPLETE LIGHT/DARK THEME PARITY
   - Light mode uses one consistent Qlo-style white workspace.
   - Dark mode preserves the Unified IT Command visual language.
   - Disabled controls remain readable without becoming clickable.
   ========================================================= */

/* ---------- Complete light theme across every Hotel IT route ---------- */
html[data-theme="light"]{
  --bg:#f3f5fa;--bg2:#e9edf5;--surface:#ffffff;--surface2:#f7f8fc;--line:#d8e0ec;
  --text:#202d46;--muted:#67758c;--cyan:#596ce2;--green:#13846f;--amber:#b9690b;--red:#d7355b;--purple:#8355c9;
  --shadow:0 10px 28px rgba(52,72,104,.08);color-scheme:light;
}
html[data-theme="light"]{background:#f3f5fa!important;scrollbar-color:#596ce2 #e7ecf4!important}
html[data-theme="light"] body{background:#f3f5fa!important;color:#202d46!important;font-family:Inter,"Segoe UI",system-ui,sans-serif;letter-spacing:0}
html[data-theme="light"] body:after{display:none!important}
html[data-theme="light"] body:before{display:block!important;background:linear-gradient(rgba(89,108,226,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(89,108,226,.025) 1px,transparent 1px)!important;background-size:42px 42px!important}
html[data-theme="light"] #hotel-webgl-canvas,html[data-theme="light"] .shape-status{display:none!important}
html[data-theme="light"] .main{background:#f3f5fa!important}
html[data-theme="light"] .topbar{background:#fff!important;color:#202d46!important;border-bottom:1px solid #d8e0ec!important;box-shadow:0 8px 24px rgba(52,72,104,.09)!important}
html[data-theme="light"] .brand,html[data-theme="light"] .brand b,html[data-theme="light"] .brand small,html[data-theme="light"] .masthead-page,html[data-theme="light"] .top-actions{color:#202d46!important}
html[data-theme="light"] .brand small{color:#718097!important}
html[data-theme="light"] .brand-mark{border:2px solid #596ce2!important;background:#eef0ff!important;color:#596ce2!important;box-shadow:none!important;border-radius:10px!important}
html[data-theme="light"] .icon-btn,html[data-theme="light"] .live-pill,html[data-theme="light"] .compact-field{border:1px solid #cbd5e3!important;background:#fff!important;color:#25314a!important;box-shadow:0 2px 7px rgba(52,72,104,.06)!important;border-radius:9px!important}
html[data-theme="light"] .icon-btn:hover{background:#eef0ff!important;color:#3446b5!important;border-color:#596ce2!important}
html[data-theme="light"] .live-pill span{background:#18a999!important;box-shadow:0 0 10px rgba(24,169,153,.45)!important;border-radius:50%!important}
html[data-theme="light"] .compact-field select{color:#25314a!important;background:transparent!important}
html[data-theme="light"] .compact-field option{background:#fff!important;color:#25314a!important}
html[data-theme="light"] .ticker-wrapper{background:#fff!important;border-color:#dce3ee!important}
html[data-theme="light"] .ticker-track{background:#fff!important}
html[data-theme="light"] .ticker-label{background:#596ce2!important;color:#fff!important}
html[data-theme="light"] .ticker-text{color:#515d73!important}
html[data-theme="light"] .sidebar{background:#fff!important;border-color:#d8e0ec!important;box-shadow:8px 0 24px rgba(52,72,104,.07)!important;color:#202d46!important}
html[data-theme="light"] .property-card{background:#f0f4ff!important;border:1px solid #d8e0ec!important;border-radius:14px!important;color:#202d46!important}
html[data-theme="light"] .property-card .eyebrow{color:#596ce2!important}
html[data-theme="light"] .property-card strong{color:#202d46!important}
html[data-theme="light"] .property-card small,html[data-theme="light"] .property-health{color:#6f7d93!important}
html[data-theme="light"] .property-health{border-color:#d8e0ec!important}
html[data-theme="light"] .property-health b{color:#13846f!important}
html[data-theme="light"] .sidebar nav a{background:#fff!important;border:1px solid #edf0f5!important;color:#6f7d93!important;border-radius:11px!important;box-shadow:none!important}
html[data-theme="light"] .sidebar nav a span{color:#596ce2!important}
html[data-theme="light"] .sidebar nav a b{color:#25314a!important}
html[data-theme="light"] .sidebar nav a small{color:#78869a!important}
html[data-theme="light"] .sidebar nav a:hover,html[data-theme="light"] .sidebar nav a.active{background:#eef0ff!important;border-color:#c9d0f8!important;box-shadow:inset 4px 0 0 #596ce2!important}
html[data-theme="light"] .sidebar nav a:hover *,html[data-theme="light"] .sidebar nav a.active *{color:#3446b5!important}
html[data-theme="light"] .sidebar-foot{background:#f7f8fc!important;border-color:#d8e0ec!important;border-radius:11px!important}
html[data-theme="light"] .sidebar-foot span{color:#67758c!important}
html[data-theme="light"] .sidebar-foot button{background:#fff!important;border:1px solid #e4a4b5!important;color:#b72c50!important;border-radius:9px!important}
html[data-theme="light"] .sidebar-close{background:#fff!important;color:#3446b5!important;border-color:#9eaceb!important;border-radius:9px!important}
html[data-theme="light"] .page-head{margin:0 0 .85rem!important;padding:1rem 1.1rem!important;min-height:86px!important;background:#fff!important;border:1px solid #d8e0ec!important;border-radius:18px!important;box-shadow:0 10px 28px rgba(52,72,104,.07)!important}
html[data-theme="light"] .page-head h1{color:#25314a!important;text-transform:none!important;letter-spacing:-.025em!important}
html[data-theme="light"] .page-head p{color:#6f7d93!important}
html[data-theme="light"] .page-head .eyebrow{color:#596ce2!important}
html[data-theme="light"] .btn{background:#fff!important;color:#34405a!important;border:1px solid #cfd7e4!important;border-radius:9px!important;box-shadow:0 3px 9px rgba(52,72,104,.07)!important;text-transform:none!important}
html[data-theme="light"] .btn:hover{background:#eef0ff!important;color:#3446b5!important;border-color:#596ce2!important}
html[data-theme="light"] .btn.primary{background:#596ce2!important;color:#fff!important;border-color:#596ce2!important}
html[data-theme="light"] .btn.amber{background:#fff1cc!important;color:#6f5715!important;border-color:#e7c66e!important}
html[data-theme="light"] .btn.danger{background:#fff1f4!important;color:#b52d50!important;border-color:#e7a4b6!important}
html[data-theme="light"] .btn:disabled,html[data-theme="light"] [aria-disabled="true"],html[data-theme="light"] .data-table .btn:disabled{opacity:1!important;background:#edf1f6!important;color:#6b788b!important;border-color:#cfd7e3!important;box-shadow:none!important;cursor:not-allowed!important}
html[data-theme="light"] .kpi,html[data-theme="light"] .panel,html[data-theme="light"] .ticket-card,html[data-theme="light"] .ap-card,html[data-theme="light"] .asset-card,html[data-theme="light"] .handover-card,html[data-theme="light"] .scenario-card,html[data-theme="light"] .audit-row,html[data-theme="light"] .permission-matrix>*{background:#fff!important;border-color:#dce2ed!important;color:#25314a!important;box-shadow:0 8px 22px rgba(52,72,104,.055)!important;border-radius:14px!important}
html[data-theme="light"] .kpi{border-top:1px solid #dce2ed!important}
html[data-theme="light"] .kpi:before{content:"";display:block;width:28px;height:4px;margin-bottom:.48rem;background:var(--accent,var(--cyan));border-radius:999px!important}
html[data-theme="light"] .kpi span,html[data-theme="light"] .kpi small{color:#758399!important}
html[data-theme="light"] .kpi strong{color:#25314a!important}
html[data-theme="light"] .panel-head{background:#fff!important;border-color:#e3e8f0!important}
html[data-theme="light"] .panel-head h2{color:#25314a!important;text-transform:none!important;letter-spacing:0!important}
html[data-theme="light"] .panel-head small{color:#7b899d!important}
html[data-theme="light"] .panel-body{background:#fff!important;color:#34405a!important}
html[data-theme="light"] .ticket-card:before{border-radius:999px!important;top:10px!important;bottom:10px!important;width:3px!important}
html[data-theme="light"] .card-title,html[data-theme="light"] .scenario-card b{color:#25314a!important}
html[data-theme="light"] .meta-line,html[data-theme="light"] .subtext,html[data-theme="light"] .scenario-card small,html[data-theme="light"] .mini-metric span,html[data-theme="light"] .timeline-item small{color:#748298!important}
html[data-theme="light"] .card-foot{border-color:#e4e9f0!important}
html[data-theme="light"] .mini-metric{background:#f4f6fa!important;border-radius:9px!important}
html[data-theme="light"] .badge{background:#f7f9fc!important;border-color:currentColor!important;border-radius:999px!important}
html[data-theme="light"] .badge.green{color:#117761!important;background:#e5f7f0!important}
html[data-theme="light"] .badge.red{color:#c53153!important;background:#fff0f3!important}
html[data-theme="light"] .badge.amber{color:#99600d!important;background:#fff5dc!important}
html[data-theme="light"] .badge.cyan{color:#3e50bf!important;background:#eef0ff!important}
html[data-theme="light"] .badge.purple{color:#7547b5!important;background:#f3edff!important}
html[data-theme="light"] .badge.muted{color:#68758a!important;background:#edf1f6!important}
html[data-theme="light"] .data-table{color:#34405a!important}
html[data-theme="light"] .data-table th{background:#f2f5f9!important;color:#5f6d83!important;border-color:#dfe5ee!important}
html[data-theme="light"] .data-table td{background:#fff!important;color:#34405a!important;border-color:#e3e8f0!important}
html[data-theme="light"] .data-table tr:hover td{background:#f7f9fc!important}
html[data-theme="light"] .toolbar input,html[data-theme="light"] .toolbar select,html[data-theme="light"] .field input,html[data-theme="light"] .field select,html[data-theme="light"] .field textarea{background:#fff!important;color:#25314a!important;border:1px solid #cfd8e5!important;border-radius:9px!important}
html[data-theme="light"] .field label{color:#596ce2!important;text-transform:none!important}
html[data-theme="light"] .toolbar input::placeholder,html[data-theme="light"] .field input::placeholder,html[data-theme="light"] .field textarea::placeholder{color:#8995a7!important}
html[data-theme="light"] .topology{background:#f4f7fb!important;border-color:#bac6d7!important}
html[data-theme="light"] .timeline:before{background:#ccd6e3!important}
html[data-theme="light"] .timeline-item:before{background:#596ce2!important;box-shadow:0 0 0 3px #eef0ff!important;border-radius:50%!important}
html[data-theme="light"] .audit-row code{color:#3446b5!important}
html[data-theme="light"] .hash-ok{color:#117761!important}
html[data-theme="light"] .architecture .arch-node,html[data-theme="light"] .workflow-map>div,html[data-theme="light"] .adapter-status{background:#f7f9fc!important;border-color:#cfd8e5!important;color:#34405a!important;border-radius:11px!important}
html[data-theme="light"] .architecture .arch-node strong,html[data-theme="light"] .workflow-map b{color:#3446b5!important}
html[data-theme="light"] .progress-ring:before{background:#fff!important}
html[data-theme="light"] .dialog,html[data-theme="light"] .toast,html[data-theme="light"] .session-lock>div{background:#fff!important;color:#25314a!important;border-color:#cfd8e5!important;border-radius:16px!important}
html[data-theme="light"] .dialog::backdrop,html[data-theme="light"] .session-lock{background:rgba(25,38,57,.55)!important}
html[data-theme="light"] .dialog-shell>header{background:#eef0ff!important;color:#25314a!important;border-color:#cfd8e5!important}
html[data-theme="light"] .dialog-shell>header .eyebrow{color:#596ce2!important}
html[data-theme="light"] .toast{border-left-color:#596ce2!important}
html[data-theme="light"] .disclaimer,html[data-theme="light"] .qlo-notice{background:#fff8e9!important;color:#72542b!important;border-color:#efd5aa!important;border-radius:10px!important}
html[data-theme="light"] .statusbar{background:#fff!important;border-color:#d8e0ec!important;color:#34405a!important}
html[data-theme="light"] .statusbar .status-command{background:#596ce2!important;color:#fff!important}
html[data-theme="light"] .statusbar>span:nth-of-type(1){background:#dff7ef!important;color:#176c5f!important}
html[data-theme="light"] .statusbar>span:nth-of-type(1) b{color:#176c5f!important}
html[data-theme="light"] .statusbar>span:nth-of-type(2){background:#fff1cc!important;color:#6f5715!important}
html[data-theme="light"] .statusbar>span:nth-of-type(3){background:#e7ebff!important;color:#3446b5!important}
html[data-theme="light"] .drawer-scrim{background:rgba(25,46,67,.34)!important}
html[data-theme="light"] .okita-section-explain{background:#fff!important;color:#4658c5!important;border-color:#cbd4e8!important;border-radius:999px!important}
html[data-theme="light"] .okita-section-explain span{background:#596ce2!important;color:#fff!important;border-radius:50%!important}

/* ---------- Dark booking workspace: same Qlo workflow, dark command palette ---------- */
html[data-theme="dark"] body[data-route="booking"]{
  --bg:#00091a;--bg2:#00142b;--surface:#00152e;--surface2:#001a38;--line:#17456b;
  --text:#f5fbff;--muted:#9ab0c7;--cyan:#00cccc;--green:#66ff66;--amber:#ffff33;--red:#ff334d;--purple:#c17aff;
  color-scheme:dark;background:#00091a!important;font-family:ui-monospace,"Cascadia Mono",Consolas,monospace;letter-spacing:.015em
}
html[data-theme="dark"] body[data-route="booking"]:before{display:block!important}
html[data-theme="dark"] body[data-route="booking"]:after{display:block!important}
html[data-theme="dark"] body[data-route="booking"] .main{background:linear-gradient(90deg,rgba(0,0,0,.18),transparent)!important}
html[data-theme="dark"] body[data-route="booking"] .topbar{background:#00cccc!important;color:#001020!important;border:0!important;box-shadow:0 10px 30px rgba(0,0,0,.4)!important}
html[data-theme="dark"] body[data-route="booking"] .brand,html[data-theme="dark"] body[data-route="booking"] .brand b,html[data-theme="dark"] body[data-route="booking"] .brand small,html[data-theme="dark"] body[data-route="booking"] .masthead-page,html[data-theme="dark"] body[data-route="booking"] .top-actions{color:#001020!important}
html[data-theme="dark"] body[data-route="booking"] .brand-mark{border-color:#001020!important;background:transparent!important;color:#001020!important}
html[data-theme="dark"] body[data-route="booking"] .icon-btn,html[data-theme="dark"] body[data-route="booking"] .live-pill,html[data-theme="dark"] body[data-route="booking"] .compact-field{border-color:#001020!important;background:transparent!important;color:#001020!important;box-shadow:none!important}
html[data-theme="dark"] body[data-route="booking"] .compact-field select{color:#001020!important}
html[data-theme="dark"] body[data-route="booking"] .ticker-wrapper{background:#000!important;border-color:#00cccc!important}
html[data-theme="dark"] body[data-route="booking"] .ticker-track{background:#000!important}
html[data-theme="dark"] body[data-route="booking"] .ticker-label{background:#ff334d!important;color:#fff!important}
html[data-theme="dark"] body[data-route="booking"] .ticker-text{color:#ffff33!important}
html[data-theme="dark"] body[data-route="booking"] .sidebar{background:#00142b!important;border-color:#17456b!important;box-shadow:inset -12px 0 0 rgba(0,0,0,.2)!important}
html[data-theme="dark"] body[data-route="booking"] .property-card{background:#00243d!important;border-color:#00cccc!important}
html[data-theme="dark"] body[data-route="booking"] .property-card .eyebrow{color:#00cccc!important}
html[data-theme="dark"] body[data-route="booking"] .property-card strong{color:#ffff33!important}
html[data-theme="dark"] body[data-route="booking"] .property-card small,html[data-theme="dark"] body[data-route="booking"] .property-health{color:#9ab0c7!important}
html[data-theme="dark"] body[data-route="booking"] .sidebar nav a{background:linear-gradient(180deg,#00142b,#000b1b)!important;border-color:#082747!important;color:#9ab0c7!important}
html[data-theme="dark"] body[data-route="booking"] .sidebar nav a span{color:#00cccc!important}
html[data-theme="dark"] body[data-route="booking"] .sidebar nav a b{color:#ffff33!important}
html[data-theme="dark"] body[data-route="booking"] .sidebar nav a:hover,html[data-theme="dark"] body[data-route="booking"] .sidebar nav a.active{background:#00cccc!important;box-shadow:inset 6px 0 0 #ffff33!important}
html[data-theme="dark"] body[data-route="booking"] .sidebar nav a:hover *,html[data-theme="dark"] body[data-route="booking"] .sidebar nav a.active *{color:#001020!important}
html[data-theme="dark"] body[data-route="booking"] .sidebar-foot{background:#00091a!important;border-color:#17456b!important}
html[data-theme="dark"] body[data-route="booking"] .page-head{background:#00243d!important;border-color:#17456b!important;border-radius:0!important;box-shadow:none!important}
html[data-theme="dark"] body[data-route="booking"] .page-head h1{color:#ffff33!important;text-transform:uppercase!important;letter-spacing:.04em!important}
html[data-theme="dark"] body[data-route="booking"] .page-head p{color:#f5fbff!important}
html[data-theme="dark"] body[data-route="booking"] .page-head .eyebrow{color:#00cccc!important}
html[data-theme="dark"] body[data-route="booking"] .btn{background:#001a38!important;color:#f5fbff!important;border:2px solid #7990a8!important;border-radius:0!important;box-shadow:0 5px 0 rgba(0,0,0,.35)!important;text-transform:uppercase!important}
html[data-theme="dark"] body[data-route="booking"] .btn.primary{background:#00cccc!important;color:#001020!important;border-color:#00cccc!important}
html[data-theme="dark"] body[data-route="booking"] .qlo-dashboard-shell{color:#f5fbff!important}
html[data-theme="dark"] body[data-route="booking"] .qlo-local-header,html[data-theme="dark"] body[data-route="booking"] .qlo-welcome,html[data-theme="dark"] body[data-route="booking"] .qlo-card,html[data-theme="dark"] body[data-route="booking"] .kpi{background:#00152e!important;border-color:#17456b!important;border-radius:0!important;box-shadow:none!important}
html[data-theme="dark"] body[data-route="booking"] .qlo-property-logo,html[data-theme="dark"] body[data-route="booking"] .qlo-profile-dot{background:#00cccc!important;color:#001020!important;border-radius:0!important}
html[data-theme="dark"] body[data-route="booking"] .qlo-property-brand strong,html[data-theme="dark"] body[data-route="booking"] .qlo-profile b,html[data-theme="dark"] body[data-route="booking"] .qlo-welcome h2{color:#ffff33!important}
html[data-theme="dark"] body[data-route="booking"] .qlo-property-brand small,html[data-theme="dark"] body[data-route="booking"] .qlo-profile small,html[data-theme="dark"] body[data-route="booking"] .qlo-welcome p{color:#9ab0c7!important}
html[data-theme="dark"] body[data-route="booking"] .qlo-kicker{color:#00cccc!important}
html[data-theme="dark"] body[data-route="booking"] .qlo-subnav button{color:#9ab0c7!important;border-radius:0!important}
html[data-theme="dark"] body[data-route="booking"] .qlo-subnav button:hover,html[data-theme="dark"] body[data-route="booking"] .qlo-subnav button.active{background:#00cccc!important;color:#001020!important}
html[data-theme="dark"] body[data-route="booking"] .qlo-action-card{background:#001a38!important;color:#f5fbff!important;border-color:#17456b!important;border-radius:0!important}
html[data-theme="dark"] body[data-route="booking"] .qlo-action-card>span{background:#00cccc!important;color:#001020!important;border-radius:0!important}
html[data-theme="dark"] body[data-route="booking"] .qlo-action-card small{color:#9ab0c7!important}
html[data-theme="dark"] body[data-route="booking"] .qlo-notice{background:#211a00!important;color:#ffe89b!important;border-color:#7d6814!important;border-radius:0!important}
html[data-theme="dark"] body[data-route="booking"] .kpi span,html[data-theme="dark"] body[data-route="booking"] .kpi small{color:#9ab0c7!important}
html[data-theme="dark"] body[data-route="booking"] .kpi strong{color:#ffff33!important}
html[data-theme="dark"] body[data-route="booking"] .panel-head{background:#001a38!important;border-color:#17456b!important}
html[data-theme="dark"] body[data-route="booking"] .panel-head h2{color:#ffff33!important;text-transform:uppercase!important;letter-spacing:.05em!important}
html[data-theme="dark"] body[data-route="booking"] .panel-head small{color:#9ab0c7!important}
html[data-theme="dark"] body[data-route="booking"] .panel-body{background:rgba(0,9,26,.86)!important;color:#f5fbff!important}
html[data-theme="dark"] body[data-route="booking"] .booking-chart{border-color:#17456b!important;background:linear-gradient(rgba(0,204,204,.055) 1px,transparent 1px)!important;background-size:100% 25%!important}
html[data-theme="dark"] body[data-route="booking"] .booking-day b{color:#ffff33!important}
html[data-theme="dark"] body[data-route="booking"] .booking-row,html[data-theme="dark"] body[data-route="booking"] .adapter-status,html[data-theme="dark"] body[data-route="booking"] .audit-row,html[data-theme="dark"] body[data-route="booking"] .workflow-map>div{background:#001a38!important;border-color:#17456b!important;color:#f5fbff!important;border-radius:0!important}
html[data-theme="dark"] body[data-route="booking"] .booking-avatar{background:#00cccc!important;color:#001020!important;border-radius:0!important}
html[data-theme="dark"] body[data-route="booking"] .booking-row strong{color:#f5fbff!important}
html[data-theme="dark"] body[data-route="booking"] .booking-row small,html[data-theme="dark"] body[data-route="booking"] .booking-legend,html[data-theme="dark"] body[data-route="booking"] .workflow-map small{color:#9ab0c7!important}
html[data-theme="dark"] body[data-route="booking"] .workflow-map b{color:#ffff33!important}
html[data-theme="dark"] body[data-route="booking"] .toolbar input{background:#f4f7fb!important;color:#07111f!important;border-color:#7990a8!important;border-radius:0!important}
html[data-theme="dark"] body[data-route="booking"] .data-table th{background:#00243d!important;color:#00cccc!important}
html[data-theme="dark"] body[data-route="booking"] .data-table td{background:rgba(0,20,43,.82)!important;color:#f5fbff!important}
html[data-theme="dark"] body[data-route="booking"] .data-table tr:hover td{background:#00303c!important}
html[data-theme="dark"] body[data-route="booking"] .statusbar{background:#050a14!important;border-color:#17456b!important;color:#9ab0c7!important}
html[data-theme="dark"] body[data-route="booking"] .statusbar .status-command{background:#ff334d!important;color:#fff!important}
html[data-theme="dark"] body[data-route="booking"] .statusbar>span:nth-of-type(1){background:#66ff66!important;color:#001020!important}
html[data-theme="dark"] body[data-route="booking"] .statusbar>span:nth-of-type(2){background:#ffff33!important;color:#001020!important}
html[data-theme="dark"] body[data-route="booking"] .statusbar>span:nth-of-type(3){background:#00cccc!important;color:#001020!important}
html[data-theme="dark"] body[data-route="booking"] .okita-section-explain{background:#001a38!important;color:#00cccc!important;border-color:#00cccc!important;border-radius:0!important}
html[data-theme="dark"] body[data-route="booking"] .okita-section-explain span{background:#00cccc!important;color:#001020!important;border-radius:0!important}

/* ---------- Mobile parity: light stays bright; dark returns to Command mode ---------- */
@media(max-width:920px){
  html[data-theme="dark"] .topbar{background:#00cccc!important;color:#001020!important;border-bottom:0!important;box-shadow:0 10px 30px rgba(0,0,0,.4)!important}
  html[data-theme="dark"] .brand,html[data-theme="dark"] .brand b,html[data-theme="dark"] .brand small,html[data-theme="dark"] .masthead-page,html[data-theme="dark"] .top-actions{color:#001020!important}
  html[data-theme="dark"] .brand-mark{border-color:#001020!important;background:transparent!important;color:#001020!important}
  html[data-theme="dark"] .icon-btn,html[data-theme="dark"] .live-pill,html[data-theme="dark"] .compact-field{border:2px solid #001020!important;background:transparent!important;color:#001020!important;box-shadow:none!important}
  html[data-theme="dark"] .compact-field select{color:#001020!important}
  html[data-theme="dark"] .ticker-wrapper,html[data-theme="dark"] .ticker-track{background:#000!important}
  html[data-theme="dark"] .ticker-wrapper{border-bottom-color:#00cccc!important}
  html[data-theme="dark"] .ticker-text{color:#ffff33!important}
  html[data-theme="dark"] .ticker-label{background:#ff334d!important;color:#fff!important}
  html[data-theme="dark"] .sidebar{background:#00142b!important;border:2px solid #00cccc!important;box-shadow:16px 18px 0 rgba(0,0,0,.42)!important;color:#f5fbff!important}
  html[data-theme="dark"] .sidebar-close{background:#001020!important;color:#00cccc!important;border-color:#00cccc!important;border-radius:0!important}
  html[data-theme="dark"] .property-card{background:#00243d!important;border-color:#00cccc!important;border-radius:0!important;color:#f5fbff!important}
  html[data-theme="dark"] .property-card .eyebrow{color:#00cccc!important}
  html[data-theme="dark"] .property-card strong{color:#ffff33!important}
  html[data-theme="dark"] .property-card small,html[data-theme="dark"] .property-health{color:#9ab0c7!important}
  html[data-theme="dark"] .sidebar nav a{background:linear-gradient(180deg,#00142b,#000b1b)!important;border-color:#082747!important;border-radius:0!important;color:#9ab0c7!important}
  html[data-theme="dark"] .sidebar nav a span{color:#00cccc!important}
  html[data-theme="dark"] .sidebar nav a b{color:#ffff33!important}
  html[data-theme="dark"] .sidebar nav a small{color:#9ab0c7!important}
  html[data-theme="dark"] .sidebar nav a:hover,html[data-theme="dark"] .sidebar nav a.active{background:#00cccc!important;border-color:#00cccc!important;box-shadow:inset 5px 0 0 #ffff33!important}
  html[data-theme="dark"] .sidebar nav a:hover *,html[data-theme="dark"] .sidebar nav a.active *{color:#001020!important}
  html[data-theme="dark"] .sidebar-foot{background:#00091a!important;border-color:#17456b!important;border-radius:0!important}
  html[data-theme="dark"] .drawer-scrim{background:rgba(0,0,0,.72)!important;backdrop-filter:none!important}
  html[data-theme="dark"] .okita-section-explain{background:#001a38!important;color:#00cccc!important;border-color:#00cccc!important;border-radius:0!important}
}

/* Keep table controls visibly readable in both themes, including role-disabled actions. */
html[data-theme="dark"] .data-table .btn:disabled,html[data-theme="dark"] .data-table [aria-disabled="true"]{opacity:.72!important;background:#0b2138!important;color:#b6c7d8!important;border-color:#48657e!important;box-shadow:none!important}

/* =========================================================
   V10 — Single Okita explanation control
   Exactly one button is shown for the active route.
   ========================================================= */
.okita-explain-host{position:relative!important}
.okita-explain-host:not(.page-head){padding-top:0!important}
.okita-single-explain{
  position:absolute!important;
  z-index:20!important;
  top:.62rem!important;
  right:.72rem!important;
  width:auto!important;
  max-width:min(15rem,calc(100% - 1.4rem))!important;
  min-height:34px!important;
  padding:.3rem .58rem!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:.38rem!important;
  white-space:nowrap!important;
}
.page-head.okita-explain-host{padding-right:11.5rem!important;padding-top:inherit!important}
.kpi-grid.okita-explain-host,.panel.okita-explain-host,.qlo-local-header.okita-explain-host,.qlo-welcome.okita-explain-host,.qlo-notice.okita-explain-host{padding-top:inherit!important}
@media(max-width:620px){
  .page-head.okita-explain-host{padding-right:.8rem!important;padding-top:3.1rem!important}
  .okita-single-explain{top:.45rem!important;right:.5rem!important;max-width:calc(100% - 1rem)!important}
  .okita-single-explain b{display:inline!important}
}
@media(max-width:430px){
  .okita-single-explain{width:auto!important;padding:.28rem .5rem!important}
  .okita-single-explain b{display:inline!important;font-size:.48rem!important}
}