*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:#05080f;color:#eef4ff}
header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:#0b1120;border-bottom:1px solid #1e1e21;position:sticky;top:0;z-index:5}
header h1{font-size:18px;margin:0}main{max-width:1100px;margin:auto;padding:16px}
button,.btn{background:#c8f169;color:#0b0b0c;border:0;border-radius:8px;padding:9px 14px;font-size:14px;cursor:pointer;text-decoration:none;display:inline-block}
button.ghost{background:transparent;border:1px solid #2c3f66}button.danger{background:#d63031}button.ok{background:#00b894}button:disabled{opacity:.4;cursor:not-allowed}
input,select{background:#05080f;color:#eef4ff;border:1px solid #25385e;border-radius:8px;padding:8px;font-size:14px}
.card{background:#0b1120;border:1px solid #1e1e21;border-radius:12px;padding:14px;margin-bottom:14px}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.muted{color:#8fa6bf;font-size:13px}
.floor{position:relative;height:340px;background:repeating-linear-gradient(0deg,#08101f 0 39px,#0e1830 39px 40px),#08101f;border-radius:12px;border:1px solid #1e1e21;overflow:hidden}
.room{position:absolute;left:70%;top:40%;width:28%;height:55%;border:2px dashed #fdcb6e;border-radius:10px}.room span{position:absolute;top:4px;left:8px;color:#fdcb6e;font-size:12px}
.st{position:absolute;width:78px;padding:8px 4px;border-radius:10px;text-align:center;font-size:12px;font-weight:600;cursor:pointer;border:2px solid transparent;user-select:none;touch-action:none}
.st.PC{background:#1d4ed8}.st.PS5{background:#0a7b83}.st.Private{background:#a36a00}.st.sel{border-color:#fff;box-shadow:0 0 0 3px #c8f169}
.st small{display:block;font-weight:400;opacity:.85}.st .dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:4px}
.tl{display:grid;grid-template-columns:120px 1fr;gap:6px;align-items:center;margin-bottom:6px}.tl .name{font-size:13px;cursor:pointer}
.slots{display:flex;gap:2px;overflow-x:auto}.slot{min-width:34px;height:28px;border-radius:4px;font-size:10px;display:flex;align-items:center;justify-content:center;cursor:pointer}
.slot.free{background:#00b89455;color:#b9ffe9}.slot.booked{background:#d63031;color:#fff;cursor:not-allowed}.slot.buffer{background:#4b4f63;color:#aaa;cursor:not-allowed}
.slot.invalid{background:#2a2e44;color:#666;cursor:not-allowed}.slot.past{background:#1d2033;color:#444;cursor:not-allowed}.slot.pick{background:#c8f169;color:#0b0b0c}
.legend span{display:inline-flex;align-items:center;gap:4px;margin-right:12px;font-size:12px}.legend i{width:14px;height:14px;border-radius:3px;display:inline-block}
.modal{position:fixed;inset:0;background:#000a;display:none;align-items:center;justify-content:center;z-index:10}.modal.show{display:flex}.modal .card{width:min(420px,92vw)}
.badge{padding:2px 8px;border-radius:10px;font-size:12px;background:#25385e}.badge.confirmed{background:#00b894}.badge.checked_in{background:#0984e3}.badge.completed{background:#636e72}.badge.pending_payment{background:#e17055}.badge.cancelled,.badge.expired{background:#2d3436}
.tabs button{background:#1e1e21}.tabs button.on{background:#c8f169;color:#0b0b0c}table{width:100%;border-collapse:collapse;font-size:13px}td,th{padding:6px;border-bottom:1px solid #1e1e21;text-align:left}
.toast{position:fixed;bottom:16px;left:50%;transform:translateX(-50%);background:#2d3436;padding:10px 16px;border-radius:8px;display:none;z-index:20;max-width:90vw}
@media(max-width:600px){.st{width:58px;font-size:10px;padding:5px 2px}.tl{grid-template-columns:80px 1fr}.floor{height:300px}}
a{color:#7cc4ff}
.hero h2{margin:0 0 6px}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}.grid .card{margin:0;background:#11152a}.grid h4{margin:0 0 6px}.grid p{font-size:13px}

:root{--violet:#c8f169;--pink:#a3e635;--grad:linear-gradient(135deg,#c8f169,#b5e64f 60%,#d9f99d);--muted:#8fa6bf;--green:#2ee66b;--red:#ff4d6d;--card:#161618;--line:#1e1e21}
@keyframes draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
/* ===== widgets & charts ===== */
.widget{position:relative;overflow:hidden}.widget .wh{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;font-weight:700}
.widget .big{font-size:34px;font-weight:900;line-height:1.1}.widget .big small{font-size:14px;color:var(--muted);font-weight:600}
.ch-gauge .ch-seg{opacity:0;animation:segIn .35s ease forwards;animation-delay:calc(var(--i) * 28ms)}.ch-gauge .ch-seg.on{filter:drop-shadow(0 0 5px #a3e635aa)}
@keyframes segIn{from{opacity:0}to{opacity:1}}
.ch-big{fill:#fff;font-size:34px;font-weight:900}.ch-lbl{fill:#bfd3f0;font-size:12px}.ch-sub{fill:#86a0b8;font-size:11px}
.ch-ring{position:relative;margin:auto}.ch-ring svg{width:100%;height:100%;filter:drop-shadow(0 0 10px #c8f16966)}
.ch-ring-fill{stroke-dashoffset:var(--c);animation:ringIn 1.2s cubic-bezier(.2,.8,.2,1) forwards;transition:stroke-dashoffset 1s linear}@keyframes ringIn{to{stroke-dashoffset:var(--off)}}
.ch-ring-in{position:absolute;inset:0;display:grid;place-items:center;text-align:center}
.ch-bars{display:flex;align-items:flex-end;gap:8px;padding-top:26px}
.ch-bar{flex:1;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;position:relative;outline:none}
.ch-bar i{display:block;width:100%;max-width:28px;height:var(--h);border-radius:9px 9px 5px 5px;opacity:.55;transform-origin:bottom;animation:barUp .8s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i) * 70ms)}
.ch-bar.hl i{opacity:1;background:var(--grad)!important;box-shadow:0 0 18px #a3e63588}.ch-bar:hover i{opacity:1}
.ch-bar small{margin-top:6px;font-size:10.5px;color:var(--muted)}.ch-bar.hl small{color:#fff;font-weight:700}
.ch-tip{position:absolute;top:-4px;transform:translateY(-100%);background:#fff;color:#0f1e45;font-size:11px;font-weight:800;padding:3px 7px;border-radius:8px;white-space:nowrap;opacity:0;transition:.2s;pointer-events:none}
.ch-bar.hl .ch-tip,.ch-bar:hover .ch-tip,.ch-bar:focus .ch-tip{opacity:1}
@keyframes barUp{from{transform:scaleY(0)}}
.ch-path{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1.4s ease forwards;filter:drop-shadow(0 0 4px #a3e635)}.ch-area{opacity:0;animation:fadeIn 1s .5s forwards}@keyframes fadeIn{to{opacity:1}}
.ch-dot{fill:#fff;stroke:#a3e635;stroke-width:2;opacity:0;animation:fadeIn .3s forwards;animation-delay:calc(.6s + var(--i) * 60ms)}.ch-ax{fill:#86a0b8;font-size:9px}
.ch-strip{position:relative;height:10px;border-radius:6px;background:#2ee66b55;overflow:hidden;margin-top:10px}
.ch-strip i{position:absolute;top:0;bottom:0;animation:fadeIn .6s both}.ch-strip i.booked{background:#ff4d6d}.ch-strip i.gap{background:#ffffff33}
.ch-strip-ax{display:flex;justify-content:space-between;font-size:9.5px;color:var(--muted);margin-top:3px}
.chip-time{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:700;padding:3px 8px;border-radius:999px;background:#ffffff14;color:#ddeaff}
.live-widget{display:flex;gap:16px;align-items:center;flex-wrap:wrap;background:radial-gradient(300px 160px at 0% 0%,#c8f16944,transparent),linear-gradient(180deg,var(--card),#0a1428)}
.prog{height:12px;border-radius:9px;background:#ffffff12;overflow:hidden;margin:8px 0}.prog i{display:block;height:100%;width:var(--w);background:var(--grad);border-radius:9px;box-shadow:0 0 12px #a3e63588;animation:progIn 1s ease both;transition:width 1s linear}@keyframes progIn{from{width:0}}
.pill.late{background:#ff4d6d22;color:var(--red);animation:pulseR 1.6s infinite}@keyframes pulseR{0%{box-shadow:0 0 0 0 #ff4d6d88}70%{box-shadow:0 0 0 8px #ff4d6d00}}
.stars{color:#ffb84d;letter-spacing:2px}

.dash{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.dash .card{margin:0}
.kpi{font-size:30px;font-weight:900}.up{color:#2ee66b}.down{color:#ff4d6d}

/* ===== THEME: blue + black liquid glass (edit variables) ===== */
:root{--bg:#0b0b0c;--accent:#c8f169;--accent2:#a3e635;--text:#f2f2f3;--violet:var(--accent);--pink:var(--accent2);--grad:linear-gradient(135deg,var(--accent),var(--accent2));
  --glass:linear-gradient(145deg,color-mix(in srgb,var(--accent) 14%,#ffffff0d),#ffffff05);--glass-brd:color-mix(in srgb,var(--accent2) 26%,#ffffff1a);--blur:blur(18px) saturate(170%)}
body{background:var(--bg);color:var(--text)}
@keyframes blob{50%{transform:translate(8vw,6vh) scale(1.15)}100%{transform:translate(-6vw,10vh) scale(.92)}}
header{background:color-mix(in srgb,var(--bg) 55%,transparent);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);border-bottom:1px solid var(--glass-brd)}
.card,.grid .card{background:var(--glass);border:1px solid var(--glass-brd);box-shadow:inset 0 1px 0 #ffffff30,0 10px 30px #0008;backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur)}
button,.btn{background:var(--grad);box-shadow:0 4px 16px color-mix(in srgb,var(--accent) 40%,transparent),inset 0 1px 0 #ffffff55}
.tabs button{background:#ffffff0d;border:1px solid var(--glass-brd);box-shadow:none}.tabs button.on{background:var(--grad)}
button.ghost{background:#ffffff08;box-shadow:none}
input,select{background:#ffffff08;border-color:var(--glass-brd)}
.ch-bar:last-child .ch-tip{right:0;left:auto}.ch-bar:first-child .ch-tip{left:0}

/* ===== POLISH ===== */
:root{--ease:cubic-bezier(.22,.61,.36,1);--dur:240ms;--glow:color-mix(in srgb,var(--accent) 38%,transparent);--spot:color-mix(in srgb,var(--accent2) 16%,transparent)}
body{font-family:"Inter",system-ui,sans-serif;font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,header h1{font-family:"Sora","Inter",sans-serif;letter-spacing:-.02em}
button,input,select{font-family:inherit}
.card{border-radius:16px;padding:18px;background-image:radial-gradient(240px circle at var(--mx,-400px) var(--my,-400px),var(--spot),transparent 70%),var(--glass)}
.card,button,.btn,.tabs button,tr,.st{transition:scale var(--dur) var(--ease),translate var(--dur) var(--ease),box-shadow var(--dur) var(--ease),border-color var(--dur) var(--ease),background-color var(--dur) var(--ease)}
@media (hover:hover) and (prefers-reduced-motion:no-preference){
  .grid .card:hover,#dashw .card:hover,#threads .card:hover{scale:1.03;translate:0 -3px;border-color:color-mix(in srgb,var(--accent2) 55%,#fff2);box-shadow:inset 0 1px 0 #ffffff30,0 18px 40px #000b,0 0 60px var(--glow)}
  button:hover,.btn:hover{scale:1.05;box-shadow:0 10px 26px var(--glow),inset 0 1px 0 #ffffff55}
  tbody tr:hover,table tr:hover td{background:#ffffff08}
}
button:active,.btn:active,.card:active{scale:.97;transition-duration:90ms}
@media (hover:none){button:active,.card:active{background-color:color-mix(in srgb,var(--accent) 18%,transparent)}}
@media (prefers-reduced-motion:reduce){*{scale:none!important;translate:none!important;animation:none!important}}
:focus-visible{outline:2px solid var(--accent2);outline-offset:2px}
