.demo-shell{max-width:1050px;margin:35px auto;padding:0 20px}.demo-shell h1{font-size:36px}.disclaimer{padding:18px;background:#eee4c8;border-radius:12px;line-height:1.6}.demo-badge{margin-left:auto;font-size:12px;font-weight:bold}.role-bar,#tabs{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0}button{cursor:pointer;padding:12px 16px;border:1px solid #bdcbc4;border-radius:9px;background:#fff;color:#17342e}button.active{background:#17483e;color:#fff}button:focus-visible,a:focus-visible{outline:3px solid #bf6a23;outline-offset:3px}.demo-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px}.demo-panel{padding:24px;margin:16px 0}.demo-table{width:100%;border-collapse:collapse}.demo-table th,.demo-table td{text-align:left;padding:12px;border-bottom:1px solid #d9d7cf}.table-wrap{overflow:auto}.map{width:100%;height:auto;background:#eef2e9;border-radius:12px}.map text{font:14px Arial}.demo-shell input,.demo-shell select{padding:12px;max-width:100%;border:1px solid #bccac3;border-radius:8px;margin:8px 0;display:block}.demo-shell label{display:block;margin-top:12px}.demo-shell form button{margin-top:12px}#feedback{font-weight:bold;color:#17483e}footer{height:auto;min-height:54px;gap:12px;flex-wrap:wrap;padding:14px 5vw}@media(max-width:600px){header{gap:10px;padding:0 15px}.demo-badge{font-size:10px}.demo-shell h1{font-size:28px}}
.theme-label{display:flex;align-items:center;gap:6px;font-size:12px}.theme-label select{padding:7px;border-radius:7px;background:#fff;color:#17342e;border:1px solid #bdcbc4}
html[data-theme="dark"]{color:#eceff2;background:#16181b}
html[data-theme="dark"] body{background:#16181b;color:#eceff2}
html[data-theme="dark"] header,html[data-theme="dark"] .card{background:#23262b;border-color:#41464f;color:#eceff2}
html[data-theme="dark"] button,html[data-theme="dark"] input,html[data-theme="dark"] select{background:#2c3036;color:#eceff2;border-color:#515761}
html[data-theme="dark"] button.active{background:#ee914c;color:#22180f}
html[data-theme="dark"] .disclaimer{background:#302922;color:#ecd8c6}
html[data-theme="dark"] .state{background:#30343a}html[data-theme="dark"] .state.on{background:#3c3024}
html[data-theme="dark"] .eyebrow,html[data-theme="dark"] #feedback,html[data-theme="dark"] footer{color:#c1c7cf}
html[data-theme="dark"] a{color:#efb17c}html[data-theme="dark"] th,html[data-theme="dark"] td,html[data-theme="dark"] footer{border-color:#41464f}
@media(max-width:600px){header{height:auto;min-height:74px;flex-wrap:wrap;padding-top:12px;padding-bottom:12px}.theme-label{margin-left:auto}}

header .brand b{background:#b9501a;color:#fff}header{gap:18px}header .brand{flex-shrink:0}header>a{white-space:nowrap}
html[data-theme="light"] body{background:#f4f5f7;color:#252a31}html[data-theme="light"] header{background:#fff;border-color:#d5d9df}html[data-theme="light"] .card{background:#fff;border-color:#d5d9df}html[data-theme="light"] button,html[data-theme="light"] input,html[data-theme="light"] select{color:#252a31;border-color:#c7cdd5}html[data-theme="light"] button.active{background:#b9501a;color:#fff}html[data-theme="light"] #feedback{color:#974313}html[data-theme="light"] .disclaimer{background:#f0e6dc;color:#574332}html[data-theme="light"] .state{background:#eceff2}html[data-theme="light"] .state.on{background:#f6e5d5}