@import url('https://fonts.googleapis.com/css2?family=Rajdhani:wght@400;500;600;700&family=Zen+Dots&display=swap');
*{box-sizing:border-box}
:root{--bg:#090a0d;--panel:#111318;--panel2:#17191e;--line:#3b2818;--orange:#ff7a00;--orange2:#ff9d24;--red:#d83232;--blue:#2b7fff;--green:#16a765;--yellow:#f2a900;--text:#f3f3f3;--muted:#9ea3aa}
html,body{margin:0;min-height:100%;font-family:'Rajdhani',system-ui,sans-serif;background:radial-gradient(circle at 75% 0,#251305 0,#0b0c0f 38%,#07080a 100%);color:var(--text);letter-spacing:.15px}
body{overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.06;background-image:repeating-linear-gradient(135deg,#fff 0 1px,transparent 1px 9px);z-index:0}
.app-shell,.page-shell,.sidebar,.mobile-topbar,.mobile-bottom-nav{position:relative;z-index:1}
.sidebar{position:fixed;inset:0 auto 0 0;width:255px;background:linear-gradient(180deg,#090a0d,#111318 55%,#0a0b0d);border-right:1px solid #6a3408;color:#fff;z-index:1000;display:flex;flex-direction:column;padding:16px 12px;transition:width .2s ease,transform .2s ease;box-shadow:8px 0 30px #0008}
.sidebar:after{content:"";position:absolute;inset:auto 0 70px 0;height:180px;background:radial-gradient(circle at 20% 50%,#ff760015,transparent 55%);pointer-events:none}
.sidebar-brand{display:flex;align-items:center;gap:10px;padding:3px 9px 18px;border-bottom:1px solid #ff7a0038}.sidebar-brand .brand-icon{font-size:32px}.sidebar-brand strong{font-family:'Zen Dots',sans-serif;color:var(--orange);font-size:22px;display:block;line-height:21px;letter-spacing:1px}.sidebar-brand small{font-size:9px;letter-spacing:2px;color:#c9c0b5}
.sidebar-section{font-size:10px;color:#ff9d24;margin:15px 9px 9px;font-weight:700;letter-spacing:1px}
.side-nav{display:flex;flex-direction:column;gap:3px;overflow:auto}.side-nav a{display:flex;align-items:center;gap:13px;padding:11px 12px;color:#d9d9d9;text-decoration:none;border-radius:7px;font-size:15px}.side-nav a span{width:22px;text-align:center;font-size:20px;color:#d9a15f}.side-nav a:hover,.side-nav a.active{background:linear-gradient(90deg,#7e3500,#bc5100);box-shadow:inset 3px 0 #ff9d24;color:#fff}.side-nav a.active span{color:#fff}.nav-label{font-size:10px;color:#d47b1c;margin:15px 9px 5px;letter-spacing:1px}
.sidebar-bottom{margin-top:auto}.timezone{border:1px solid #5b3418;border-radius:8px;padding:11px;color:#d7d0c7;display:flex;gap:10px;font-size:19px;background:#0d0e11}.timezone span{font-size:10px;line-height:16px}.timezone b{font-size:10px;color:#ff9d24}.logout{display:flex;gap:10px;color:#b9b9b9;text-decoration:none;padding:12px 9px 2px;font-size:13px}
.page-shell{margin-left:255px;min-height:100vh;transition:margin-left .2s ease}
.desktop-header{height:66px;background:#0b0c0fdd;border-bottom:1px solid #6a3408;display:flex;align-items:center;justify-content:space-between;padding:0 25px;position:sticky;top:0;z-index:20;backdrop-filter:blur(10px)}
.desktop-title{display:flex;align-items:center;gap:18px;font-size:19px}.collapse-btn,.menu-btn{border:0;background:transparent;font-size:24px;cursor:pointer;color:var(--orange)}.header-right{display:flex;align-items:center;gap:22px}.header-clock{font-variant-numeric:tabular-nums;color:#ff9d24}.header-user{display:flex;align-items:center;gap:9px}.header-user small{display:block;color:#858b94;font-size:10px}.avatar{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#22170e;border:1px solid #9b4c09;color:#ff9d24}
.mobile-topbar,.mobile-bottom-nav{display:none}
.container{max-width:1550px;margin:auto;padding:22px}.dash-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.dash-head h1{margin:2px 0;font-size:32px;font-weight:700}.dash-head p{margin:0;color:var(--muted)}.eyebrow{font-size:11px;letter-spacing:1.8px;color:var(--orange);font-weight:700}
.head-clock{display:flex;gap:12px;align-items:center;background:#101216;border:1px solid #4e2d15;border-radius:9px;padding:10px 16px}.head-clock>span{font-size:30px;color:var(--orange)}.head-clock strong{display:block;font-size:17px}.head-clock small{display:block;color:#718096}
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:16px}.stat-card{border:1px solid #4c2b15;border-radius:10px;background:linear-gradient(145deg,#16181d,#0d0f12);padding:18px;display:flex;gap:16px;align-items:center;box-shadow:0 6px 20px #0007;position:relative;overflow:hidden}.stat-card:after{content:"";position:absolute;right:-35px;top:-35px;width:100px;height:100px;border-radius:50%;border:1px solid #ff7a001c}.stat-card .stat-icon{width:55px;height:55px;border-radius:9px;display:grid;place-items:center;font-size:27px;color:#fff;box-shadow:0 0 18px #0006}.stat-card span{display:block;font-size:11px;font-weight:700;letter-spacing:.8px;color:#b4b4b4}.stat-card b{display:block;font-size:31px;line-height:36px;color:#fff}.stat-card small{color:#858b94}.blue-bg .stat-icon{background:#1e64c8}.green-bg .stat-icon{background:#0b8b55}.orange-bg .stat-icon{background:#d96d00}.red-bg .stat-icon{background:#b92727}
.main-grid,.bottom-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:14px;margin-bottom:14px}.bottom-grid{grid-template-columns:1fr 1.2fr}.panel{background:linear-gradient(145deg,#13151a,#0e1013);border:1px solid #4a2a14;border-radius:10px;padding:17px;box-shadow:0 7px 25px #0008}.panel-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;border-bottom:1px solid #3d291b;padding-bottom:11px}.panel-head h2{font-size:16px;margin:0;color:#f2f2f2}.panel-head h2 small{font-size:10px;color:#cf7622}.panel-head a{border:1px solid #b85c0b;color:#ff9d24;padding:7px 12px;border-radius:6px;text-decoration:none;font-size:11px}.tablewrap{overflow:auto}table{width:100%;border-collapse:collapse}th,td{padding:11px 9px;border-bottom:1px solid #272a2f;text-align:left;font-size:13px;white-space:nowrap}th{font-size:10px;color:#a8a8a8;letter-spacing:.6px}td a{color:#ffad54;text-decoration:none;font-weight:650}.pill{display:inline-block;border-radius:5px;padding:5px 9px;font-size:10px;font-weight:800;color:#fff}.pill.blue,.dot.blue,.quick.blue{background:#1e68dc}.pill.yellow,.dot.yellow,.quick.orange{background:#e09200}.pill.red,.dot.red,.quick.red{background:#d93636}.pill.green,.dot.green{background:#119b60}.pill.purple,.quick.purple{background:#6845c2}.legend{display:flex;gap:20px;flex-wrap:wrap;margin-top:14px;padding:10px;background:#0a0b0d;border-radius:7px;font-size:11px;color:#aeb1b5}.dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:5px}.quick-new{display:block;background:linear-gradient(90deg,#8e3b00,#ce6100);color:#fff;text-decoration:none;text-align:center;border-radius:7px;padding:13px;font-weight:800;margin-bottom:13px;border:1px solid #f07a12}.quick-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.quick{min-height:90px;border-radius:8px;color:#fff;padding:13px;display:flex;flex-direction:column;justify-content:center;align-items:center;border:1px solid #ffffff1c}.quick b{font-size:25px}.quick span{font-size:12px;font-weight:800}.quick.dark{background:#30343d}.secondary-quick{background:#191c21;color:#ff9d24;border:1px solid #613715}
.tag-bars{display:grid;gap:14px}.bar-row{display:grid;grid-template-columns:75px 1fr 30px;gap:10px;align-items:center}.bar{height:9px;background:#25282d;border-radius:99px;overflow:hidden}.bar i{height:100%;display:block;border-radius:99px}.bar i.green{background:#12a568}.bar i.yellow{background:#e8a100}.bar i.red{background:#db3838}.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.metric-grid>div{border:1px solid #49301c;border-radius:8px;padding:12px;background:#0c0e11}.metric-grid span{display:block;font-size:9px;color:#ff9d24;font-weight:800}.metric-grid b{display:block;font-size:21px;margin:5px 0}.metric-grid small{color:#7f8791}.dash-footer{padding:12px 2px;color:#777f89;font-size:11px;display:flex;justify-content:space-between}
.flash{padding:12px;border-radius:7px;margin-bottom:12px}.flash.success{background:#0b2d20;border:1px solid #176c4a}.flash.error{background:#3a1212;border:1px solid #852323}.row{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.field{margin-bottom:12px}label{display:block;font-weight:650;margin-bottom:5px;color:#d5d5d5}input,select,textarea{width:100%;padding:11px;border:1px solid #4a4e55;border-radius:7px;font:inherit;background:#0c0e11;color:#fff}textarea{min-height:90px}.btn{display:inline-block;border:1px solid #f07a12;border-radius:7px;padding:11px 15px;background:#8e3b00;color:#fff;text-decoration:none;cursor:pointer}.btn.secondary{background:#191c21;border-color:#4a4e55;color:#ddd}.btn.danger{background:#8c2020}.btn.big{font-size:1.2rem;padding:18px;width:100%;min-height:72px}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}.card{background:#13151a;border:1px solid #4a2a14;border-radius:9px;padding:16px}.timer{font-size:2rem;font-weight:800}.timeline{display:grid;gap:8px}.event{padding:12px;border-left:3px solid #ff7900;background:#0d0f12}.center{text-align:center}.muted{color:#858d97}
.sidebar-overlay{display:none}
body.sidebar-collapsed .sidebar{width:78px}.sidebar-collapsed .sidebar-brand>div:last-child,.sidebar-collapsed .sidebar-section,.sidebar-collapsed .side-nav label,.sidebar-collapsed .nav-label,.sidebar-collapsed .timezone span,.sidebar-collapsed .logout span{display:none}.sidebar-collapsed .sidebar-brand{justify-content:center}.sidebar-collapsed .side-nav a{justify-content:center}.sidebar-collapsed .timezone{justify-content:center}.sidebar-collapsed .page-shell{margin-left:78px}
.recorder-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.recorder-head h1{margin:2px 0;font-size:29px}.recorder-head p{margin:0;color:#9aa0a8}.recorder-status{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:16px}.recorder-status>div{padding:10px 12px;border-right:1px solid #35291f}.recorder-status>div:last-child{border:0}.recorder-status span,.duration-grid span{display:block;font-size:9px;font-weight:800;color:#8b929b;letter-spacing:.7px}.recorder-status strong{display:block;font-size:18px;margin-top:3px}.recorder-layout{display:grid;grid-template-columns:1.15fr .85fr;gap:16px}.record-hint{font-size:11px;color:#ff9d24}.flow{display:grid;gap:8px}.flow-row{display:grid;grid-template-columns:48px 1fr auto;align-items:center;gap:12px;padding:10px;border:1px solid #33373e;border-radius:8px;background:#0c0e11}.flow-row.is-next{border:2px solid #bd5d09;background:#1a120b;box-shadow:0 0 18px #ff790014}.flow-no{font-size:18px;font-weight:900;color:#7a8798;text-align:center}.flow-info b{display:block}.flow-info small{color:#748196}.record-btn{border:1px solid #ff9d24;border-radius:7px;background:#a74400;color:#fff;font-weight:900;padding:10px 15px;min-width:105px;cursor:pointer}.record-btn span{font-size:13px}.done-badge{font-size:10px;color:#12a568;font-weight:900}.locked{font-size:10px;color:#6e737b;font-weight:800}.recorder-note{margin-top:12px;background:#17120d;border:1px solid #4a2a14;padding:11px;border-radius:7px;font-size:11px;color:#aeb0b4}.duration-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.duration-grid>div{border:1px solid #3d3023;border-radius:8px;padding:10px}.duration-grid b{font-size:17px}.quick-action-row{display:grid;grid-template-columns:1fr 1fr;gap:9px}.panel hr{border:0;border-top:1px solid #35291f;margin:16px 0}
@media(max-width:1100px){.sidebar{width:220px}.page-shell{margin-left:220px}.stat-grid{grid-template-columns:repeat(2,1fr)}.main-grid,.bottom-grid{grid-template-columns:1fr}.metric-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){.sidebar{transform:translateX(-105%);width:270px}.sidebar.mobile-open{transform:translateX(0)}.sidebar-overlay{display:block;position:fixed;inset:0;background:#000b;z-index:999;opacity:0;pointer-events:none;transition:opacity .2s}.sidebar.mobile-open~.sidebar-overlay{opacity:1;pointer-events:auto}.page-shell{margin-left:0}.desktop-header{display:none}.mobile-topbar{height:58px;position:sticky;top:0;z-index:900;background:#090a0d;color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 14px;border-bottom:1px solid #6a3408;box-shadow:0 2px 12px #0008}.mobile-topbar .menu-btn{color:#ff8a12}.mobile-brand{text-align:center}.mobile-brand b{display:block;color:#ff7a00;font-family:'Zen Dots';font-size:16px}.mobile-brand small{display:block;font-size:8px;letter-spacing:1.3px;color:#b9b1a9}.mobile-user{font-size:18px;color:#ff9d24}.mobile-bottom-nav{position:fixed;display:grid;grid-template-columns:repeat(6,1fr);bottom:0;left:0;right:0;height:64px;background:#0b0c0f;border-top:1px solid #6a3408;z-index:950;padding-bottom:env(safe-area-inset-bottom);box-shadow:0 -3px 15px #000}.mobile-bottom-nav a{text-decoration:none;color:#7f8791;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:18px}.mobile-bottom-nav a small{font-size:8px}.container{padding:14px;padding-bottom:82px}}
@media(max-width:650px){.dash-head{align-items:flex-start;gap:10px;flex-direction:column}.dash-head h1{font-size:26px}.head-clock{display:none}.stat-grid{grid-template-columns:1fr;gap:9px}.stat-card{padding:14px}.stat-card .stat-icon{width:47px;height:47px;font-size:21px}.stat-card b{font-size:25px}.quick-grid{grid-template-columns:repeat(2,1fr)}.quick{min-height:82px}.panel{padding:13px;border-radius:8px}.panel-head h2{font-size:13px}.metric-grid{grid-template-columns:1fr}.row{grid-template-columns:1fr}.tablewrap{margin:0 -4px}.tablewrap table{min-width:620px}.dash-footer{flex-direction:column;gap:5px}.grid{grid-template-columns:1fr}.recorder-layout{grid-template-columns:1fr}.recorder-head{flex-direction:column;align-items:flex-start;gap:10px}.recorder-status{grid-template-columns:1fr}.recorder-status>div{border-right:0;border-bottom:1px solid #35291f}.recorder-status>div:last-child{border-bottom:0}.flow-row{grid-template-columns:36px 1fr}.record-form{grid-column:2}.record-btn{width:100%}.duration-grid{grid-template-columns:1fr}.quick-action-row{grid-template-columns:1fr}}
@media print{.sidebar,.desktop-header,.mobile-topbar,.mobile-bottom-nav,.no-print{display:none!important}.page-shell{margin:0}.container{max-width:none;padding:0}.panel{box-shadow:none}body{background:#fff}}

/* ===== ONKOL MOBILE UI v8 ===== */
@media (max-width:600px){
html,body{width:100%;max-width:100%;overflow-x:hidden}
.container{width:100%;max-width:100%;padding:12px 10px 86px}
.mobile-topbar{width:100%;height:58px;padding:0 12px}
.stat-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;width:100%}
.stat-card{min-width:0;width:100%;min-height:126px;padding:12px 8px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:7px}
.stat-card .stat-icon{width:42px;height:42px;font-size:19px}
.stat-card span{font-size:9px;line-height:11px;letter-spacing:.45px}
.stat-card b{font-size:24px;line-height:26px}
.stat-card small{font-size:9px;line-height:11px}
.dash-head{margin-bottom:10px}.dash-head h1{font-size:24px}.dash-head p{font-size:12px}
.panel{width:100%;min-width:0;padding:12px;margin-left:0;margin-right:0}
.main-grid,.bottom-grid{display:block!important;width:100%}
.main-grid>.panel,.bottom-grid>.panel{width:100%;margin-bottom:10px}
.panel-head{margin-bottom:10px;padding-bottom:9px}.panel-head h2{font-size:12px}
.tablewrap{width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
.quick-grid{display:grid!important;grid-template-columns:1fr!important;gap:8px!important}
.quick{width:100%;min-height:68px;padding:10px 14px;display:grid;grid-template-columns:42px 1fr 20px;align-items:center;text-align:left;border-radius:8px}
.quick:after{content:'›';font-size:27px;font-weight:300;justify-self:end}.quick b{font-size:22px;grid-column:1;grid-row:1;text-align:center}.quick span{font-size:13px;grid-column:2;grid-row:1;margin-left:7px}
.quick-action-row{display:grid!important;grid-template-columns:1fr!important;gap:8px!important}.quick-new{width:100%;margin-bottom:0;min-height:48px;display:flex;align-items:center;justify-content:center}
.tag-bars{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:7px!important}
.bar-row{display:flex!important;flex-direction:column;gap:5px;padding:9px 5px;border:1px solid #3d3023;border-radius:7px;align-items:stretch;text-align:center}.bar-row .pill{width:100%;font-size:9px}.bar{width:100%;height:6px}.bar-row>b{font-size:18px}
.metric-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px!important}.metric-grid>div{min-width:0;padding:9px;text-align:center}.metric-grid span{font-size:8px}.metric-grid b{font-size:17px}.metric-grid small{font-size:8px}
.legend{gap:8px;font-size:8px;justify-content:center;padding:8px 5px}.dash-footer{font-size:9px;text-align:center;align-items:center}
.recorder-head h1{font-size:23px}.recorder-status{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px}.recorder-status>div{padding:8px;text-align:center}.recorder-status>div:last-child{grid-column:1/-1}.recorder-layout{display:block!important}.recorder-layout>.panel{margin-bottom:10px}
.flow-row{grid-template-columns:32px 1fr!important;gap:8px;padding:9px}.flow-info b{font-size:13px}.flow-info small{font-size:10px}.record-form{grid-column:2}.record-btn{width:100%;min-height:44px}.duration-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.duration-grid>div{text-align:center;padding:8px}.duration-grid b{font-size:15px}
.mobile-bottom-nav{width:100%;grid-template-columns:repeat(6,minmax(0,1fr))}.mobile-bottom-nav a{min-width:0;font-size:16px}.mobile-bottom-nav a small{font-size:7px;white-space:nowrap}
}

/* v9 final additions */
.login-page{min-height:100vh;display:grid;place-items:center}.login-card{width:min(420px,100%);background:linear-gradient(145deg,#15171c,#0d0f12);border:1px solid #71380b;border-radius:12px;padding:28px;box-shadow:0 15px 50px #000b;text-align:center}.login-logo{font-size:50px}.login-card h1{font-family:'Zen Dots';color:#ff7a00;margin:5px}.login-card p{color:#969da6;letter-spacing:1px}.login-card .field{text-align:left}.login-btn{width:100%;font-weight:800}.setup-page{min-height:100vh;display:grid;place-items:center}
.vital-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}.vital-grid input{min-width:0}.vital-grid .btn{width:100%}.vital-grid.readonly>div{background:#0c0e11;border:1px solid #3d3023;border-radius:8px;padding:10px}.vital-grid.readonly small{display:block;color:#ff9d24;font-size:9px}.vital-grid.readonly b{font-size:18px}.report-filter .row{margin-bottom:10px}.setup-page code{color:#ff9d24}
@media(max-width:900px){.vital-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:600px){
 .vital-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .vital-grid .btn{grid-column:1/-1}
 .login-card{padding:22px 16px}
}

.inline-reset{display:inline-flex;gap:5px;align-items:center;margin-top:5px}.inline-reset input{width:145px;padding:8px;font-size:11px}.reset-btn{padding:8px 10px;font-size:10px}.password-panel{max-width:520px}.password-panel small{display:block;color:#858d97;margin-top:4px}@media(max-width:600px){.inline-reset{display:flex;width:100%}.inline-reset input{flex:1;min-width:0;width:auto}.reset-btn{width:70px}.mobile-bottom-nav{overflow-x:auto}.mobile-bottom-nav a{min-width:64px}}
.credential-card{border:1px solid #bd5d09!important;background:linear-gradient(145deg,#211307,#111318)!important}
.credential-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:12px 0}.credential-grid>div{padding:12px;background:#0a0c0f;border:1px solid #543317;border-radius:8px}.credential-grid small{display:block;color:#ff9d24;font-size:9px;letter-spacing:1px}.credential-grid strong{display:block;margin-top:4px;font-size:18px;word-break:break-all}.credential-warning{display:block;margin-top:10px;color:#c2a987}
@media(max-width:600px){.credential-grid{grid-template-columns:1fr 1fr}.credential-grid>div:nth-child(3){grid-column:1/-1}}


/* =========================================================
   ONKOL ANIME LIGHT THEMES v10
   Bright, clear and compact. Theme choice is saved per browser.
   ========================================================= */
.theme-mini{display:flex;align-items:center;gap:5px}
.theme-mini select{height:34px;border:1px solid #555;border-radius:8px;background:#15171b;color:#fff;padding:0 8px;font-family:inherit;font-weight:700;cursor:pointer}

/* KAWAII */
body.theme-kawaii{--bg:#fff5fa;--panel:#ffffff;--panel2:#fff8fc;--line:#f4bfd5;--orange:#ef4f91;--orange2:#ff76ad;--text:#3d3040;--muted:#8b7080;background:linear-gradient(135deg,#fff7fb,#eefaff 55%,#fff9df);color:var(--text)}
body.theme-kawaii:before{opacity:.035;background-image:radial-gradient(circle,#ef4f91 1px,transparent 1px);background-size:18px 18px}
body.theme-kawaii .sidebar{background:linear-gradient(180deg,#fff,#fff2f8);color:#493542;border-right:2px solid #f4bfd5;box-shadow:8px 0 25px #ef4f9122}
body.theme-kawaii .sidebar-brand{border-color:#f4bfd5}.theme-kawaii .sidebar-brand strong{color:#ef4f91}.theme-kawaii .sidebar-brand small,.theme-kawaii .sidebar-section,.theme-kawaii .nav-label{color:#c43c76}
body.theme-kawaii .side-nav a{color:#594653}.theme-kawaii .side-nav a span{color:#df6d9d}.theme-kawaii .side-nav a:hover,.theme-kawaii .side-nav a.active{background:#ffe0ed;color:#6c2447;box-shadow:inset 3px 0 #ef4f91}
body.theme-kawaii .desktop-header,body.theme-kawaii .mobile-topbar{background:#ffffffed;border-color:#f4bfd5;color:#493542}
body.theme-kawaii .head-clock,body.theme-kawaii .panel,body.theme-kawaii .stat-card{background:#ffffff;border-color:#f2c6d9;box-shadow:0 5px 18px #d86d9d18;color:#493542}
body.theme-kawaii .panel-head{border-color:#f4d8e4}.theme-kawaii th{color:#967487}.theme-kawaii td{border-color:#f3e2e9}.theme-kawaii td a,.theme-kawaii .header-clock,.theme-kawaii .eyebrow{color:#df3f83}.theme-kawaii .quick-new{background:linear-gradient(90deg,#ec4f91,#ff77ad);border-color:#ff8fba}.theme-kawaii .quick.secondary-quick{background:#fff0f6;border-color:#f1b6cf;color:#c83d78}.theme-kawaii .legend,.theme-kawaii .recorder-note,.theme-kawaii .timezone{background:#fff5fa;border-color:#f1cada;color:#765a69}.theme-kawaii .record-btn{background:#ef4f91;border-color:#ff8fba}.theme-kawaii .flow-row{background:#fffafd;border-color:#f0d5e1}.theme-kawaii .flow-row.is-next{background:#fff0f6;border-color:#ef4f91}.theme-kawaii .mobile-bottom-nav{background:#fff;border-color:#f4bfd5}.theme-kawaii .mobile-bottom-nav a{color:#a26f86}

/* CHIBI */
body.theme-chibi{--bg:#f1fbff;--panel:#ffffff;--panel2:#f8fdff;--line:#a8d9ef;--orange:#6955d9;--orange2:#8878ef;--text:#26344a;--muted:#71819a;background:linear-gradient(135deg,#eafaff,#f5efff 55%,#fff6dc);color:var(--text)}
body.theme-chibi .sidebar{background:#fff;border-right:3px solid #8b7bea;color:#30405a;box-shadow:8px 0 25px #6955d922}.theme-chibi .sidebar-brand{border-color:#d6d0fb}.theme-chibi .sidebar-brand strong{color:#6955d9}.theme-chibi .sidebar-section,.theme-chibi .nav-label{color:#6955d9}.theme-chibi .side-nav a{color:#42516a}.theme-chibi .side-nav a span{color:#7668db}.theme-chibi .side-nav a:hover,.theme-chibi .side-nav a.active{background:#eeeaff;color:#4c3bb2;box-shadow:inset 4px 0 #6955d9}
body.theme-chibi .desktop-header,body.theme-chibi .mobile-topbar{background:#ffffffef;border-color:#bdb4f5;color:#34425a}.theme-chibi .panel,.theme-chibi .stat-card{background:#fff;border:2px solid #c9c2f4;box-shadow:4px 4px 0 #dcd7fb;color:#33425a}.theme-chibi .head-clock{background:#fff;border:2px solid #c9c2f4}.theme-chibi .panel-head{border-color:#e1ddfb}.theme-chibi th{color:#71819a}.theme-chibi td{border-color:#e7e5f5}.theme-chibi td a,.theme-chibi .header-clock,.theme-chibi .eyebrow{color:#5d4acb}.theme-chibi .quick-new{background:#6955d9;border-color:#5645bc}.theme-chibi .quick.secondary-quick{background:#f0edff;color:#5846c7;border-color:#c9c2f4}.theme-chibi .legend,.theme-chibi .recorder-note,.theme-chibi .timezone{background:#f7f5ff;border-color:#d5d0f5;color:#56647b}.theme-chibi .record-btn{background:#6955d9}.theme-chibi .flow-row{background:#fbfaff;border-color:#dcd8f2}.theme-chibi .flow-row.is-next{background:#f0edff;border-color:#6955d9}.theme-chibi .mobile-bottom-nav{background:#fff;border-color:#c9c2f4}.theme-chibi .mobile-bottom-nav a{color:#6e678f}

/* RAMEN */
body.theme-ramen{--bg:#fff8ec;--panel:#fffdf7;--panel2:#fff7eb;--line:#e8c9a0;--orange:#e45d2f;--orange2:#f47d48;--text:#4a3025;--muted:#8d6f5d;background:linear-gradient(135deg,#fff7df,#fff0e5,#f4faff);color:var(--text)}
body.theme-ramen .sidebar{background:#fffaf0;border-right:3px solid #e45d2f;color:#503329}.theme-ramen .sidebar-brand{border-color:#edc6a9}.theme-ramen .sidebar-brand strong{color:#d84d26}.theme-ramen .sidebar-section,.theme-ramen .nav-label{color:#cf5b34}.theme-ramen .side-nav a{color:#65483b}.theme-ramen .side-nav a span{color:#d87954}.theme-ramen .side-nav a:hover,.theme-ramen .side-nav a.active{background:#ffe5d7;color:#83331c;box-shadow:inset 4px 0 #e45d2f}
body.theme-ramen .desktop-header,body.theme-ramen .mobile-topbar{background:#fffaf4ee;border-color:#e8c9a0;color:#4a3025}.theme-ramen .panel,.theme-ramen .stat-card,.theme-ramen .head-clock{background:#fffdf8;border-color:#e8c9a0;box-shadow:0 5px 18px #b96c3a18;color:#4a3025}.theme-ramen .panel-head{border-color:#f0dcc5}.theme-ramen th{color:#967967}.theme-ramen td{border-color:#f0e1d1}.theme-ramen td a,.theme-ramen .header-clock,.theme-ramen .eyebrow{color:#d9532b}.theme-ramen .quick-new{background:#e45d2f;border-color:#d84d26}.theme-ramen .quick.secondary-quick{background:#fff0e4;color:#c64c29;border-color:#e8c9a0}.theme-ramen .legend,.theme-ramen .recorder-note,.theme-ramen .timezone{background:#fff6e9;border-color:#e8c9a0;color:#735747}.theme-ramen .record-btn{background:#e45d2f}.theme-ramen .flow-row{background:#fffaf3;border-color:#ead9c7}.theme-ramen .flow-row.is-next{background:#ffeadf;border-color:#e45d2f}.theme-ramen .mobile-bottom-nav{background:#fffaf2;border-color:#e8c9a0}.theme-ramen .mobile-bottom-nav a{color:#8b6959}

/* SKY POP */
body.theme-sky{--bg:#effaff;--panel:#ffffff;--panel2:#f4fcff;--line:#a9dfee;--orange:#1396c7;--orange2:#32b9e6;--text:#234052;--muted:#6b8796;background:linear-gradient(135deg,#e8fbff,#f7ffff 50%,#eef4ff);color:var(--text)}
body.theme-sky .sidebar{background:linear-gradient(180deg,#fff,#eefaff);border-right:3px solid #32b9e6;color:#284556}.theme-sky .sidebar-brand{border-color:#bce7f3}.theme-sky .sidebar-brand strong{color:#1192c4}.theme-sky .sidebar-section,.theme-sky .nav-label{color:#138ebc}.theme-sky .side-nav a{color:#456170}.theme-sky .side-nav a span{color:#3ba5c8}.theme-sky .side-nav a:hover,.theme-sky .side-nav a.active{background:#dff7ff;color:#17647e;box-shadow:inset 4px 0 #1396c7}
body.theme-sky .desktop-header,body.theme-sky .mobile-topbar{background:#ffffffed;border-color:#a9dfee;color:#234052}.theme-sky .panel,.theme-sky .stat-card,.theme-sky .head-clock{background:#fff;border-color:#b8e4ef;box-shadow:0 5px 18px #3aa7c718;color:#234052}.theme-sky .panel-head{border-color:#d9eff5}.theme-sky th{color:#6b8796}.theme-sky td{border-color:#e0f0f4}.theme-sky td a,.theme-sky .header-clock,.theme-sky .eyebrow{color:#1189b8}.theme-sky .quick-new{background:#1396c7;border-color:#0c7fa9}.theme-sky .quick.secondary-quick{background:#e9f9ff;color:#117ba3;border-color:#b8e4ef}.theme-sky .legend,.theme-sky .recorder-note,.theme-sky .timezone{background:#f0fbff;border-color:#b8e4ef;color:#527281}.theme-sky .record-btn{background:#1396c7}.theme-sky .flow-row{background:#fbfeff;border-color:#cce9f1}.theme-sky .flow-row.is-next{background:#e8f9ff;border-color:#1396c7}.theme-sky .mobile-bottom-nav{background:#fff;border-color:#a9dfee}.theme-sky .mobile-bottom-nav a{color:#668797}

/* Common light-theme readability / compactness */
body.theme-kawaii .stat-card b,body.theme-chibi .stat-card b,body.theme-ramen .stat-card b,body.theme-sky .stat-card b{color:var(--text)}
body.theme-kawaii .theme-mini select,body.theme-chibi .theme-mini select,body.theme-ramen .theme-mini select,body.theme-sky .theme-mini select{background:#fff;color:var(--text);border-color:var(--line)}
body.theme-kawaii .stat-card,body.theme-chibi .stat-card,body.theme-ramen .stat-card,body.theme-sky .stat-card{padding:14px}
body.theme-kawaii .panel,body.theme-chibi .panel,body.theme-ramen .panel,body.theme-sky .panel{padding:14px}
@media(max-width:900px){.theme-mini select{max-width:125px;height:32px;font-size:11px}.theme-mini span{font-size:14px}}
@media(max-width:600px){.theme-mini select{max-width:112px}.theme-mini span{display:none}.stat-card{min-height:112px!important}}
