:root{color-scheme:light;--canvas: #f3f5f8;--surface: #ffffff;--ink: #1c2430;--muted: #8b93a7;--line: #e7ebf0;--green: #1faf6a;--green-ink: #ffffff;--green-soft: #e9f9f0;--back: #ff4d6d;--shadow: 0 10px 30px rgba(28, 36, 48, .06);--font: "Outfit", ui-sans-serif, system-ui, sans-serif}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%}body{background:var(--canvas);color:var(--ink);font-family:var(--font);-webkit-font-smoothing:antialiased}button,a{font:inherit;color:inherit}button{cursor:pointer}.app{width:min(440px,100%);margin:0 auto;min-height:100dvh;padding-bottom:calc(92px + env(safe-area-inset-bottom))}.top{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:10px;padding:calc(14px + env(safe-area-inset-top)) 16px 12px;background:#f3f5f8e6;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.top h1{margin:0;flex:1;font-size:20px;font-weight:640;letter-spacing:-.03em}.icon-btn{width:40px;height:40px;border:0;background:transparent;color:var(--back);display:grid;place-items:center;border-radius:12px}.icon-btn:active{transform:scale(.94)}.ghost{border:1px solid var(--line);background:var(--surface);border-radius:12px;padding:8px 10px;font-size:13px;font-weight:600;box-shadow:var(--shadow)}.ghost:active{transform:scale(.97)}.stack{display:flex;flex-direction:column;gap:12px;padding:6px 16px 16px}.card{background:var(--surface);border-radius:18px;padding:16px;box-shadow:var(--shadow);animation:rise .5s cubic-bezier(.2,.8,.2,1) both}.card:nth-child(2){animation-delay:.05s}.card:nth-child(3){animation-delay:.1s}.card:nth-child(4){animation-delay:.15s}.card:nth-child(5){animation-delay:.2s}@keyframes rise{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}.game{display:grid;grid-template-columns:1fr auto;gap:8px 12px;align-items:start}.game h2{margin:0;font-size:18px;letter-spacing:-.03em}.open{color:var(--green);font-size:13px;font-weight:640;margin-top:2px}.meta{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:13px;margin-top:8px}.hours{grid-column:1 / -1;display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);margin:8px -16px -16px;padding:12px 16px 14px}.hours b{display:block;font-size:14px}.hours span{color:var(--muted);font-size:12px}.mark{width:54px;height:54px;border-radius:16px;display:grid;place-items:center;background:#f4f6f8}.book,.pay{background:var(--green);color:var(--green-ink);border:0;border-radius:10px;padding:10px 18px;font-weight:700;letter-spacing:-.02em;transition:transform .15s ease}.book:active,.pay:active{transform:scale(.96)}.book:disabled,.pay:disabled{background:#d5dbe3;color:#fff}.sheet{margin:0 16px 12px;background:#f7f8fa;border-radius:18px;padding:16px 16px 8px;position:relative}.sheet:after{content:"";position:absolute;left:0;right:0;bottom:-8px;height:8px;background:radial-gradient(circle at 10px -2px,transparent 8px,#f7f8fa 9px) left bottom / 20px 8px repeat-x}.sheet p{margin:4px 0;color:#98a0b3;font-size:13px}.sheet .link{color:var(--green);font-weight:650;background:none;border:0;padding:0}.chips,.periods{display:flex;gap:8px;overflow:auto;padding:4px 16px 8px}.chip,.period{border:1px solid #d9dee7;background:#fff;border-radius:14px;padding:10px 14px;white-space:nowrap;font-weight:600;font-size:14px}.chip.on,.period.on{border-color:var(--green);color:var(--green);background:var(--green-soft)}.period{display:flex;flex-direction:column;align-items:center;gap:6px;min-width:84px;font-size:12px;color:var(--muted)}.period.on{color:var(--green)}.bubble{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#eef2f6;font-size:16px}.period.on .bubble{background:#e5f8ee}.slots{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:8px 16px 16px}.slot{border:1px solid #e1e6ee;background:#fff;border-radius:12px;min-height:46px;display:flex;align-items:center;justify-content:center;gap:6px;font-size:13px;font-weight:620;color:#5d6778;transition:border-color .15s ease,transform .15s ease,color .15s ease}.slot i{width:14px;height:14px;border:1.5px solid #c5ceda;border-radius:50%}.slot.on{border-color:var(--green);color:var(--green);transform:translateY(-1px)}.slot.on i{border-color:var(--green);background:radial-gradient(circle,var(--green) 45%,transparent 50%)}.slot:disabled{color:#c5ceda;background:#f7f8fa}.dock{position:fixed;left:50%;bottom:0;transform:translate(-50%);width:min(440px,100%);background:#fffffff0;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-top:1px solid var(--line);padding:12px 16px calc(12px + env(safe-area-inset-bottom));display:flex;align-items:center;justify-content:space-between;gap:12px}.check{display:flex;gap:8px;align-items:flex-start;font-size:13px;color:#4b5568}.check input{accent-color:var(--green);margin-top:2px}.empty{text-align:center;padding:72px 28px;animation:rise .6s ease both}.empty svg{width:180px;height:140px}.empty h2{margin:18px 0 6px;font-size:18px;font-weight:640}.empty p{margin:0;color:var(--muted)}.tabs{display:flex;gap:8px;padding:0 16px 12px}.tabs button{border:0;background:#fff;border-radius:999px;padding:8px 14px;font-weight:650;box-shadow:var(--shadow)}.tabs button.on{background:var(--green);color:#fff}.field{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--muted);margin-bottom:10px}.field input,.field select{border:1px solid var(--line);border-radius:12px;padding:12px;font:inherit;color:var(--ink);background:#fff}.err{margin:0 16px 8px;color:#c2410c;font-size:13px}.spin{width:28px;height:28px;border:2px solid var(--line);border-top-color:var(--green);border-radius:50%;animation:spin .7s linear infinite;margin:40vh auto}@keyframes spin{to{transform:rotate(360deg)}}
