:root{--bg:#f3f4f6;--surface:#fff;--surface-2:#f9fafb;--text:#111827;--text-muted:#6b7280;--border:#e5e7eb;--primary:#2563eb;--primary-text:#fff;--danger:#dc2626;--success:#16a34a;--radius:14px;--nav-height:64px;--max-width:560px}[data-theme=dark]{--bg:#0f172a;--surface:#1e293b;--surface-2:#273449;--text:#f1f5f9;--text-muted:#94a3b8;--border:#334155;--primary:#3b82f6;--danger:#ef4444;--success:#22c55e}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}h1{margin:0;font-size:1.5rem}h2{margin:0;font-size:1.15rem}.app-shell{max-width:var(--max-width);min-height:100%;margin:0 auto;position:relative}.app-content{padding:16px 16px calc(var(--nav-height) + 24px)}.center-screen{height:100vh;color:var(--text-muted);place-items:center;display:grid}.page{flex-direction:column;gap:16px;display:flex}.page__header{padding-top:8px}.page__header--center{text-align:center}.page__header--row{justify-content:space-between;align-items:center;display:flex}.page__subtitle{color:var(--text-muted);margin:4px 0 0;font-size:.9rem}.section-title{margin-top:8px}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:16px}.card__title{text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);margin:0 0 8px;font-size:.85rem}.card__row{align-items:center;gap:8px;display:flex}.card__meta{color:var(--text-muted);margin:4px 0 0;font-size:.9rem}.card__note{margin:8px 0 0;font-style:italic}.dot{border-radius:50%;flex-shrink:0;width:12px;height:12px;display:inline-block}.status-card{border-radius:var(--radius);color:#fff;padding:20px}.status-card--free{background:linear-gradient(135deg,#16a34a,#15803d)}.status-card--busy{background:linear-gradient(135deg,#ea580c,#c2410c)}.status-card__badge{background:#ffffff40;border-radius:999px;margin-bottom:8px;padding:2px 10px;font-size:.75rem;font-weight:600;display:inline-block}.status-card p{margin:0}.nav-buttons,.shortcuts{grid-template-columns:repeat(2,1fr);gap:10px;display:grid}.shortcut{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);flex-direction:column;align-items:center;gap:6px;padding:14px 4px;text-decoration:none;display:flex}.shortcut__icon{font-size:1.5rem}.shortcut__label{font-size:.75rem}.btn{appearance:none;border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:var(--radius);cursor:pointer;text-align:center;padding:12px 16px;font-size:1rem;font-weight:600;text-decoration:none}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.6;cursor:not-allowed}.btn--primary{background:var(--primary);color:var(--primary-text);border-color:var(--primary)}.btn--danger{background:var(--danger);color:#fff;border-color:var(--danger)}.btn--block{width:100%}.btn--nav{background:var(--surface);border-color:var(--border);justify-content:center;align-items:center;gap:8px;padding:14px 12px;font-size:1rem;font-weight:500;display:flex}.btn--sm{padding:8px 12px;font-size:.85rem}.table__actions{align-items:center;gap:4px;display:flex}.icon-btn{appearance:none;background:var(--surface);border:1px solid var(--border);color:var(--text);cursor:pointer;opacity:.85;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;font-size:1.1rem;line-height:1;transition:opacity .12s,background .12s;display:inline-flex}.icon-btn--nav{width:44px;height:44px;font-size:1.25rem}.icon-btn:hover{opacity:1;background:var(--surface-2)}.icon-btn--danger{border-color:var(--danger);color:var(--danger)}.icon-btn:active{transform:scale(.92)}.form{flex-direction:column;gap:14px;display:flex}.form__field{flex-direction:column;gap:6px;display:flex}.form__field>span{color:var(--text-muted);font-size:.85rem;font-weight:600}.form input{border:1px solid var(--border);background:var(--surface-2);color:var(--text);border-radius:10px;width:100%;padding:12px;font-size:1rem}.form input:focus{outline:2px solid var(--primary);border-color:var(--primary)}.form__password{display:flex;position:relative}.form__toggle{cursor:pointer;background:0 0;border:none;font-size:1.1rem;position:absolute;top:50%;right:8px;transform:translateY(-50%)}.form__actions{gap:10px;display:flex}.form__actions .btn{flex:1}.form select{border:1px solid var(--border);background:var(--surface-2);color:var(--text);border-radius:10px;width:100%;padding:12px;font-size:1rem}.form__row{gap:12px;display:flex}.form__row .form__field{flex:1}.form__field--color{max-width:96px}.form__field--color input[type=color]{cursor:pointer;height:44px;padding:4px}.form__checkbox{cursor:pointer;align-items:center;gap:10px;font-size:.95rem;display:flex}.form__checkbox input{width:20px;height:20px;accent-color:var(--primary)}.form__hint{color:var(--text-muted);font-size:.8rem}.form__static{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius);align-items:center;gap:8px;padding:10px 12px;font-size:.95rem;display:flex}.form__error{color:var(--danger);margin:0;font-size:.9rem}.form__success{color:var(--success);margin:0;font-size:.9rem}.login{place-items:center;min-height:100vh;padding:20px;display:grid}.login__card{background:var(--surface);border:1px solid var(--border);border-radius:20px;width:100%;max-width:380px;padding:28px}.login__brand{text-align:center;margin-bottom:24px}.login__logo{font-size:2.5rem}.login__brand h1{margin:8px 0 2px}.login__brand p{color:var(--text-muted);margin:0;font-size:.9rem}.calendar{grid-template-columns:repeat(7,1fr);gap:4px;display:grid}.calendar__weekday{text-align:center;color:var(--text-muted);padding:4px 0;font-size:.75rem;font-weight:600}.calendar__weekday--weekend{color:var(--primary)}.calendar__cell{aspect-ratio:1;border:1px solid var(--border);background:var(--surface);color:var(--text);cursor:pointer;border-radius:10px;place-items:center;font-size:.95rem;display:grid}.calendar__cell--empty{cursor:default;background:0 0;border:none}.calendar__cell.is-weekend:not(.is-booked){background:color-mix(in srgb, var(--primary) 8%, var(--surface))}.calendar__cell.is-today{outline-offset:-2px;outline:3px dashed #f97316}.calendar__cell.is-booked{border-color:#0000;font-weight:700;position:relative;overflow:hidden}.cal-split{position:absolute;inset:0}.cal-split__day{z-index:1;color:#fff;font-weight:700;position:relative}@keyframes cell-pulse{0%,to{opacity:1}50%{opacity:.35}}.calendar__cell.is-picking{cursor:default;animation:1s ease-in-out infinite cell-pulse}.calendar__cell.is-blocked{opacity:.25;cursor:not-allowed}.calendar__cell.is-no-click{cursor:not-allowed}.pick-status{min-height:1.6rem;margin-bottom:4px}.pick-status__hint{color:var(--text-muted);text-align:center;font-size:.875rem}.pick-status__error{color:var(--danger);text-align:center;font-size:.875rem}.pick-status__cancel{color:var(--primary);cursor:pointer;background:0 0;border:none;padding:0;font-size:.875rem;text-decoration:underline}.legend{flex-wrap:wrap;gap:12px;display:flex}.legend__item{align-items:center;gap:6px;font-size:.85rem;display:flex}.modal-overlay{z-index:50;background:#00000080;place-items:end center;display:grid;position:fixed;inset:0}@media (width>=480px){.modal-overlay{place-items:center}}.modal{background:var(--surface);width:100%;max-width:var(--max-width);border-radius:20px 20px 0 0;max-height:90vh;padding:20px;overflow-y:auto}@media (width>=480px){.modal{border-radius:20px;margin:16px}}.modal__header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.modal__close{cursor:pointer;color:var(--text-muted);background:0 0;border:none;font-size:1.2rem}.detail{flex-direction:column;gap:8px;display:flex}.table-wrap{border:1px solid var(--border);border-radius:var(--radius);overflow-x:auto}.table{border-collapse:collapse;width:100%;font-size:.9rem}.table th,.table td{text-align:left;border-bottom:1px solid var(--border);padding:10px 12px}.table th{background:var(--surface-2);color:var(--text-muted);font-size:.8rem}.table tr:last-child td{border-bottom:none}.empty{color:var(--text-muted);text-align:center;padding:20px}.user-list{flex-direction:column;gap:10px;margin:0;padding:0;list-style:none;display:flex}.user-list__item{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);justify-content:space-between;align-items:flex-start;gap:12px;padding:14px;display:flex;position:relative}.user-list__item.is-inactive{opacity:.55}.user-list__item.is-active{background:color-mix(in srgb, var(--success) 10%, var(--surface));border-color:color-mix(in srgb, var(--success) 30%, var(--border))}.user-list__actions{flex-direction:column;flex-shrink:0;gap:6px;display:flex}.user-list__item--clickable{text-align:left;width:100%;font:inherit;color:inherit;cursor:pointer;align-items:center}.user-list__chevron{color:var(--text-muted);flex-shrink:0;align-self:center;font-size:1.6rem;line-height:1}.badge{background:var(--primary);color:#fff;border-radius:999px;padding:1px 8px;font-size:.7rem}.badge--muted{background:var(--text-muted)}.badge--corner{background:var(--success);color:#fff;position:absolute;top:8px;right:8px}.badge--success{background:var(--success)}.meter-reminder{border-radius:var(--radius);background:#fffbeb;border:1px solid #f59e0b;flex-direction:column;gap:12px;padding:14px;display:flex}[data-theme=dark] .meter-reminder{background:#1c1600;border-color:#d97706}.meter-reminder__header{align-items:flex-start;gap:10px;display:flex}.meter-reminder__icon{flex-shrink:0;font-size:1.5rem}.meter-reminder__header>div{flex:1}.meter-reminder__sub{color:var(--text-muted);margin:2px 0 0;font-size:.82rem}.meter-reminder__close{cursor:pointer;color:var(--text-muted);background:0 0;border:none;border-radius:4px;flex-shrink:0;padding:2px 4px;font-size:1rem;line-height:1}.meter-reminder__close:hover{color:var(--danger);background:color-mix(in srgb, var(--danger) 10%, transparent)}.pending-list{flex-direction:column;gap:6px;display:flex}.pending-item{appearance:none;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);font:inherit;color:var(--text);text-align:left;cursor:pointer;flex-direction:column;gap:2px;padding:10px 14px;font-size:.9rem;transition:background .12s;display:flex}.pending-item__date{color:var(--text-muted);font-size:.82rem;font-weight:400}.pending-item:hover{background:var(--surface-2)}.pending-item.is-selected{border-color:var(--primary);background:color-mix(in srgb, var(--primary) 8%, var(--surface));font-weight:600}.bottom-nav{width:100%;max-width:var(--max-width);height:var(--nav-height);background:var(--surface-2);z-index:40;justify-content:space-around;align-items:center;display:flex;position:fixed;bottom:0;left:50%;transform:translate(-50%);box-shadow:0 -6px 20px #00000012}.bottom-nav__item{background:var(--surface);border:1px solid var(--border);color:var(--text-muted);border-radius:14px;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:2px;margin:0 4px;padding:7px 2px;font-size:.66rem;text-decoration:none;transition:background .15s,transform .15s,border-color .15s;display:flex}.bottom-nav__item:active{transform:scale(.94)}.bottom-nav__item.is-active{background:var(--primary);border-color:var(--primary);color:#fff;font-weight:600;box-shadow:0 4px 12px #2563eb59}.bottom-nav__icon{font-size:1.2rem;line-height:1}