:root{
  --winmo-chrome1:#eef2f6; --winmo-chrome2:#c7d0da; --winmo-blue:#1BA1E2; --winmo-teal:#00ABA9;
  --winmo-green:#60A917; --winmo-orange:#FA6800; --winmo-magenta:#D80073; --winmo-navy:#173a56;
  --winmo-ink:#1b2733; --winmo-panel:#ffffff; --winmo-border:#aebdce;
  --dos-bg:#000000; --dos-fg:#33ff33; --dos-dim:#1c8f1c; --dos-amber:#ffb000; --dos-border:#33ff33;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{min-height:100vh;transition:background .25s,color .25s;}

/* ============ LAYOUT SHARED ============ */
.app{max-width:1180px;margin:0 auto;padding:0 16px 60px;}
.hidden{display:none !important;}
img{max-width:100%;display:block;}
a{text-decoration:none;}
button{cursor:pointer;font-family:inherit;}

/* ---------- TOPBAR (universal) ---------- */
.topbar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 16px;flex-wrap:wrap;font-size:12px;}
.topbar .clock{font-variant-numeric:tabular-nums;}
.topbar .status-open{color:#2e7d32;font-weight:700;}
.topbar .status-closed{color:#c62828;font-weight:700;}
.theme-switch button{border:none;padding:6px 12px;border-radius:6px;font-size:11px;font-weight:600;margin-left:4px;}
.a11y-controls{display:flex;gap:6px;align-items:center;}
.a11y-controls button{width:26px;height:26px;border-radius:5px;font-size:12px;}

/* ============================================================
   THEME 1: WINDOWS MOBILE
   ============================================================ */
body[data-theme="winmo"]{
  background:linear-gradient(180deg,#dfe7ee 0%,#c9d4e0 400px,#eef2f6 400px);
  color:var(--winmo-ink);
  font-family:"Segoe UI",Tahoma,Geneva,Verdana,sans-serif;
}
body[data-theme="winmo"] .device-frame{
  max-width:1180px;margin:14px auto;border-radius:22px;
  background:linear-gradient(180deg,#3a4a5c,#1c2733);
  padding:14px;box-shadow:0 20px 45px rgba(20,30,45,.35);
}
body[data-theme="winmo"] .screen{
  background:var(--winmo-panel);border-radius:14px;overflow:hidden;
  box-shadow:inset 0 0 0 2px #0d1620;
}
body[data-theme="winmo"] .topbar{
  background:linear-gradient(180deg,var(--winmo-chrome1),var(--winmo-chrome2));
  border-bottom:1px solid var(--winmo-border);color:var(--winmo-navy);
}
body[data-theme="winmo"] .theme-switch button{background:#dbe4ee;color:#274156;box-shadow:inset 0 -2px 0 rgba(0,0,0,.08);}
body[data-theme="winmo"] .theme-switch button.active{background:var(--winmo-blue);color:#fff;}
body[data-theme="winmo"] .a11y-controls button{background:#dbe4ee;border:1px solid var(--winmo-border);color:#274156;}

body[data-theme="winmo"] .hero{
  background:linear-gradient(135deg,var(--winmo-blue),#0f6fb3);
  color:#fff;padding:26px 22px;display:flex;gap:20px;align-items:center;flex-wrap:wrap;
}
body[data-theme="winmo"] .hero img.logo{background:#fff;border-radius:10px;padding:6px;width:110px;}
body[data-theme="winmo"] .hero h1{margin:0 0 6px;font-size:22px;letter-spacing:.3px;}
body[data-theme="winmo"] .hero p{margin:0;opacity:.92;font-size:13.5px;max-width:560px;}

body[data-theme="winmo"] .infobar{display:flex;gap:10px;flex-wrap:wrap;padding:12px 18px;background:#f3f6f9;border-bottom:1px solid var(--winmo-border);}
body[data-theme="winmo"] .infochip{background:#fff;border:1px solid var(--winmo-border);border-radius:10px;padding:8px 12px;font-size:12px;box-shadow:0 2px 4px rgba(0,0,0,.05);flex:1 1 150px;min-width:150px;}
body[data-theme="winmo"] .infochip b{display:block;font-size:14px;color:var(--winmo-navy);}

/* Tile nav (start screen style) */
body[data-theme="winmo"] .tilenav{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;padding:14px 18px;}
body[data-theme="winmo"] .tile{
  border:none;border-radius:8px;color:#fff;padding:16px 8px;font-weight:700;font-size:12px;text-align:left;
  min-height:78px;display:flex;flex-direction:column;justify-content:flex-end;
  box-shadow:inset 0 -30px 30px -20px rgba(0,0,0,.25);
  transition:transform .12s;
}
body[data-theme="winmo"] .tile:hover{transform:translateY(-2px);}
body[data-theme="winmo"] .tile.active{outline:3px solid #123;}
body[data-theme="winmo"] .tile .icon{font-size:22px;margin-bottom:6px;}
body[data-theme="winmo"] .tile.c1{background:var(--winmo-blue);}
body[data-theme="winmo"] .tile.c2{background:var(--winmo-teal);}
body[data-theme="winmo"] .tile.c3{background:var(--winmo-green);}
body[data-theme="winmo"] .tile.c4{background:var(--winmo-orange);}
body[data-theme="winmo"] .tile.c5{background:var(--winmo-magenta);}

body[data-theme="winmo"] .subtabs{display:flex;gap:6px;flex-wrap:wrap;padding:12px 18px 0;}
body[data-theme="winmo"] .subtab{border:1px solid var(--winmo-border);background:#fff;border-radius:20px;padding:7px 14px;font-size:12px;font-weight:600;color:#345;}
body[data-theme="winmo"] .subtab.active{background:var(--winmo-blue);border-color:var(--winmo-blue);color:#fff;}

body[data-theme="winmo"] .content{padding:16px 18px 30px;}
body[data-theme="winmo"] .card{background:#fff;border:1px solid var(--winmo-border);border-radius:12px;padding:16px 18px;margin-bottom:14px;box-shadow:0 2px 6px rgba(20,30,45,.06);}
body[data-theme="winmo"] .card h2{margin-top:0;color:var(--winmo-navy);font-size:17px;border-bottom:2px solid var(--winmo-blue);padding-bottom:8px;}
body[data-theme="winmo"] .card h3{color:var(--winmo-navy);font-size:14.5px;}
body[data-theme="winmo"] .pill{display:inline-block;background:#eaf4fc;color:#0f6fb3;border-radius:20px;padding:3px 10px;font-size:11px;font-weight:700;margin-bottom:8px;}
body[data-theme="winmo"] table{width:100%;border-collapse:collapse;font-size:12.5px;}
body[data-theme="winmo"] th,body[data-theme="winmo"] td{border:1px solid var(--winmo-border);padding:8px;text-align:left;}
body[data-theme="winmo"] th{background:#eaf1f8;color:var(--winmo-navy);}
body[data-theme="winmo"] .btn{display:inline-block;background:var(--winmo-blue);color:#fff;padding:9px 16px;border-radius:8px;font-size:12.5px;font-weight:700;border:none;}
body[data-theme="winmo"] .btn.secondary{background:#eaf1f8;color:var(--winmo-navy);}
body[data-theme="winmo"] input,body[data-theme="winmo"] textarea,body[data-theme="winmo"] select{
  width:100%;padding:9px 10px;border:1px solid var(--winmo-border);border-radius:8px;font-size:12.5px;margin-bottom:10px;font-family:inherit;background:#fbfcfe;}
body[data-theme="winmo"] label{font-size:12px;font-weight:700;color:var(--winmo-navy);display:block;margin-bottom:4px;}
body[data-theme="winmo"] .step{display:flex;gap:10px;margin-bottom:10px;align-items:flex-start;}
body[data-theme="winmo"] .step .n{background:var(--winmo-blue);color:#fff;width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;flex-shrink:0;}
body[data-theme="winmo"] footer{background:linear-gradient(180deg,var(--winmo-chrome1),var(--winmo-chrome2));border-top:1px solid var(--winmo-border);padding:16px 18px;font-size:11.5px;color:#345;}
body[data-theme="winmo"] .footgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
body[data-theme="winmo"] .footgrid a{color:#0f6fb3;display:block;margin:3px 0;}
body[data-theme="winmo"] .search input{border-radius:20px;padding:7px 14px;font-size:12px;border:1px solid var(--winmo-border);}

/* ============================================================
   THEME 2: DOS PROMPT
   ============================================================ */
body[data-theme="dos"]{
  background:#000;color:var(--dos-fg);
  font-family:"Consolas","Courier New",monospace;
}
body[data-theme="dos"] .device-frame{max-width:1180px;margin:14px auto;padding:0;}
body[data-theme="dos"] .screen{background:#000;position:relative;border:2px solid var(--dos-fg);border-radius:2px;}
body[data-theme="dos"] .screen::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:repeating-linear-gradient(0deg,rgba(51,255,51,.035) 0px,rgba(51,255,51,.035) 1px,transparent 2px,transparent 3px);
}
body[data-theme="dos"] .topbar{background:#000;border-bottom:1px dashed var(--dos-fg);color:var(--dos-fg);font-family:inherit;}
body[data-theme="dos"] .theme-switch button{background:#000;color:var(--dos-fg);border:1px solid var(--dos-fg);border-radius:0;font-family:inherit;}
body[data-theme="dos"] .theme-switch button.active{background:var(--dos-fg);color:#000;}
body[data-theme="dos"] .a11y-controls button{background:#000;border:1px solid var(--dos-fg);color:var(--dos-fg);border-radius:0;}

body[data-theme="dos"] .hero{padding:18px;border-bottom:1px dashed var(--dos-fg);}
body[data-theme="dos"] .hero .asciibox{border:1px solid var(--dos-fg);padding:14px;}
body[data-theme="dos"] .hero img.logo{width:70px;filter:grayscale(1) contrast(1.4);border:1px solid var(--dos-fg);}
body[data-theme="dos"] .hero h1{margin:10px 0 6px;font-size:18px;letter-spacing:.5px;}
body[data-theme="dos"] .hero h1::before{content:"C:\\KSDE> ";color:var(--dos-dim);}
body[data-theme="dos"] .hero p{margin:0;font-size:12.5px;color:var(--dos-fg);opacity:.9;}
body[data-theme="dos"] .blink{animation:blink 1s steps(1) infinite;}
@keyframes blink{50%{opacity:0;}}

body[data-theme="dos"] .infobar{display:flex;gap:10px;flex-wrap:wrap;padding:12px 18px;border-bottom:1px dashed var(--dos-fg);font-size:11.5px;}
body[data-theme="dos"] .infochip{border:1px solid var(--dos-fg);padding:7px 10px;flex:1 1 150px;min-width:150px;}
body[data-theme="dos"] .infochip b{display:block;color:var(--dos-amber);}

body[data-theme="dos"] .tilenav{display:flex;flex-wrap:wrap;gap:0;padding:10px 18px;border-bottom:1px dashed var(--dos-fg);}
body[data-theme="dos"] .tile{
  background:#000;color:var(--dos-fg);border:1px solid var(--dos-fg);border-radius:0;
  padding:9px 14px;font-size:12px;font-weight:700;margin:3px;font-family:inherit;
}
body[data-theme="dos"] .tile::before{content:"[ ";}
body[data-theme="dos"] .tile::after{content:" ]";}
body[data-theme="dos"] .tile.active{background:var(--dos-fg);color:#000;}
body[data-theme="dos"] .tile .icon{display:none;}

body[data-theme="dos"] .subtabs{display:flex;flex-wrap:wrap;gap:0;padding:10px 18px 0;}
body[data-theme="dos"] .subtab{background:#000;color:var(--dos-fg);border:1px solid var(--dos-dim);border-radius:0;padding:6px 12px;font-size:11.5px;margin:2px;font-family:inherit;}
body[data-theme="dos"] .subtab::before{content:"> ";}
body[data-theme="dos"] .subtab.active{background:var(--dos-fg);color:#000;border-color:var(--dos-fg);}

body[data-theme="dos"] .content{padding:16px 18px 30px;}
body[data-theme="dos"] .card{border:1px solid var(--dos-fg);padding:14px 16px;margin-bottom:14px;}
body[data-theme="dos"] .card h2{margin-top:0;font-size:15px;color:var(--dos-amber);border-bottom:1px dashed var(--dos-fg);padding-bottom:8px;}
body[data-theme="dos"] .card h2::before{content:"### ";}
body[data-theme="dos"] .card h3{color:var(--dos-fg);font-size:13px;}
body[data-theme="dos"] .card h3::before{content:"- ";color:var(--dos-dim);}
body[data-theme="dos"] .pill{display:inline-block;border:1px solid var(--dos-amber);color:var(--dos-amber);padding:2px 8px;font-size:10.5px;margin-bottom:8px;}
body[data-theme="dos"] table{width:100%;border-collapse:collapse;font-size:11.5px;}
body[data-theme="dos"] th,body[data-theme="dos"] td{border:1px solid var(--dos-dim);padding:7px;text-align:left;}
body[data-theme="dos"] th{color:var(--dos-amber);}
body[data-theme="dos"] .btn{display:inline-block;background:#000;color:var(--dos-fg);padding:8px 14px;border:1px solid var(--dos-fg);font-size:12px;font-weight:700;}
body[data-theme="dos"] .btn::before{content:"[ ";}
body[data-theme="dos"] .btn::after{content:" ]";}
body[data-theme="dos"] .btn.secondary{color:var(--dos-dim);border-color:var(--dos-dim);}
body[data-theme="dos"] input,body[data-theme="dos"] textarea,body[data-theme="dos"] select{
  width:100%;padding:8px 9px;background:#000;color:var(--dos-fg);border:1px solid var(--dos-fg);border-radius:0;font-size:12px;margin-bottom:10px;font-family:inherit;}
body[data-theme="dos"] label{font-size:11.5px;color:var(--dos-amber);display:block;margin-bottom:4px;}
body[data-theme="dos"] label::before{content:"> ";}
body[data-theme="dos"] .step{display:flex;gap:8px;margin-bottom:8px;font-size:12.5px;}
body[data-theme="dos"] .step .n{color:var(--dos-amber);flex-shrink:0;}
body[data-theme="dos"] footer{border-top:1px dashed var(--dos-fg);padding:14px 18px;font-size:11px;}
body[data-theme="dos"] .footgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
body[data-theme="dos"] .footgrid a{color:var(--dos-fg);display:block;margin:3px 0;}
body[data-theme="dos"] .footgrid a::before{content:"* ";}
body[data-theme="dos"] .search input{border-radius:0;}
body[data-theme="dos"] img.photo{filter:grayscale(.15) contrast(1.05) sepia(.08);border:1px solid var(--dos-fg);}

/* ---------- shared bits ---------- */
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.photo{border-radius:8px;width:100%;height:auto;object-fit:cover;}
.center{text-align:center;}
.small{font-size:11px;opacity:.75;}
.note{font-style:italic;}
.barwrap{display:flex;align-items:center;gap:8px;margin-bottom:6px;font-size:11.5px;}
.bar{height:10px;flex:1;background:rgba(120,120,120,.15);border-radius:6px;overflow:hidden;}
.bar > span{display:block;height:100%;}
body[data-theme="winmo"] .bar>span{background:var(--winmo-blue);}
body[data-theme="dos"] .bar{border:1px solid var(--dos-dim);border-radius:0;background:transparent;}
body[data-theme="dos"] .bar>span{background:var(--dos-fg);}

/* accessibility: high contrast + font scale */
body.hc[data-theme="winmo"]{filter:contrast(1.15) saturate(1.1);}
body.hc[data-theme="winmo"] .card{border-width:2px;}
body.fs-1 .app{font-size:1.08em;}
body.fs-2 .app{font-size:1.18em;}

@media(max-width:820px){
  .tilenav{grid-template-columns:repeat(3,1fr);}
  .grid2,.grid3,.footgrid{grid-template-columns:1fr;}
}

.leader-card{text-align:center;}
.leader-photo{
  width:180px;height:220px;object-fit:cover;object-position:top center;
  border-radius:10px;margin:0 auto 10px;display:block;
}
body[data-theme="winmo"] .leader-photo{border:2px solid var(--winmo-border);box-shadow:0 3px 8px rgba(20,30,45,.12);}
body[data-theme="dos"] .leader-photo{border:1px solid var(--dos-fg);border-radius:0;}

/* watermark */
.watermark{
  position:fixed;bottom:10px;right:14px;z-index:999;
  font-size:10.5px;padding:5px 10px;border-radius:6px;
  pointer-events:none;opacity:.85;user-select:none;
}
body[data-theme="winmo"] .watermark{
  background:rgba(255,255,255,.85);color:#345;border:1px solid var(--winmo-border);
  font-family:"Segoe UI",Tahoma,sans-serif;box-shadow:0 2px 6px rgba(0,0,0,.08);
}
body[data-theme="dos"] .watermark{
  background:#000;color:var(--dos-fg);border:1px solid var(--dos-fg);
  font-family:"Consolas","Courier New",monospace;border-radius:0;
}
body[data-theme="dos"] .watermark::before{content:"// ";color:var(--dos-dim);}
@media(max-width:820px){
  .watermark{font-size:9px;padding:4px 8px;bottom:6px;right:8px;}
}