*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg:#0f172a;--surface:#1e293b;--surface-2:#273549;--primary:#93b4ff;--primary-dk:#60a5fa;--free:#4ade80;--free-bg:#4ade8026;--taken:#f87171;--taken-bg:#f8717126;--partial:#fbbf24;--partial-bg:#fbbf2426;--mine:#c084fc;--mine-bg:#c084fc26;--text:#f1f5f9;--text-2:#94a3b8;--text-3:#64748b;--border:#334155;--radius:14px;--shadow-sm:0 1px 2px #0006, 0 1px 3px #0000004d;--shadow-xl:0 20px 48px #0009;--transition:.15s ease}html,body{height:100%;overflow:hidden}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;overscroll-behavior:none;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}button{cursor:pointer;font-family:inherit}#app{flex-direction:column;max-width:480px;height:100svh;margin:0 auto;display:flex;position:relative;overflow:hidden}.auth-modal-overlay{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:300;opacity:0;pointer-events:none;background:#000c;justify-content:center;align-items:center;transition:opacity .3s;display:flex;position:fixed;inset:0}.auth-modal-overlay.visible{opacity:1;pointer-events:all}.auth-modal-content{flex-direction:column;justify-content:center;align-items:center;gap:28px;width:100%;max-width:480px;padding:40px 32px;display:flex}.login-logo{object-fit:contain;filter:drop-shadow(0 4px 16px #0006);border-radius:20px;width:96px;height:96px}.login-copy{text-align:center}.login-copy h1{letter-spacing:-.04em;margin-bottom:8px;font-size:2rem;font-weight:800}.login-copy p{color:var(--text-2);font-size:.95rem;line-height:1.5}.btn-google{background:var(--surface);border:1.5px solid var(--border);color:var(--text);width:100%;max-width:300px;box-shadow:var(--shadow-sm);transition:border-color var(--transition), box-shadow var(--transition), transform var(--transition);border-radius:12px;justify-content:center;align-items:center;gap:10px;padding:13px 24px;font-size:.95rem;font-weight:600;display:flex}.btn-google:hover{border-color:var(--primary);box-shadow:0 0 0 3px #60a5fa26}.btn-google:active{transform:scale(.97)}.login-note{color:var(--text-3);margin-top:-8px;font-size:.75rem}#main-screen{flex-direction:column;height:100svh;display:flex;overflow:hidden}.menu-overlay{z-index:19;position:fixed;inset:0}.header{background:var(--surface);border-bottom:1px solid var(--border);z-index:20;justify-content:space-between;align-items:center;gap:12px;padding:13px 16px;display:flex;position:sticky;top:0}.header-left{flex:1;align-items:center;gap:7px;min-width:0;display:flex}.header-title{letter-spacing:-.02em;font-size:1.05rem;font-weight:800}.header-logo{object-fit:contain;border-radius:5px;flex-shrink:0;width:40px;height:40px}.header-subtitle{color:var(--text-2);white-space:nowrap;text-overflow:ellipsis;margin-top:1px;font-size:.72rem;overflow:hidden}.header-actions{flex-shrink:0;align-items:center;gap:4px;display:flex}.icon-btn{width:36px;height:36px;color:var(--text-2);transition:background var(--transition), color var(--transition);background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;display:flex}@media (hover:hover) and (pointer:fine){.icon-btn:hover{background:var(--surface-2);color:var(--text)}}.avatar-wrap{position:relative}.user-avatar{background:var(--primary);width:36px;height:36px;color:var(--bg);cursor:pointer;-webkit-user-select:none;user-select:none;transition:opacity var(--transition);border:none;border-radius:50%;justify-content:center;align-items:center;font-size:.85rem;font-weight:700;display:flex;overflow:hidden}.user-avatar:hover{opacity:.8}.user-avatar img{object-fit:cover;width:100%;height:100%}.user-menu{background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow-xl);z-index:50;border-radius:12px;min-width:220px;display:none;position:absolute;top:calc(100% + 8px);right:0;overflow:hidden}.user-menu.visible{display:block}.menu-profile{padding:14px 16px 10px}.menu-user-name{font-size:.875rem;font-weight:700}.menu-user-email{color:var(--text-2);word-break:break-all;margin-top:2px;font-size:.75rem}.menu-divider{border:none;border-top:1px solid var(--border)}.menu-btn{text-align:left;width:100%;color:var(--text-2);background:0 0;border:none;align-items:center;gap:8px;padding:11px 16px;font-size:.875rem;font-weight:500;display:flex}.menu-btn:hover{background:var(--surface-2)}.menu-btn-signout{text-align:left;width:100%;color:var(--taken);background:0 0;border:none;padding:11px 16px;font-size:.875rem;font-weight:600;display:block}.menu-btn-signout:hover{background:var(--taken-bg)}.last-synced{color:var(--text-3);align-items:center;gap:5px;padding:0 4px 4px;font-size:.7rem;display:flex}.ptr-touch-hint{display:none}.ptr-desktop-refresh{color:var(--primary);cursor:pointer;background:0 0;border:none;align-items:center;gap:3px;margin:0;padding:0;font-size:.7rem;line-height:1;display:inline-flex}.ptr-desktop-refresh:hover{opacity:.75}.ptr-desktop-refresh:active{opacity:.5}@media (hover:hover) and (pointer:fine){.last-synced{justify-content:space-between}}@media (hover:none) and (pointer:coarse){.ptr-touch-hint{display:inline}.ptr-desktop-refresh{display:none}}.days-list{-webkit-overflow-scrolling:touch;flex-direction:column;flex:1;gap:8px;padding:14px 12px 80px;display:flex;position:relative;overflow-y:auto}.ptr-indicator{opacity:0;background:var(--surface);border:1px solid var(--border);width:36px;height:36px;color:var(--primary);box-shadow:var(--shadow-sm);pointer-events:none;z-index:10;border-radius:50%;justify-content:center;align-items:center;display:flex;position:absolute;top:0;left:50%;transform:translateY(-100%)translate(-50%)}.ptr-spinner{animation:.7s linear infinite spin}.day-card{background:var(--surface);border-radius:var(--radius);cursor:pointer;box-shadow:var(--shadow-sm);transition:border-color var(--transition), transform var(--transition);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;border:1.5px solid #0000;outline:none;align-items:center;gap:14px;padding:14px 14px 14px 16px;display:flex}@media (hover:hover) and (pointer:fine){.day-card:hover{border-color:#60a5fa4d}.day-card:focus-visible{border-color:var(--primary);box-shadow:0 0 0 3px #60a5fa33}}.day-card:active{transform:scale(.98)}.day-card.is-past{opacity:.35;pointer-events:none}.day-card.is-today .day-num{background:var(--primary);color:var(--bg)}.day-card.is-today .day-name{color:var(--primary)}.day-card.is-weekend .day-num{color:var(--taken)}.day-card--tease{opacity:.4;pointer-events:none;cursor:default}.day-card--tease-text{color:var(--text-2);text-align:center;flex:1;font-size:.8rem;font-style:italic;font-weight:600}.day-date{flex-direction:column;align-items:center;gap:1px;min-width:42px;display:flex}.day-name{text-transform:uppercase;letter-spacing:.07em;color:var(--text-3);font-size:.62rem;font-weight:700}.day-num{border-radius:10px;justify-content:center;align-items:center;width:38px;height:38px;font-size:1.05rem;font-weight:800;display:flex}.day-month{color:var(--text-3);font-size:.6rem;font-weight:600}.day-divider{background:var(--border);flex-shrink:0;width:1px;height:38px}.day-spots{flex:1;gap:10px;display:flex}.spot-chip{flex-direction:column;flex:1;align-items:center;gap:5px;display:flex}.spot-label{text-transform:uppercase;letter-spacing:.05em;color:var(--text-3);align-items:center;gap:3px;font-size:.62rem;font-weight:700;display:flex}.spot-badge{white-space:nowrap;border-radius:20px;padding:4px 12px;font-size:.78rem;font-weight:700}.spot-badge.free{background:var(--free-bg);color:var(--free)}.spot-badge.taken{background:var(--taken-bg);color:var(--taken)}.spot-badge.mine{background:var(--mine-bg);color:var(--mine)}.spot-badge-time{color:var(--taken);font-size:.62rem;font-weight:600;line-height:1}.spot-badge-time.mine{color:var(--mine)}.spot-badge-time.free{color:var(--free)}.spot-warning-badge{color:var(--partial);text-transform:none;letter-spacing:0;font-size:.65rem;line-height:1}.spot-badge.loading{background:var(--surface-2);color:var(--text-3);animation:1.4s ease-in-out infinite pulse}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}.day-chevron{color:var(--text-3);flex-shrink:0;font-size:1.3rem;line-height:1}.loading-state{color:var(--text-2);flex-direction:column;justify-content:center;align-items:center;gap:14px;padding:64px 20px;font-size:.9rem;display:flex}.error-state .error-icon{font-size:2rem}.error-state p{text-align:center}.spinner{border:3px solid var(--border);border-top-color:var(--primary);border-radius:50%;width:30px;height:30px;animation:.7s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.overlay{z-index:100;opacity:0;pointer-events:none;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#000000a6;transition:opacity .25s;position:fixed;inset:0}.overlay.visible{opacity:1;pointer-events:all}.bottom-sheet{background:var(--surface);z-index:110;width:100%;max-width:480px;padding-bottom:env(safe-area-inset-bottom,0px);border-radius:24px 24px 0 0;outline:none;transition:transform .3s cubic-bezier(.32,.72,0,1);position:fixed;bottom:0;left:50%;transform:translate(-50%)translateY(110%);box-shadow:0 -8px 48px #00000080}.bottom-sheet.visible{transform:translate(-50%)translateY(0)}.sheet-handle-wrap{justify-content:center;padding:12px 0 8px;display:flex}.sheet-handle{background:var(--border);border-radius:2px;width:36px;height:4px}.sheet-header{border-bottom:1px solid var(--border);padding:16px 20px 14px}.sheet-date{letter-spacing:-.02em;font-size:1.15rem;font-weight:800}.sheet-body{-webkit-overflow-scrolling:touch;flex-direction:column;gap:10px;max-height:75svh;padding:14px 16px 8px;display:flex;overflow-y:auto}.spot-row{background:var(--surface-2);border-radius:12px;justify-content:space-between;align-items:flex-start;gap:12px;padding:14px 15px;display:flex}.spot-row-info{flex:1;min-width:0}.spot-row-name{font-size:1rem;font-weight:700}.spot-row-status{margin-top:3px;font-size:.8rem;font-weight:600}.spot-row-status.free{color:var(--free)}.spot-row-status.taken{color:var(--taken)}.spot-row-status.partial{color:var(--partial)}.spot-row-status.mine{color:var(--mine)}.occupied-times{color:var(--partial);margin-top:4px;font-size:.72rem;line-height:1.4}.manual-booking-notice{color:var(--partial);margin-top:6px;font-size:.72rem;font-weight:600;line-height:1.4}.booked-by{color:var(--text-3);margin-top:4px;font-size:.72rem}.btn-tooltip-wrap{display:inline-block;position:relative}.btn-tooltip-wrap[data-tooltip]:after{content:attr(data-tooltip);background:var(--surface-3);color:var(--text-1);white-space:nowrap;pointer-events:none;opacity:0;z-index:10;border-radius:8px;padding:6px 10px;font-size:.72rem;font-weight:500;line-height:1.4;transition:opacity .15s;position:absolute;bottom:calc(100% + 6px);right:0;box-shadow:0 2px 10px #00000040}.btn-tooltip-wrap[data-tooltip]:hover:after{opacity:1}.btn-book{background:var(--primary);color:var(--bg);transition:background var(--transition), transform var(--transition);border:none;border-radius:10px;flex-shrink:0;align-self:center;padding:10px 20px;font-size:.875rem;font-weight:700}.btn-book:hover:not(:disabled){background:var(--primary-dk)}.btn-book:active:not(:disabled){transform:scale(.95)}.btn-book:disabled{background:var(--border);color:var(--text-3);cursor:not-allowed}.btn-cancel{background:var(--taken-bg);color:var(--taken);transition:background var(--transition), transform var(--transition);border:none;border-radius:10px;flex-shrink:0;align-self:center;padding:10px 18px;font-size:.875rem;font-weight:700}.btn-cancel:hover{background:#f871714d}.btn-cancel:active{transform:scale(.95)}.btn-cancel:disabled{opacity:.6;cursor:not-allowed;transform:none}.btn-secondary{border:1.5px solid var(--border);color:var(--text-2);width:100%;transition:border-color var(--transition), color var(--transition);background:0 0;border-radius:10px;padding:12px;font-size:.875rem;font-weight:600}.btn-secondary:hover{border-color:var(--text-2);color:var(--text)}.sheet-cancel{margin-top:2px;margin-bottom:6px}.time-picker{background:var(--surface-2);border-radius:12px;padding:14px 15px 12px}.time-row{align-items:center;gap:10px;display:flex}.time-field{flex-direction:column;flex:1;gap:4px;display:flex}.time-field label{text-transform:uppercase;letter-spacing:.06em;color:var(--text-3);font-size:.65rem;font-weight:700}.time-field-inputs{border:1.5px solid var(--border);background:var(--surface);transition:border-color var(--transition), box-shadow var(--transition);border-radius:8px;align-items:center;gap:2px;padding-right:2px;display:flex;overflow:hidden}.time-field-inputs:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px #60a5fa33}.time-select{color:var(--text);background:var(--surface);appearance:none;cursor:pointer;text-align:center;text-align-last:center;border:none;border-radius:0;outline:none;flex:1;min-width:0;padding:9px 4px 9px 10px;font-family:inherit;font-size:1rem;font-weight:600}.time-select--min{padding-left:4px;padding-right:10px}.time-colon{color:var(--text-3);flex-shrink:0;font-size:1rem;font-weight:700;line-height:1}.time-ampm{border:none;border-left:1.5px solid var(--border);color:var(--primary);cursor:pointer;transition:background var(--transition), color var(--transition);background:#60a5fa14;border-radius:0 6px 6px 0;flex-shrink:0;padding:9px 10px;font-family:inherit;font-size:.8rem;font-weight:700}.time-ampm:hover{background:#60a5fa2e}.time-arrow{color:var(--text-3);flex-shrink:0;padding-top:18px;font-size:1.1rem}.save-default-btn{color:var(--primary);cursor:pointer;text-align:left;transition:opacity var(--transition);background:0 0;border:none;margin-top:8px;padding:0;font-size:.75rem;font-weight:600}.save-default-btn:hover{opacity:.75}.time-error{color:var(--taken);min-height:1em;margin-top:8px;font-size:.75rem;font-weight:600}.booking-notice{color:var(--partial);background:#fbbf241f;border:1px solid #fbbf2433;border-radius:10px;padding:11px 14px;font-size:.8rem;font-weight:600;line-height:1.4}.settings-form{flex-direction:column;gap:12px;display:flex}.settings-section{flex-direction:column;gap:10px;display:flex}.settings-label{text-transform:uppercase;letter-spacing:.06em;color:var(--text-2);font-size:.75rem;font-weight:700}.settings-note{color:var(--text-3);text-align:center;margin-top:-2px;font-size:.72rem;line-height:1.4}.time-format-toggle{gap:6px;display:flex}.time-format-btn{border:1.5px solid var(--border);background:var(--surface-2);color:var(--text-2);cursor:pointer;border-radius:8px;flex:1;padding:8px 4px;font-size:.85rem;font-weight:500;transition:border-color .15s,color .15s,background .15s}.time-format-btn:hover{border-color:var(--text-2);color:var(--text)}.time-format-btn.active{border-color:var(--primary);color:var(--primary);background:#60a5fa1a}.toast{background:var(--surface);color:var(--text);border:1px solid var(--border);z-index:400;text-align:center;pointer-events:none;white-space:nowrap;max-width:calc(100vw - 48px);box-shadow:var(--shadow-xl);border-radius:12px;padding:12px 20px;font-size:.875rem;font-weight:500;transition:transform .3s cubic-bezier(.32,.72,0,1);position:fixed;bottom:24px;left:50%;transform:translate(-50%)translateY(80px)}.toast.visible{transform:translate(-50%)translateY(0)}.toast.success{color:var(--free);background:#14532d;border-color:#166534}.toast.error{color:var(--taken);background:#7f1d1d;border-color:#991b1b}.rules-footer{padding:0 0 env(safe-area-inset-bottom,0px);color:var(--text-3);border-top:1px solid var(--border);flex-shrink:0;font-size:.8rem}.rules-footer-summary{width:100%;color:var(--text-3);text-align:left;transition:background var(--transition);background:0 0;border:none;border-radius:0;justify-content:space-between;align-items:center;gap:8px;padding:10px 16px;display:flex}@media (hover:hover) and (pointer:fine){.rules-footer-summary:hover{background:var(--surface-2)}}.rules-footer-summary:active{background:var(--surface-2)}.rules-footer-text{color:var(--text-2);font-weight:600;line-height:1.55}.rules-chevron{transition:transform .25s}.rules-chevron.open{transform:rotate(180deg)}.rules-footer-details{grid-template-rows:0fr;transition:grid-template-rows .25s;display:grid;overflow:hidden}.rules-footer-details.open{grid-template-rows:1fr}.rules-footer-inner{overflow:hidden}.rules-list{flex-direction:column;gap:4px;padding:0 16px 8px 32px;line-height:1.5;list-style:outside;display:flex}.rules-list li{color:var(--text-3)}.rules-footer-link{padding:8px 16px calc(14px + env(safe-area-inset-bottom,0px));color:var(--text-3);font-size:.8rem}.rules-footer-link a{color:var(--primary);text-decoration:none}.rules-footer-link a:hover{text-decoration:underline}.rules-footer a{color:var(--primary);text-decoration:none}.rules-footer a:hover{text-decoration:underline}@media (width>=480px){#app{border-left:1px solid var(--border);border-right:1px solid var(--border);box-shadow:var(--shadow-xl)}.days-list{padding-bottom:40px}}
