*,:before,:after{box-sizing:border-box}:root{--font-family:Inter, system-ui, Arial, sans-serif;--bg:#020617;--bg-deep:#0f172a;--text:#f8fafc;--border:#1e293b;--muted:#94a3b8;--subtle:#cbd5e1;--cyan:#38bdf8;--cyan-dark:#082f49;--green:#bbf7d0;--green-dark:#14532d;--red:#fecaca;--red-dark:#7f1d1d;--purple:#ddd6fe;--purple-dark:#4c1d95}body{font-family:var(--font-family);background:var(--bg);color:var(--text);margin:0}button,input,textarea,select{font:inherit}button{-webkit-tap-highlight-color:transparent}.app{background:linear-gradient(to bottom right,#020617,#0f172a);min-height:100vh;padding:24px}.panel{background:#0f172af2;border:1px solid #1e293b;border-radius:24px;box-shadow:0 20px 40px #00000059}.topbar{justify-content:space-between;align-items:center;gap:24px;margin-bottom:24px;padding:24px;display:flex}.topbar-left{align-items:center;gap:16px;display:flex}.topbar-left h1{margin:0;font-size:2.2rem}.icon-box{background:#1e293b;border-radius:20px;justify-content:center;align-items:center;width:70px;height:70px;display:flex}.clock-box{text-align:right}.clock-main{font-size:4rem;font-weight:800;line-height:1}.layout{grid-template-columns:360px 1fr;gap:24px;display:grid}.left-column{padding:20px}.right-column{flex-direction:column;gap:24px;display:flex}.status-box{border:1px solid #0000;border-radius:20px;justify-content:space-between;align-items:center;gap:20px;margin-bottom:20px;padding:24px;display:flex}.status-box.disponible{background:#064e3b59;border-color:#065f46}.status-box.ocupado{background:#7f1d1d59;border-color:#991b1b}.label{text-transform:uppercase;letter-spacing:.18em;color:#94a3b8;font-size:.75rem}.status-title{margin-top:8px;font-size:2rem;font-weight:800}.status-detail{color:#cbd5e1;margin-top:10px}.subpanel{background:#02061773;border:1px solid #1e293b;border-radius:20px;margin-bottom:16px;padding:16px}.subpanel-title,.section-title{align-items:center;gap:8px;margin-bottom:14px;font-weight:700;display:flex}.note-item{color:#cbd5e1;background:#1e293bb3;border-radius:14px;margin-bottom:10px;padding:10px 12px;font-size:.95rem}.controls-grid{grid-template-columns:1fr 1fr;gap:10px;display:grid}.control-item{color:#cbd5e1;background:#1e293bb3;border-radius:14px;align-items:center;gap:8px;padding:12px;display:flex}.control-item.full{grid-column:1/-1}.right-column .panel{padding:20px}.week-grid{grid-template-columns:repeat(7,1fr);gap:12px;display:grid}.day-card{color:#f8fafc;text-align:left;cursor:pointer;background:#0206178c;border:1px solid #1e293b;border-radius:20px;min-height:130px;padding:16px}.day-card.selected{color:#0f172a;background:#e2e8f0;border-color:#e2e8f0}.day-top{justify-content:space-between;gap:8px;margin-bottom:12px;display:flex}.day-number{font-size:2rem;font-weight:800}.day-meta{opacity:.85;margin-top:12px;font-size:.8rem}.today-badge{color:#0f172a;background:#cbd5e1;border-radius:999px;padding:4px 8px;font-size:.75rem}.events-list{flex-direction:column;gap:12px;display:flex}.event-row{background:#02061773;border:1px solid #1e293b;border-radius:20px;justify-content:space-between;align-items:center;gap:16px;padding:16px;display:flex}.event-row.active{color:#0f172a;background:#e2e8f0;border-color:#e2e8f0}.event-main{align-items:center;gap:18px;display:flex}.event-time{white-space:nowrap;font-size:1.15rem;font-weight:800}.event-title{font-weight:700}.event-sub{color:#94a3b8;font-size:.9rem}.event-row.active .event-sub{color:#475569}.pill{text-transform:uppercase;border-radius:999px;padding:8px 12px;font-size:.85rem;font-weight:700}.pill.disponible{color:#065f46;background:#d1fae5}.pill.ocupado{color:#991b1b;background:#fee2e2}.mini-pill{text-transform:uppercase;border-radius:999px;padding:6px 10px;font-size:.75rem;font-weight:700}.mini-pill.disponible{color:#065f46;background:#d1fae5}.mini-pill.ocupado{color:#991b1b;background:#fee2e2}.selected-box,.empty-box{background:#02061780;border:1px solid #1e293b;border-radius:18px;margin-top:20px;padding:16px}.selected-title{margin:6px 0;font-size:1.1rem;font-weight:700}.muted{color:#94a3b8}.small{font-size:.85rem}.capitalize{text-transform:capitalize}.button-stack{flex-direction:column;gap:10px;display:flex}.action-button{font:inherit;cursor:pointer;color:#082f49;background:#38bdf8;border:none;border-radius:16px;justify-content:center;align-items:center;gap:8px;min-height:52px;padding:14px 16px;font-weight:700;display:flex}.action-button.secondary{color:#14532d;background:#bbf7d0}.action-button.danger{color:#7f1d1d;background:#fecaca}.action-button.qr{color:#4c1d95;background:#ddd6fe}.action-message{color:#cbd5e1;font-size:1rem;line-height:1.5}.touch-help{color:#cbd5e1;line-height:1.5}.touch-block-grid{grid-template-columns:repeat(2,1fr);gap:14px;display:grid}.touch-block{color:#f8fafc;text-align:left;cursor:pointer;background:#02061773;border:1px solid #1e293b;border-radius:22px;flex-direction:column;gap:12px;min-height:150px;padding:18px;transition:transform .15s,border-color .15s;display:flex}.touch-block:hover{border-color:#475569;transform:translateY(-2px)}.touch-block.disponible{background:#064e3b2e}.touch-block.ocupado{background:#7f1d1d2e}.touch-block-header{justify-content:space-between;align-items:center;gap:10px;font-weight:700;display:flex}.touch-block-time{font-size:1.2rem;font-weight:800}.touch-block-title{color:#cbd5e1;line-height:1.4}.modal-overlay{z-index:1000;background:#020617b8;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.modal-card{background:#0f172a;border:1px solid #334155;border-radius:28px;width:min(560px,100%);padding:22px;box-shadow:0 30px 60px #00000073}.modal-header{justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:18px;display:flex}.modal-title{margin-top:4px;font-size:1.7rem;font-weight:800}.icon-close{color:#f8fafc;cursor:pointer;background:#1e293b;border:none;border-radius:14px;justify-content:center;align-items:center;width:42px;height:42px;display:flex}.modal-info{color:#e2e8f0;background:#02061780;border:1px solid #1e293b;border-radius:20px;flex-direction:column;gap:10px;margin-bottom:18px;padding:16px;display:flex}.modal-actions{grid-template-columns:1fr 1fr;gap:12px;display:grid}.week-title-row{flex-direction:column;gap:14px;display:flex}.week-title-left{align-items:center;gap:8px;display:flex}.week-nav{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;display:flex}.week-nav-button{color:#f8fafc;font:inherit;cursor:pointer;background:#1e293b;border:1px solid #334155;border-radius:14px;align-items:center;gap:8px;padding:10px 14px;font-weight:600;display:flex}.week-label{color:#cbd5e1;font-weight:700}.selected-day-label{color:#cbd5e1;text-transform:capitalize;margin-bottom:16px}.qr-panel{background:#1e293b80;border:1px solid #334155;border-radius:22px;margin-top:18px;padding:18px}.qr-panel-title{margin-bottom:14px;font-size:1.1rem;font-weight:800}.qr-box{background:#fff;border-radius:18px;justify-content:center;align-items:center;margin-bottom:14px;padding:18px;display:inline-flex}.qr-description{color:#cbd5e1;margin-bottom:12px;line-height:1.5}.qr-link-preview{color:#94a3b8;word-break:break-all;background:#02061773;border:1px solid #1e293b;border-radius:14px;padding:12px;font-size:.85rem}.full-width{width:100%;margin-top:12px}.empty-mini-box{color:#cbd5e1;background:#02061773;border:1px solid #1e293b;border-radius:16px;padding:14px}.event-mini-card{background:#1e293b8c;border:1px solid #1e293b;border-radius:16px;margin-bottom:10px;padding:12px}.event-mini-top{color:#e2e8f0;justify-content:space-between;gap:10px;margin-bottom:8px;font-size:.92rem;display:flex}.event-mini-title{color:#cbd5e1;line-height:1.4}.notice-card{background:#1e293b8c;border:1px solid #1e293b;border-radius:16px;margin-bottom:10px;padding:12px}.notice-title{color:#f8fafc;margin-bottom:6px;font-weight:800}.notice-body{color:#cbd5e1;line-height:1.45}.notice-delete-button{color:#fecaca;cursor:pointer;background:#7f1d1d59;border:1px solid #f8717159;border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;width:34px;height:34px;display:flex}.notice-delete-button:hover{background:#b91c1c80}.no-top-margin{margin-top:0}.mobile-page{background:radial-gradient(circle at 0 0,#38bdf82e,#0000 30%),radial-gradient(circle at 100% 100%,#a855f729,#0000 32%),linear-gradient(to bottom right,#020617,#0f172a);justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex}.mobile-card{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#0f172af5;border:1px solid #334155f2;border-radius:30px;width:min(680px,100%);padding:26px;box-shadow:0 24px 60px #00000073}.mobile-title{margin:0 0 6px;font-size:clamp(1.8rem,7vw,2.4rem);line-height:1.05}.mobile-subtitle{color:#94a3b8;margin:0 0 18px;line-height:1.45}.mobile-info-box{color:#dbeafe;background:#0206177a;border:1px solid #1e293b;border-radius:20px;gap:8px;margin-bottom:18px;padding:16px;line-height:1.4;display:grid}.mobile-form{flex-direction:column;gap:16px;display:flex}.mobile-form label{color:#e2e8f0;flex-direction:column;gap:8px;font-weight:800;display:flex}.mobile-form input,.mobile-form textarea,.mobile-form select{color:#f8fafc;background:#020617b8;border:1px solid #334155;border-radius:16px;outline:none;width:100%;min-height:50px;padding:14px 15px;transition:border-color .15s,box-shadow .15s,background .15s}.mobile-form textarea{resize:vertical;min-height:120px}.mobile-form input::placeholder,.mobile-form textarea::placeholder{color:#64748b}.mobile-form input:focus,.mobile-form textarea:focus,.mobile-form select:focus{background:#020617eb;border-color:#38bdf8;box-shadow:0 0 0 4px #38bdf824}.mobile-submit{color:#082f49;cursor:pointer;background:#38bdf8;border:none;border-radius:18px;width:100%;min-height:56px;padding:15px 18px;font-weight:900;box-shadow:0 12px 28px #38bdf82e}.mobile-submit:hover{background:#7dd3fc}.mobile-success{color:#dcfce7;background:#064e3b3d;border:1px solid #22c55e59;border-radius:24px;flex-direction:column;gap:12px;padding:22px;line-height:1.5;display:flex}.mobile-success h2{margin:0;font-size:1.6rem}.error-message{color:#fecaca;background:#7f1d1d40;border:1px solid #991b1b;border-radius:16px;margin-bottom:14px;padding:12px;line-height:1.4}.duration-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}.duration-option{color:#cbd5e1;text-align:left;cursor:pointer;background:#0f172ae6;border:1px solid #334155;border-radius:16px;padding:12px}.duration-option.active{color:#e0f2fe;background:#38bdf82e;border:2px solid #38bdf8}.duration-option-title{font-weight:900}.duration-option-description{opacity:.85;margin-top:4px;font-size:.82rem;line-height:1.35}@media (width<=1100px){.layout{grid-template-columns:1fr}.week-grid{grid-template-columns:repeat(2,1fr)}.clock-main{font-size:3rem}.touch-block-grid{grid-template-columns:1fr}}@media (width<=700px){.app{padding:14px}.modal-actions{grid-template-columns:1fr}.topbar{flex-direction:column;align-items:flex-start}.clock-box{text-align:left}.mobile-page{align-items:flex-start;padding:14px}.mobile-card{border-radius:24px;padding:20px}.duration-grid,.week-grid{grid-template-columns:1fr}}button,.action-button,.week-nav-button,.day-card,.touch-block,.icon-close{transform-origin:50%;transition:transform .18s cubic-bezier(.22,1,.36,1),box-shadow .18s,background .18s,border-color .18s,opacity .18s,filter .18s}button:hover,.action-button:hover,.week-nav-button:hover,.day-card:hover,.touch-block:hover,.icon-close:hover{filter:brightness(1.05);transform:translateY(-2px)scale(1.012)}button:active,.action-button:active,.week-nav-button:active,.day-card:active,.touch-block:active,.icon-close:active{filter:brightness(.96);transform:translateY(0)scale(.965)}.day-card.selected{animation:.42s cubic-bezier(.22,1,.36,1) softSelectPulse}.touch-block:hover{box-shadow:0 18px 45px #00000042,inset 0 0 0 1px #47ebb42e}.action-button:hover,.week-nav-button:hover{box-shadow:0 14px 34px #00000047,inset 0 0 0 1px #ffffff1f}.modal-overlay{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);animation:.18s ease-out both modalBackdropIn}.modal-card{transform-origin:50%;animation:.28s cubic-bezier(.22,1,.36,1) both modalCardIn}.qr-panel{animation:.26s cubic-bezier(.22,1,.36,1) both qrPanelIn}.qr-box{transition:transform .18s cubic-bezier(.22,1,.36,1),box-shadow .18s}.qr-box:hover{transform:translateY(-2px)scale(1.018);box-shadow:0 20px 55px #00000047}.panel{transition:transform .22s cubic-bezier(.22,1,.36,1),box-shadow .22s,border-color .22s}.panel:hover{border-color:#ffffff1f}@keyframes modalBackdropIn{0%{opacity:0;-webkit-backdrop-filter:blur();backdrop-filter:blur()}to{opacity:1;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}}@keyframes modalCardIn{0%{opacity:0;filter:blur(8px);transform:translateY(22px)scale(.96)}to{opacity:1;filter:blur();transform:translateY(0)scale(1)}}@keyframes qrPanelIn{0%{opacity:0;transform:translateY(14px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes softSelectPulse{0%{transform:scale(.985)}60%{transform:scale(1.018)}to{transform:scale(1)}}.pin-keypad-wrap{flex-direction:column;gap:12px;display:flex}.pin-display{color:#f8fafc;letter-spacing:.18em;background:#020617b8;border:1px solid #47ebb442;border-radius:18px;align-items:center;min-height:52px;padding:14px 16px;font-size:22px;font-weight:900;display:flex;box-shadow:0 0 0 4px #47ebb40f}.pin-display:empty{color:#64748b}.pin-keypad{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;display:grid}.pin-key{color:#f8fafc;cursor:pointer;background:#0f172af5;border:1px solid #ffffff1f;border-radius:18px;min-height:58px;font-size:22px;font-weight:950;box-shadow:0 14px 28px #00000038,inset 0 0 0 1px #ffffff0a}.pin-key:hover{background:#47ebb42e;border-color:#47ebb461}.pin-key:active{transform:scale(.94)}.pin-key-muted{color:#cbd5e1;background:#334155cc;font-size:15px}.pin-key:disabled{opacity:.55;cursor:not-allowed}.modal-overlay.closing{animation:.17s ease-in both modalBackdropOut}.modal-card.closing{animation:.17s ease-in both modalCardOut}@keyframes modalBackdropOut{0%{opacity:1;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}to{opacity:0;-webkit-backdrop-filter:blur();backdrop-filter:blur()}}@keyframes modalCardOut{0%{opacity:1;filter:blur();transform:translateY(0)scale(1)}to{opacity:0;filter:blur(5px);transform:translateY(14px)scale(.97)}}@media (width<=2000px){*{scroll-behavior:auto!important}.modal-overlay,.modal-card,.floating-action-button,.action-button,.day-card,.block-card,.notice-card,.subpanel,.event-mini-card{transition-duration:.14s!important}.modal-overlay{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}.modal-card,.block-card,.notice-card,.subpanel,.event-mini-card{box-shadow:0 8px 22px #00000038!important}.modal-card:hover,.block-card:hover,.notice-card:hover,.day-card:hover,.action-button:hover,.floating-action-button:hover{transform:none!important}}.modal-overlay,.suggestion-overlay,.register-modal-overlay,.qr-modal-overlay{-webkit-backdrop-filter:none!important}.modal-card,.suggestion-modal,.register-modal-card,.qr-modal-card,.subpanel,.notice-card,.event-mini-card,.block-card,.day-card,.kiosk-header,.sheet-card,.registry-sheet,.floating-action-button{box-shadow:0 8px 22px #0000003d!important}.modal-overlay *,.suggestion-overlay *,.register-modal-overlay *,.qr-modal-overlay *,.registry-page *,.kiosk-page *{filter:none!important}button,.action-button,.floating-action-button,.day-card,.block-card,.notice-card,.event-mini-card{will-change:auto!important;transition:transform .12s,opacity .12s,background-color .12s,border-color .12s!important}button:active,.action-button:active,.floating-action-button:active,.day-card:active,.block-card:active{transform:scale(.985)}button:hover,.action-button:hover,.floating-action-button:hover,.day-card:hover,.block-card:hover,.notice-card:hover,.event-mini-card:hover{filter:none!important}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:1ms!important;animation-duration:1ms!important;animation-iteration-count:1!important}}*,:before,:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}button,button:hover,button:active,.action-button,.action-button:hover,.action-button:active,.floating-action-button,.floating-action-button:hover,.floating-action-button:active,.day-card,.day-card:hover,.day-card:active,.block-card,.block-card:hover,.block-card:active,.notice-card,.notice-card:hover,.event-mini-card,.event-mini-card:hover,.modal-card,.modal-overlay{filter:none!important;-webkit-backdrop-filter:none!important;transform:none!important}.modal-card,.subpanel,.notice-card,.event-mini-card,.block-card,.day-card,.kiosk-header,.floating-action-button{box-shadow:0 4px 14px #00000038!important}html,body,#root,.kiosk-page,.register-page,button,.panel-card,.subpanel,.notice-card,.block-card{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}input,textarea{-webkit-user-select:text;user-select:text}
