:root{font-family:HarmonyOS Sans,Inter,PingFang SC,Microsoft Yahei,system-ui,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.5;font-weight:400;color:#0f172a;background-color:#f8fafc;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*,*:before,*:after{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at top,#e0e7ff,#f8fafc 60%)}button,input,select,textarea{font:inherit}.calendar-grid{margin-top:32px;background:#fff;border-radius:30px;padding:28px;box-shadow:0 30px 80px #0f172a2e}.calendar-header{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;margin-bottom:12px}.calendar-header h3{margin:0;font-size:28px}.calendar-subtitle{margin:0;color:#94a3b8;text-transform:uppercase;font-size:12px;letter-spacing:.08em}.calendar-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.calendar-actions button{border:1px solid #c7d2fe;background:#f8fafc;color:#312e81;border-radius:12px;padding:8px 14px;cursor:pointer}.calendar-actions .calendar-create-desktop{border:none;background:linear-gradient(120deg,#4f46e5,#6366f1);color:#fff;box-shadow:0 10px 25px #6366f159;padding:10px 20px}.calendar-legend{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:16px}.legend{font-size:12px;padding:4px 12px;border-radius:999px}.legend.uncopied{background:#fee2e2;color:#b91c1c}.legend.copied{background:#dcfce7;color:#15803d}.legend.empty{background:#dbeafe;color:#1e3a8a}.calendar-weekdays{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));margin-bottom:6px;text-align:center;color:#94a3b8;font-size:14px}.calendar-body{display:flex;flex-direction:column;gap:12px}.calendar-row{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:12px}.calendar-cell{border-radius:16px;border:1px solid #e2e8f0;padding:12px;min-height:160px;display:flex;flex-direction:column;gap:8px}.calendar-cell.today{border-color:#6366f1;box-shadow:0 12px 30px #6366f126}.calendar-cell.past{opacity:.8}.calendar-cell header span{font-weight:600;color:#1e293b}.calendar-weekday-mobile{display:none;font-size:12px;color:#475467;font-weight:500}.cell-slots{display:flex;flex-direction:column;gap:8px}.slot-card{border-radius:16px;padding:10px 12px;border:1px solid transparent;text-align:left;background:#f8fafc;min-height:70px;display:flex;flex-direction:column;justify-content:space-between}.slot-card.reserved{cursor:pointer}.slot-card.reserved:focus-visible{outline:2px solid #4f46e5}.slot-card strong{font-size:13px}.slot-card span{font-size:13px;color:#0f172a;font-weight:600}.slot-card footer{display:flex;justify-content:space-between;font-size:12px;color:#475467}.slot-card.uncopied{background:#fee2e2;color:#b91c1c;border-color:#fecaca}.slot-card.copied{background:#ecfccb;color:#1b4332}.slot-card.available{background:#f0f9ff;color:#0c4a6e;opacity:.6;cursor:pointer}.slot-card.available.actionable{opacity:1}.slot-card.available:disabled{cursor:not-allowed}.copy-inline{border:none;background:transparent;color:inherit;text-decoration:underline;cursor:pointer;font-size:12px}.empty-cell{border:none;background:transparent}@media(max-width:900px){.calendar-actions .calendar-create-desktop{display:none}.calendar-grid{padding:18px}.calendar-body{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px}.calendar-row{display:contents}.calendar-cell{min-height:140px}.calendar-weekdays,.calendar-body .empty-cell{display:none}}@media(max-width:640px){.calendar-grid{padding:16px 14px;border-radius:20px;box-shadow:0 18px 40px #0f172a26}.calendar-header{flex-direction:column;align-items:flex-start;gap:8px}.calendar-header h3{font-size:24px}.calendar-actions{width:100%}.calendar-actions button{flex:1 1 0;padding:6px 0;font-size:12px}.calendar-legend{gap:8px}.legend{font-size:11px;padding:4px 10px}.calendar-body{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px}.calendar-cell{padding:10px;border-radius:14px;min-height:130px;gap:6px}.calendar-cell header{display:flex;align-items:center;gap:2px}.calendar-weekday-mobile{display:inline-flex}.calendar-cell.past{display:none}.cell-slots{gap:6px}.slot-card{padding:8px 10px;border-radius:12px;min-height:56px;gap:4px}.slot-card strong,.slot-card span{font-size:12px}.slot-card footer{flex-direction:column;align-items:flex-start;gap:2px}.copy-inline{font-size:11px}}.filters-bar{display:flex;flex-wrap:wrap;gap:16px;align-items:flex-end;margin-bottom:24px}.filters-bar.calendar-mode{flex-direction:column;align-items:stretch}.filters-inputs{display:flex;flex-wrap:wrap;gap:12px;align-items:center;flex:1}.filters-inputs input,.filters-inputs select{border:1px solid #e2e8f0;border-radius:14px;padding:10px 14px;font-size:14px;background:#f8fafc;transition:border-color .2s ease,box-shadow .2s ease}.filters-inputs select{width:fit-content;min-width:max-content;padding-right:28px}.filters-inputs input[type=date]{width:fit-content;min-width:160px}.filters-inputs input:focus,.filters-inputs select:focus{border-color:#6366f1;box-shadow:0 0 0 3px #6366f126;outline:none}.filters-actions{display:flex;gap:12px;flex-wrap:wrap;justify-content:flex-end}.filters-actions.calendar-actions{width:100%;justify-content:flex-end}.toggle-control{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:#475467;cursor:pointer}.toggle-control input{width:16px;height:16px;cursor:pointer;accent-color:#4f46e5}.calendar-create-mobile{display:none}.btn-secondary,.btn-primary,.btn-ghost{border-radius:12px;padding:10px 18px;font-size:14px;border:none;cursor:pointer;transition:transform .1s ease,box-shadow .1s ease}.btn-secondary{border:1px solid #c7d2fe;background:#fff;color:#4338ca}.btn-primary{background:linear-gradient(120deg,#4f46e5,#6366f1);color:#fff;box-shadow:0 10px 25px #6366f159}.btn-ghost{border:1px dashed #c7d2fe;background:transparent;color:#4338ca;box-shadow:none}.btn-primary:active,.btn-secondary:active,.btn-ghost:active{transform:scale(.97)}.btn-secondary:disabled,.btn-primary:disabled,.btn-ghost:disabled{opacity:.5;cursor:not-allowed;box-shadow:none}.room-switch{width:100%;background:#f8fafc;border-radius:20px;padding:18px;border:1px solid #e2e8f0;display:flex;flex-direction:column;gap:12px}.room-switch-header{display:flex;align-items:center;justify-content:space-between;gap:12px}.room-switch-label{margin:0;font-size:13px;color:#475467;font-weight:600;flex:1}.room-switch .room-switch-config{padding:6px 12px;border-radius:10px;font-size:13px;border-style:solid}.room-switch-buttons{display:flex;flex-wrap:wrap;gap:10px}.room-switch-buttons button{border-radius:999px;border:1px solid #e2e8f0;background:#fff;color:#475467;padding:8px 18px;cursor:pointer;font-size:14px;transition:background .2s ease,color .2s ease,border-color .2s ease,box-shadow .2s ease}.room-switch-buttons button.active{border-color:transparent;background:linear-gradient(120deg,#4f46e5,#6366f1);color:#fff;box-shadow:0 12px 30px #6366f14d}.room-switch-buttons button:focus-visible{outline:2px solid #c7d2fe;outline-offset:2px}@media(max-width:900px){.filters-actions.calendar-actions .calendar-create-mobile{display:inline-flex;align-items:center;justify-content:center}}@media(max-width:900px){.filters-bar{flex-direction:column;align-items:stretch}.filters-actions{justify-content:flex-end}}@media(max-width:640px){.filters-inputs{flex-direction:column;align-items:stretch;gap:10px}.filters-inputs input,.filters-inputs select{padding:8px 12px;font-size:13px;width:100%;min-width:0}.filters-actions{flex-direction:column;align-items:stretch;gap:8px}.toggle-control{justify-content:center}.btn-secondary,.btn-primary,.btn-ghost{width:100%;text-align:center}.config-button{display:none}}.drawer-mask{position:fixed;inset:0;background:#0f172a73;display:flex;justify-content:flex-end;z-index:30}.drawer-panel{width:min(420px,100%);background:#fff;height:100%;max-height:100vh;max-height:100dvh;padding:32px;border-top-left-radius:24px;border-bottom-left-radius:24px;box-shadow:-20px 0 60px #0f172a40;display:flex;flex-direction:column;overflow:hidden}.drawer-panel header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.drawer-panel header h3{margin:4px 0 0}.drawer-panel header button{border:none;background:#f1f5f9;width:36px;height:36px;border-radius:12px;font-size:16px;cursor:pointer}.drawer-form{flex:1;display:flex;flex-direction:column;gap:12px;overflow-y:auto;min-height:0;padding-bottom:16px;-webkit-overflow-scrolling:touch}.drawer-form label{font-size:13px;color:#475467;display:flex;flex-direction:column;gap:6px}.drawer-form input,.drawer-form select,.drawer-form textarea{border:1px solid #e2e8f0;border-radius:12px;padding:10px 12px;font-size:14px}.drawer-form textarea{resize:vertical}.drawer-form footer{margin-top:auto;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px}.drawer-actions{display:flex;gap:12px}.btn-outline,.btn-primary,.btn-ghost,.btn-danger{border-radius:12px;padding:10px 16px;border:none;cursor:pointer}.btn-primary{background:linear-gradient(120deg,#4f46e5,#6366f1);color:#fff;box-shadow:0 12px 30px #6366f14d}.btn-primary:disabled{opacity:.6;cursor:not-allowed}.btn-danger{border:1px solid #fecaca;background:#fee2e2;color:#b91c1c}.btn-danger:disabled{opacity:.6;cursor:not-allowed}.form-error{color:#dc2626;font-size:13px}.conflict-alert{border:1px solid #fee2e2;border-radius:12px;background:#fff5f5;padding:12px 16px;font-size:13px;color:#b91c1c}.conflict-alert p{margin:0 0 6px;font-weight:600}.conflict-alert ul{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:4px}.conflict-alert li{list-style:disc}.conflict-alert strong{display:block}.conflict-alert span,.conflict-alert small{display:block;color:#7f1d1d}@media(max-width:720px){.drawer-panel{border-radius:0}}.drawer-copy-banner{border:1px solid #e2e8f0;border-radius:16px;padding:16px;display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:12px;background:#f8fafc}.drawer-copy-banner p{margin:0;font-size:14px;color:#475467}.drawer-copy-banner small{color:#94a3b8}.period-selector{display:flex;flex-direction:column;gap:8px;font-size:13px;color:#475467}.period-selector p{margin:0}.period-options{display:flex;gap:12px;flex-wrap:wrap}.period-chip{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;border-radius:999px;border:1px dashed #c7d2fe;color:#475467;cursor:pointer;background:#fff;-webkit-user-select:none;user-select:none}.period-chip input{position:absolute;opacity:0;pointer-events:none}.period-chip.selected{background:#eef2ff;border-color:#6366f1;color:#312e81}.period-hint{font-size:12px;color:#94a3b8}.copy-status{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:999px;font-size:12px;font-weight:600}.copy-status .dot{width:8px;height:8px;border-radius:50%;background:currentColor}.copy-status.uncopied{background:#fee2e2;color:#b91c1c}.copy-status.copied{background:#dcfce7;color:#15803d}.reservation-table{background:#fff;border-radius:24px;padding:clamp(16px,3vw,24px);box-shadow:0 25px 60px #0f172a26}table{width:100%;border-collapse:collapse}thead th{text-align:left;font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:#94a3b8;padding-bottom:12px}tbody td{border-top:1px solid #eef2ff;padding:16px 10px;vertical-align:top}.slot{font-weight:600;color:#0f172a}.subtle{font-size:12px;color:#94a3b8;margin-top:4px}.actions{display:flex;flex-wrap:wrap;gap:8px}.btn-primary,.btn-outline,.btn-text,.btn-ghost{border-radius:12px;padding:8px 14px;font-size:13px;border:none;cursor:pointer}.btn-outline{border:1px solid #c7d2fe;background:transparent;color:#4338ca}.btn-text{background:transparent;color:#ef4444}.btn-ghost{border:1px dashed #c7d2fe;background:transparent;color:#4338ca}.reservation-cards{display:none}.table-state{background:#fff;border-radius:18px;padding:40px;text-align:center;color:#475467;box-shadow:0 25px 60px #0f172a14}@media(max-width:960px){table,thead,tbody,th,td,tr{display:none}.reservation-cards{display:grid;gap:14px}.reservation-cards article{border:1px solid #e2e8f0;border-radius:16px;padding:14px;display:flex;flex-direction:column;gap:10px}.reservation-cards header{display:flex;justify-content:space-between;align-items:flex-start;gap:6px}.reservation-cards header strong{font-size:16px;display:block}.reservation-cards header p{margin:2px 0 0;font-size:13px}.reservation-cards dl{margin:0;display:grid;gap:6px}.reservation-cards dt{font-size:12px;color:#94a3b8}.reservation-cards dd{margin:0;font-weight:600}.reservation-cards footer{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:6px}.reservation-cards footer button{width:100%;display:inline-flex;align-items:center;justify-content:center}}@media(max-width:600px){.reservation-table{border-radius:18px;box-shadow:0 18px 40px #0f172a1f}.reservation-cards article{padding:12px;gap:8px}.reservation-cards header strong{font-size:15px}.reservation-cards footer{grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:4px}.reservation-cards footer button{font-size:12px;padding:8px 10px;display:inline-flex;align-items:center;justify-content:center}}.connection-indicator{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;font-size:13px;background:#0f172a0a;border:1px solid rgba(148,163,184,.5);color:#0f172a}.connection-indicator .status-dot{width:8px;height:8px;border-radius:50%;background:currentColor}.connection-indicator.online{color:#16a34a;border-color:#16a34a66;background:#16a34a14}.connection-indicator.offline{color:#dc2626;border-color:#dc262666;background:#dc262614}.connection-indicator.checking{color:#0f172a}.connection-indicator.mock{color:#7c3aed;border-color:#7c3aed66;background:#7c3aed14}.connection-indicator .retry-btn{border:none;background:transparent;color:inherit;cursor:pointer;text-decoration:underline;padding:0;font-size:12px}.room-settings-mask{position:fixed;inset:0;background:#0f172a73;display:flex;justify-content:flex-end;z-index:40}.room-settings-panel{width:min(480px,100%);background:#fff;height:100%;padding:32px;border-top-left-radius:24px;border-bottom-left-radius:24px;box-shadow:-20px 0 60px #0f172a40;display:flex;flex-direction:column;gap:16px}.room-settings-panel header{display:flex;justify-content:space-between;align-items:center}.room-settings-panel header h3{margin:4px 0 0}.room-settings-panel header button{border:none;background:#f1f5f9;width:36px;height:36px;border-radius:12px;font-size:16px;cursor:pointer}.room-settings-form{display:flex;flex-direction:column;gap:16px;flex:1;overflow:hidden}.room-settings-tip{margin:0;font-size:13px;color:#64748b}.room-settings-list{display:flex;flex-direction:column;gap:16px;overflow-y:auto;padding-right:6px}.room-card{border:1px solid #e2e8f0;border-radius:18px;padding:16px;display:flex;flex-direction:column;gap:12px;background:#fafafa}.room-card-head{display:flex;justify-content:space-between;align-items:center}.room-card label{font-size:13px;color:#475467;display:flex;flex-direction:column;gap:6px}.room-card input,.room-card textarea{border:1px solid #dbeafe;border-radius:12px;padding:10px 12px;font-size:14px}.room-card textarea{resize:vertical}.room-delete{border:none;background:transparent;color:#ef4444;cursor:pointer;font-size:13px}.room-add-btn{border:1px dashed #c7d2fe;background:#f8fafc;border-radius:12px;padding:10px;font-weight:600;color:#4338ca;cursor:pointer}.room-settings-footer{margin-top:auto;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px}.room-settings-error{margin:0;color:#dc2626;font-size:13px}.room-reset-btn{border:none;background:transparent;color:#475467;text-decoration:underline;cursor:pointer;padding:0}.room-reset-btn:disabled{opacity:.5;cursor:not-allowed;text-decoration:none}.room-settings-actions{display:flex;gap:12px}@media(max-width:720px){.room-settings-panel{border-radius:0}}.toast{position:fixed;bottom:24px;right:24px;background:#10b981;color:#fff;padding:14px 22px;border-radius:999px;box-shadow:0 18px 35px #10b9814d;opacity:0;transform:translateY(20px);transition:all .3s ease;pointer-events:none;z-index:40}.toast.visible{opacity:1;transform:translateY(0)}@media(max-width:720px){.toast{left:16px;right:16px;border-radius:16px;text-align:center}}.view-toggle{display:inline-flex;border-radius:16px;background:#eceefe;padding:4px;gap:4px}.view-toggle button{border:none;border-radius:12px;padding:8px 18px;font-size:14px;color:#4c51bf;background:transparent;cursor:pointer;transition:background .2s ease,color .2s ease,box-shadow .2s ease}.view-toggle button.active{background:#fff;color:#1f1f3a;box-shadow:0 10px 20px #5d58ff40}.app-shell{min-height:100vh;background:radial-gradient(circle at top,#e0e7ff,#f8fafc 55%);padding:clamp(20px,4vw,48px)}.app-container{max-width:1200px;margin:0 auto;display:flex;flex-direction:column;gap:20px}.app-header{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:16px}.app-header-title{justify-self:flex-start}.app-header-indicator{justify-self:center}.app-header-actions{display:flex;align-items:center;justify-content:flex-end;gap:12px;flex-wrap:wrap}.app-header h1{margin:0;font-size:clamp(26px,3vw,34px);color:#0f172a;text-align:left}.room-config-btn{border:1px solid #c7d2fe;background:#fff;color:#4338ca;padding:8px 16px;border-radius:14px;font-weight:600;cursor:pointer;box-shadow:0 10px 25px #4338ca26;transition:box-shadow .2s ease,transform .2s ease}.room-config-btn:hover:enabled{box-shadow:0 12px 30px #4f46e540;transform:translateY(-1px)}.room-config-btn:disabled{opacity:.6;cursor:not-allowed;box-shadow:none}.error-banner{padding:12px 16px;border-radius:16px;border:1px solid #fecaca;background:#fef2f2;color:#991b1b}@media(max-width:640px){.app-header{grid-template-columns:1fr;text-align:center}.app-header-title,.app-header-indicator,.app-header-actions{justify-self:center}.app-header-title{display:none}.app-header h1{text-align:center}.app-header-actions{justify-content:center}.app-header-indicator{display:none}}