:root{--bg: #090f1a;--panel: #131c2b;--panel-2: #1a2536;--border: #263449;--border-strong: #35486299;--text: #f3f6f9;--text-dim: #8fa1b8;--accent-a: #3fd68b;--accent-a-bright: #5eefa7;--accent-a-dim: #1f6b46;--blue: #3fa9f5;--violet: #9b8cf8;--ball: #d9f04a;--danger: #f2555c;--success: #3fd68b;--pending: #f5a13f;--radius: 14px;--radius-lg: 20px;--shadow: 0 4px 20px rgba(0, 0, 0, .35);--shadow-lg: 0 24px 60px -18px rgba(0, 0, 0, .6);--ease-out: cubic-bezier(.16, 1, .3, 1)}*{box-sizing:border-box}html{overflow-x:hidden;scroll-behavior:smooth}body{margin:0;min-height:100vh;overflow-x:hidden;background:var(--bg);color:var(--text);font-family:Segoe UI,system-ui,-apple-system,Roboto,sans-serif;line-height:1.5;position:relative}body:before,body:after{content:"";position:fixed;border-radius:50%;filter:blur(90px);z-index:-1;pointer-events:none;opacity:.55}body:before{width:620px;height:620px;top:-220px;left:-180px;background:radial-gradient(circle,rgba(63,214,139,.4),transparent 70%);animation:drift1 20s ease-in-out infinite alternate}body:after{width:520px;height:520px;bottom:-180px;right:-140px;background:radial-gradient(circle,rgba(63,169,245,.32),transparent 70%);animation:drift2 24s ease-in-out infinite alternate}@keyframes drift1{0%{transform:translate(0) scale(1)}to{transform:translate(70px,90px) scale(1.08)}}@keyframes drift2{0%{transform:translate(0) scale(1)}to{transform:translate(-60px,-70px) scale(1.1)}}::selection{background:#3fd68b59;color:var(--text)}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--panel-2);border-radius:999px;border:2px solid var(--bg)}::-webkit-scrollbar-thumb:hover{background:var(--border-strong)}a{color:var(--accent-a);transition:color .15s ease}.container{max-width:960px;margin:0 auto;padding:1.5rem 1rem 3rem}nav.topnav{padding:.75rem 1.25rem;background:#131c2bc7;backdrop-filter:blur(14px) saturate(140%);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:40}.nav-bar{display:flex;align-items:center;justify-content:space-between}.nav-links{display:flex;align-items:center;gap:1.1rem;flex-wrap:wrap}.nav-spacer{flex:1}.nav-toggle{display:none;background:transparent;border:none;color:var(--text);padding:.4rem;cursor:pointer;border-radius:8px;transition:background .15s ease,transform .15s ease}.nav-toggle:hover{background:var(--panel-2)}.nav-toggle:active{transform:scale(.92)}nav.topnav a{color:var(--text-dim);text-decoration:none;font-size:.92rem;font-weight:500;position:relative;padding-bottom:2px}nav.topnav a:after{content:"";position:absolute;left:0;right:100%;bottom:-3px;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--accent-a),var(--blue));transition:right .2s var(--ease-out)}nav.topnav a:hover{color:var(--text)}nav.topnav a:hover:after,nav.topnav a.active:after{right:0}nav.topnav a.active{color:var(--text)}@media (max-width: 720px){.nav-toggle{display:block}.nav-spacer{display:none}.nav-links{display:none;flex-direction:column;align-items:stretch;gap:.9rem;position:absolute;top:100%;left:0;right:0;background:var(--panel);border-bottom:1px solid var(--border);box-shadow:var(--shadow-lg);padding:1rem 1.25rem 1.25rem}.nav-links.open{display:flex;animation:slideDown .22s var(--ease-out)}.nav-user{align-self:flex-start}}@keyframes slideDown{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.brand{display:flex;align-items:center;gap:.5rem;font-weight:700;font-size:1.05rem;color:var(--text)!important}.logo{width:26px;height:26px;flex-shrink:0;transition:transform .3s var(--ease-out),filter .3s ease}.brand:hover .logo{transform:rotate(-10deg) scale(1.12);filter:drop-shadow(0 0 8px rgba(63,214,139,.6))}.nav-user{color:var(--text-dim);font-size:.85rem;padding:.3rem .7rem;background:var(--panel-2);border:1px solid var(--border);border-radius:999px}.card{position:relative;background:linear-gradient(160deg,#1a2536eb,#131c2bc7);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow);backdrop-filter:blur(10px);padding:1.5rem;margin-bottom:1.25rem;animation:cardIn .5s var(--ease-out) both;transition:border-color .2s ease,box-shadow .25s ease,transform .2s ease}.card:hover{border-color:var(--border-strong);box-shadow:var(--shadow-lg)}@keyframes cardIn{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}h1,h2,h3{margin-top:0;letter-spacing:-.01em}h1{font-weight:800}.hero-title{background:linear-gradient(120deg,var(--text) 20%,var(--accent-a) 90%);-webkit-background-clip:text;background-clip:text;color:transparent;display:inline-block}button,.btn{position:relative;overflow:hidden;font-family:inherit;font-size:.95rem;border-radius:10px;border:1px solid var(--border);background:var(--panel-2);color:var(--text);padding:.6rem 1.1rem;cursor:pointer;transition:transform .15s var(--ease-out),border-color .15s ease,box-shadow .2s ease,background .15s ease;text-decoration:none;display:inline-block}button:before,.btn:before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.16) 50%,transparent 70%);transform:translate(-120%);transition:transform .6s ease}button:hover:not(:disabled):before,.btn:hover:before{transform:translate(120%)}button:hover:not(:disabled),.btn:hover{border-color:var(--accent-a);transform:translateY(-2px)}button:active:not(:disabled),.btn:active{transform:translateY(0) scale(.97)}button:disabled{opacity:.4;cursor:not-allowed;transform:none}button.primary{background:linear-gradient(180deg,#4fe89f 0%,var(--accent-a) 100%);border-color:var(--accent-a);color:#04321a;font-weight:600;box-shadow:0 2px 12px #3fd68b59}button.primary:hover:not(:disabled){box-shadow:0 6px 24px #3fd68b8c}button.danger{background:linear-gradient(180deg,#ef6267 0%,var(--danger) 100%);border-color:var(--danger);color:#340608;font-weight:600}button.danger:hover:not(:disabled){box-shadow:0 6px 24px #f2555c73}button.ghost{background:transparent}input[type=text],input[type=password],input[type=email],input[type=date],input[type=number],input[type=tel],select{font-family:inherit;font-size:.95rem;background:var(--panel-2);border:1px solid var(--border);border-radius:10px;color:var(--text);padding:.55rem .7rem;width:100%;transition:border-color .15s ease,box-shadow .15s ease}input:focus,select:focus{outline:none;border-color:var(--accent-a);box-shadow:0 0 0 3px #3fd68b2e}label{display:block;font-size:.85rem;color:var(--text-dim);margin-bottom:.3rem}.field{margin-bottom:1rem}.error-text{color:var(--danger);font-size:.9rem;animation:shake .3s ease}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-4px)}75%{transform:translate(4px)}}.muted{color:var(--text-dim)}.badge{display:inline-block;padding:.32rem .75rem;border-radius:999px;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em}.badge.free{background:linear-gradient(135deg,#4fe89f,var(--success));color:#04321a}.badge.reserved{background:linear-gradient(135deg,#f2757a,var(--danger));color:#340608}.badge.open{background:linear-gradient(135deg,#6cc2ff,var(--blue));color:#062333}.badge.full{background:linear-gradient(135deg,#f8b563,var(--pending));color:#3a2100}.badge.blocked{background:var(--text-dim);color:#0b1220}.badge.admin{background:var(--accent-a);color:#04321a}.badge.open,.badge.free{box-shadow:0 0 #3fd68b80;animation:badgePulse 2.4s ease-in-out infinite}@keyframes badgePulse{0%,to{box-shadow:0 0 #3fd68b73}50%{box-shadow:0 0 0 6px #3fd68b00}}.controls-row{display:flex;gap:.75rem;flex-wrap:wrap;margin-top:1.5rem;justify-content:center}.modal-overlay{position:fixed;inset:0;background:#040810b8;backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;z-index:50;padding:1rem;animation:overlayIn .2s ease}@keyframes overlayIn{0%{opacity:0}to{opacity:1}}.modal{background:linear-gradient(160deg,#1c283afa,#131c2bfa);border:1px solid var(--border-strong);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);padding:1.5rem;max-width:440px;width:100%;max-height:90vh;overflow-y:auto;animation:modalIn .3s var(--ease-out)}@keyframes modalIn{0%{opacity:0;transform:scale(.94) translateY(12px)}to{opacity:1;transform:scale(1) translateY(0)}}.modal-option{display:block;width:100%;text-align:left;padding:1rem 1.1rem;border-radius:var(--radius);border:1px solid var(--border);background:var(--panel-2);cursor:pointer;transition:border-color .2s ease,background .2s ease,transform .15s var(--ease-out)}.modal-option:hover:not(:disabled){border-color:var(--accent-a);background:#3fd68b14;transform:translateY(-1px)}.modal-option strong{display:block;font-size:.98rem;margin-bottom:.3rem}.modal-option span{display:block;font-size:.82rem;color:var(--text-dim)}table.data-table{width:100%;border-collapse:collapse}table.data-table th,table.data-table td{text-align:left;padding:.7rem .5rem;border-bottom:1px solid var(--border)}table.data-table th{color:var(--text-dim);font-size:.78rem;text-transform:uppercase;letter-spacing:.03em}table.data-table tbody tr{animation:rowIn .35s var(--ease-out) both;transition:background .15s ease}table.data-table tbody tr:nth-child(1){animation-delay:.02s}table.data-table tbody tr:nth-child(2){animation-delay:.05s}table.data-table tbody tr:nth-child(3){animation-delay:.08s}table.data-table tbody tr:nth-child(4){animation-delay:.11s}table.data-table tbody tr:nth-child(5){animation-delay:.14s}table.data-table tbody tr:nth-child(6){animation-delay:.17s}table.data-table tbody tr:nth-child(7){animation-delay:.2s}table.data-table tbody tr:nth-child(8){animation-delay:.23s}@keyframes rowIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}table.data-table tbody tr:hover{background:#3fd68b0f}@media (max-width: 640px){table.data-table thead{display:none}table.data-table,table.data-table tbody,table.data-table tr,table.data-table td{display:block;width:100%}table.data-table tr{border:1px solid var(--border);border-radius:var(--radius);padding:.75rem;margin-bottom:.75rem}table.data-table td{border-bottom:none;padding:.3rem 0}table.data-table td:empty{display:none}table.data-table td[data-label]:before{content:attr(data-label);display:block;font-size:.7rem;text-transform:uppercase;letter-spacing:.03em;color:var(--text-dim);margin-bottom:.2rem}table.data-table td.actions-cell{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.4rem}}.view-toggle{display:inline-flex;background:var(--panel-2);border:1px solid var(--border);border-radius:999px;padding:.25rem}.view-toggle button{border:none;background:transparent;color:var(--text-dim);font-size:.82rem;font-weight:600;padding:.45rem 1rem;border-radius:999px}.view-toggle button:before{content:none}.view-toggle button[aria-pressed=true]{background:var(--accent-a);color:#04321a}.slot-list{display:flex;flex-direction:column;gap:.6rem}.slot-list-row{display:flex;align-items:center;gap:1rem;padding:.85rem 1.1rem;border-radius:var(--radius);border:1px solid var(--border);background:var(--panel-2)}.slot-list-row .time-block{font-weight:800;font-size:1rem;width:58px;flex-shrink:0}.slot-list-row .list-meta{flex:1;min-width:0}.slot-list-row .list-meta strong{display:block;font-size:.92rem}.slot-list-row .list-meta span{font-size:.8rem;color:var(--text-dim)}.grid-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}table.avail-grid{border-collapse:separate;border-spacing:3px;width:100%;min-width:480px}table.avail-grid th,table.avail-grid td{border:1px solid var(--border);text-align:center;padding:0;border-radius:8px}table.avail-grid th{background:var(--panel-2);color:var(--text-dim);font-size:.78rem;font-weight:600;padding:.5rem .4rem;white-space:nowrap;border-radius:8px}table.avail-grid td.time-cell{background:var(--panel-2);color:var(--text-dim);font-size:.78rem;font-weight:600;padding:.4rem;white-space:nowrap}.slot-cell{width:100%;min-height:52px;border:none;border-radius:8px;padding:.35rem .3rem;font-size:.72rem;line-height:1.25;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.15rem;transition:transform .15s var(--ease-out),box-shadow .15s ease,background-color .15s ease}.slot-cell:before{content:none}.slot-cell:hover:not(:disabled){transform:scale(1.06);box-shadow:0 6px 16px -6px #0009;z-index:2;position:relative}.slot-cell:active:not(:disabled){transform:scale(.95)}.slot-cell.free{background:#3fd68b1f;color:var(--accent-a-bright)}.slot-cell.free:hover{background:#3fd68b42}.slot-cell.reserved{background:#e5484d24;color:#f2999c}.slot-cell.open_game{background:#3fa9f524;color:var(--blue)}.slot-cell.open_game:hover{background:#3fa9f547}.slot-cell.full{background:#f5a13f29;color:var(--pending)}.slot-cell.blocked{background:#91a3b814;color:var(--text-dim);cursor:default}.mine-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--ball);animation:dotPulse 1.6s ease-in-out infinite}@keyframes dotPulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.55;transform:scale(1.4)}}.legend-row{display:flex;flex-wrap:wrap;gap:.9rem;margin-top:1rem;font-size:.8rem;color:var(--text-dim);align-items:center}.legend-row .swatch{display:inline-block;width:12px;height:12px;border-radius:3px;margin-right:.35rem;vertical-align:middle}.player-list{list-style:none;padding:0;margin:.5rem 0}.player-list li{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.6rem .15rem;border-bottom:1px solid var(--border);transition:background .15s ease;border-radius:6px}.player-list li:hover{background:#ffffff08}.player-list li:last-child{border-bottom:none}.level-tag{font-size:.75rem;color:var(--text-dim);background:var(--panel-2);border:1px solid var(--border);border-radius:999px;padding:.1rem .5rem}.skeleton{position:relative;overflow:hidden;background:var(--panel-2);border-radius:8px}.skeleton:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.07),transparent);transform:translate(-100%);animation:shimmer 1.5s ease infinite}@keyframes shimmer{to{transform:translate(100%)}}.auth-card{max-width:380px;margin:2rem auto;text-align:center;position:relative}.auth-card .logo{width:56px;height:56px;margin-bottom:.75rem;animation:logoFloat 3.5s ease-in-out infinite}@keyframes logoFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}.auth-card form{text-align:left}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}body:before,body:after{display:none}}
