:root{--bg-color:#0b0d19;--bg-gradient:linear-gradient(135deg, #0b0d19 0%, #05070f 100%);--panel-bg:#14182e99;--panel-border:#ffffff14;--text-primary:#f3f4f6;--text-secondary:#9ca3af;--text-muted:#6b7280;--accent-cyan:#00f2fe;--accent-cyan-glow:#00f2fe4d;--accent-emerald:#10b981;--accent-emerald-glow:#10b9814d;--accent-ruby:#ef4444;--accent-ruby-glow:#ef444466;--accent-amber:#f59e0b;--accent-amber-glow:#f59e0b4d;--accent-magenta:#d946ef;--accent-magenta-glow:#d946ef4d;--accent-time:var(--accent-cyan);--accent-time-glow:var(--accent-cyan-glow);--font-sans:"Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-digital:"Share Tech Mono", monospace}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;margin:0;padding:0}html,body{background-color:var(--bg-color);width:100%;height:100%;font-family:var(--font-sans);color:var(--text-primary);overflow:hidden;--lightningcss-light: !important;--lightningcss-dark:initial!important;color-scheme:dark!important}#app{background:var(--bg-gradient);width:100%;height:100%;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);flex-direction:column;display:flex;position:relative}.bg-glow{filter:blur(40px);pointer-events:none;z-index:0;background:radial-gradient(circle,#00f2fe26 0%,#0000 70%);border-radius:50%;width:300px;height:300px;animation:15s ease-in-out infinite alternate glow-movement;position:absolute;top:-10%;left:30%}@keyframes glow-movement{0%{transform:translate(0)scale(1)}to{transform:translate(-20%,30%)scale(1.3)}}.app-header{z-index:10;justify-content:space-between;align-items:center;height:50px;padding:0 20px;display:flex}.status-badge{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:20px;margin-right:8px;padding:4px 10px;font-size:.75rem;font-weight:600;transition:all .3s}.status-badge.offline{color:#fca5a5;background:#ef444433;border:1px solid #ef44444d}.status-badge.online{color:#a7f3d0;background:#10b98133;border:1px solid #10b9814d}.status-badge.status-locked{color:#a5f3fc;background:#00f2fe33;border:1px solid #00f2fe4d}.status-badge.status-unlocked{color:var(--text-secondary);background:#ffffff1a;border:1px solid #ffffff1a}.battery-badge{color:var(--text-secondary);font-size:.85rem;font-weight:600}.main-clock-section{z-index:5;flex-direction:column;flex:1;justify-content:center;align-items:center;display:flex}.clock-card{text-align:center;width:100%;max-width:400px;padding:20px;position:relative}.clock-row{justify-content:center;align-items:baseline;width:100%;display:flex}.time-display{font-family:var(--font-digital);color:var(--accent-time);text-shadow:0 0 30px var(--accent-time-glow);font-variant-numeric:tabular-nums;font-size:23vw;font-weight:700;line-height:1}.seconds-seconds{font-family:var(--font-digital);color:var(--text-muted);vertical-align:super;margin-left:2px;font-size:2.2rem;font-weight:500;display:inline-block}.date-display{color:var(--text-secondary);text-transform:capitalize;letter-spacing:.5px;margin-top:12px;font-size:1.1rem}.next-alarm-info{color:var(--accent-emerald);background:#10b9811a;border:1px solid #10b98133;border-radius:20px;margin-top:16px;padding:6px 16px;font-size:.85rem;transition:all .3s;display:inline-block}.next-alarm-info.has-snooze{color:#fa0;cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:pan-y;background:#ffaa001a;border:1px dashed #ffaa004d;animation:2s ease-in-out infinite gentlePulse}@keyframes gentlePulse{0%,to{opacity:.8}50%{opacity:1}}.quick-actions{z-index:5;justify-content:center;gap:15px;padding:10px 20px;display:flex}.action-btn{border:1px solid var(--panel-border);background:var(--panel-bg);color:var(--text-primary);font-family:var(--font-sans);cursor:pointer;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:16px;justify-content:center;align-items:center;gap:8px;padding:14px 24px;font-size:.95rem;font-weight:600;transition:all .3s cubic-bezier(.4,0,.2,1);display:inline-flex}.action-btn:active{background:#ffffff1a;transform:scale(.96)}.action-btn.primary-btn{color:#05070f;background:linear-gradient(135deg,#00f2fe 0%,#4facfe 100%);border:none;box-shadow:0 4px 15px #00f2fe4d}.action-btn.primary-btn:active{box-shadow:0 2px 8px #00f2fe33}.alarms-section{padding:15px 20px env(safe-area-inset-bottom,20px);z-index:5;max-height:250px;overflow-y:auto}.alarms-section h3{text-transform:uppercase;letter-spacing:1.5px;color:var(--text-muted);margin-bottom:12px;font-size:.9rem}.alarms-list{flex-direction:column;gap:10px;max-height:265px;padding-right:4px;display:flex;overflow-y:auto}.empty-alarms{text-align:center;color:var(--text-muted);background:#ffffff05;border:1px dashed #ffffff14;border-radius:16px;padding:24px;font-size:.9rem}.alarm-item{background:var(--panel-bg);border:1px solid var(--panel-border);-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);cursor:pointer;border-radius:20px;justify-content:space-between;align-items:center;padding:16px 20px;transition:all .3s;display:flex}.alarm-item:active{background:#ffffff0d;transform:scale(.98)}.alarm-item.active{border-color:#10b9814d}.alarm-item-left{flex-direction:column;gap:4px;display:flex}.alarm-item-time{font-family:var(--font-digital);color:var(--text-primary);font-size:2.2rem;font-weight:700;line-height:1}.alarm-item.active .alarm-item-time{color:var(--accent-cyan)}.alarm-item-meta{color:var(--text-secondary);align-items:center;gap:8px;font-size:.8rem;display:flex}.alarm-item-days{color:var(--accent-emerald);font-weight:600}.alarm-item-right{align-items:center;gap:15px;display:flex}.switch{width:48px;height:28px;display:inline-block;position:relative}.switch input{opacity:0;width:0;height:0}.slider{cursor:pointer;background-color:#ffffff1a;border-radius:34px;transition:all .3s cubic-bezier(.4,0,.2,1);position:absolute;inset:0}.slider:before{content:"";background-color:#fff;border-radius:50%;width:22px;height:22px;transition:all .3s cubic-bezier(.4,0,.2,1);position:absolute;bottom:3px;left:3px;box-shadow:0 2px 5px #0003}input:checked+.slider{background-color:var(--accent-emerald)}input:checked+.slider:before{transform:translate(20px)}.btn-delete-alarm{color:var(--text-muted);cursor:pointer;background:0 0;border:none;align-items:center;padding:4px;transition:color .2s;display:flex}.btn-delete-alarm:active{color:var(--accent-ruby)}.modal-overlay{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:100;opacity:1;background:#05070fd9;justify-content:center;align-items:center;width:100%;height:100%;padding:20px;transition:opacity .3s;display:flex;position:fixed;top:0;left:0}.hidden{display:none!important}.modal-card{background:#14182e;border:1px solid #ffffff1a;border-radius:28px;width:100%;max-width:380px;padding:24px;animation:.3s cubic-bezier(.16,1,.3,1) slide-up;box-shadow:0 10px 30px #00000080}@keyframes slide-up{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.modal-card h2{text-align:center;margin-bottom:20px;font-size:1.3rem;font-weight:700}.time-picker-container{justify-content:center;align-items:center;gap:10px;margin-bottom:20px;display:flex}.time-select{font-family:var(--font-digital);color:var(--accent-cyan);text-align:center;appearance:none;cursor:pointer;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:16px;outline:none;width:100px;height:80px;padding:8px 16px;font-size:3.5rem;font-weight:700}.time-select option{color:#fff;background:#14182e;font-size:1.5rem}.time-separator{font-family:var(--font-digital);color:var(--text-muted);font-size:3.5rem;font-weight:700}.sound-select-wrapper{gap:8px;width:100%;display:flex}.sound-select-wrapper select{flex:1}.preview-sound-btn{color:var(--accent-cyan);cursor:pointer;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:12px;justify-content:center;align-items:center;padding:0 12px;transition:all .2s;display:flex}.preview-sound-btn:active{background:var(--accent-cyan);color:#05070f;box-shadow:0 0 10px var(--accent-cyan-glow)}.input-group{margin-bottom:16px}.input-group label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;margin-bottom:6px;font-size:.8rem;display:block}.input-group input[type=text],.input-group select{color:#fff;width:100%;font-family:var(--font-sans);background:#ffffff0a;border:1px solid #ffffff1a;border-radius:12px;outline:none;padding:12px 16px;font-size:.95rem}.input-group select{appearance:none;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M7 10l5 5 5-5H7z'/%3E%3C/svg%3E");background-position:right 12px center;background-repeat:no-repeat;background-size:20px}.row-group{grid-template-columns:1fr 1fr;gap:15px;display:grid}.days-selector{justify-content:space-between;gap:4px;display:flex}.day-checkbox{text-align:center;flex:1}.day-checkbox input{display:none}.day-checkbox span{height:36px;color:var(--text-secondary);cursor:pointer;background:#ffffff0a;border:1px solid #0000;border-radius:50%;font-size:.8rem;font-weight:700;line-height:36px;transition:all .2s;display:block}.day-checkbox input:checked+span{background:var(--accent-emerald);color:#05070f;box-shadow:0 2px 8px var(--accent-emerald-glow)}.modal-actions{gap:12px;margin-top:24px;display:flex}.modal-btn{font-family:var(--font-sans);cursor:pointer;border:none;border-radius:14px;flex:1;padding:14px;font-size:.95rem;font-weight:700;transition:transform .2s}.modal-btn:active{transform:scale(.97)}.modal-btn.primary{color:#fff;background:linear-gradient(135deg,#10b981 0%,#059669 100%)}.modal-btn.secondary{color:var(--text-primary);background:#ffffff14}.ringing-overlay{z-index:200;background-color:#0000;background-image:linear-gradient(#00000073,#000000a6),url(/nature-bg.jpg);background-position:0 0,50%;background-repeat:repeat,no-repeat;background-size:cover;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box;justify-content:center;align-items:center;width:100%;height:100%;padding:20px;display:flex;position:fixed;top:0;left:0}.ringing-content{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:45px;width:90%;max-width:600px;display:flex}.ringing-icon{color:#10b981;filter:drop-shadow(0 0 25px #10b98199);animation:1.5s ease-in-out infinite alarm-shake}@keyframes alarm-shake{0%,to{transform:rotate(0)}5%,15%,25%{transform:rotate(-8deg)}10%,20%,30%{transform:rotate(8deg)}35%{transform:rotate(0)}}.ringing-info-group{flex-direction:column;align-items:center;gap:15px;display:flex}.ringing-text-group{flex-direction:column;gap:8px;display:flex}.ringing-time{font-family:var(--font-digital);color:#fff;text-shadow:0 4px 15px #000000f2,0 0 30px #0009;font-size:5.5rem;font-weight:700}.ringing-label{color:#a7f3d0;text-shadow:0 2px 8px #000000f2;font-size:1.6rem;font-weight:600}.ringing-actions{flex-direction:column;gap:28px;width:100%;max-width:320px;display:flex}.ringing-btn{font-family:var(--font-sans);cursor:pointer;text-transform:uppercase;letter-spacing:1.5px;border:none;border-radius:24px;padding:20px 48px;font-size:1.4rem;font-weight:700;transition:all .2s;box-shadow:0 10px 25px #00000080}.ringing-btn:active{transform:scale(.96);box-shadow:0 4px 10px #00000080}.ringing-btn.stop-btn{color:#fff;-webkit-backdrop-filter:blur(10px);background:#ef444459;border:1px solid #ef444473;box-shadow:0 6px 15px #ef444426}.ringing-btn.stop-btn:active{background:#ef44448c}.ringing-btn.snooze-btn{color:#fff;-webkit-backdrop-filter:blur(10px);background:#f59e0b59;border:1px solid #f59e0b73;box-shadow:0 6px 15px #f59e0b26}.ringing-btn.snooze-btn:active{background:#f59e0b8c}.settings-btn{color:var(--text-secondary);cursor:pointer;vertical-align:middle;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;margin-left:8px;padding:8px;transition:all .2s;display:inline-flex}.settings-btn:active{color:#fff;background:#ffffff14}.bedside-overlay{z-index:150;cursor:pointer;background:#000;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:fixed;top:0;left:0}.bedside-time{font-family:var(--font-digital);font-variant-numeric:tabular-nums;font-size:22vw;font-weight:700;transition:color .2s,text-shadow .2s;animation:30s linear infinite pixel-shift}.bedside-alarm-indicator{transition:color .2s,text-shadow .2s;animation:2s ease-in-out infinite softPulse;position:absolute;top:24px;right:24px}@keyframes softPulse{0%,to{opacity:.35;transform:scale(1)}50%{opacity:.75;transform:scale(1.08)}}.bedside-overlay.brightness-1 .bedside-time,.bedside-overlay.brightness-1 .bedside-alarm-indicator{color:var(--night-color-1,#a00)!important;text-shadow:0 0 15px var(--night-color-glow-1,#aa000080)!important}.bedside-overlay.brightness-2 .bedside-time,.bedside-overlay.brightness-2 .bedside-alarm-indicator{color:var(--night-color-2,#600)!important;text-shadow:0 0 10px var(--night-color-glow-2,#6006)!important}.bedside-overlay.brightness-3 .bedside-time,.bedside-overlay.brightness-3 .bedside-alarm-indicator{color:var(--night-color-3,#300)!important;text-shadow:0 0 5px var(--night-color-glow-3,#3003)!important}.bedside-overlay.brightness-4 .bedside-time,.bedside-overlay.brightness-4 .bedside-alarm-indicator{color:var(--night-color-4,#150000)!important;text-shadow:0 0 2px var(--night-color-glow-4,#1500001a)!important}@keyframes pixel-shift{0%{transform:translate(0)}25%{transform:translate(5px,5px)}50%{transform:translate(-5px,5px)}75%{transform:translate(-5px,-5px)}to{transform:translate(0)}}.bedside-hint{text-align:center;margin-top:30px;font-size:.75rem;line-height:1.5;transition:color .2s}.bedside-overlay.brightness-1 .bedside-hint{color:#3a0000}.bedside-overlay.brightness-2 .bedside-hint{color:#200}.bedside-overlay.brightness-3 .bedside-hint{color:#120000}.bedside-overlay.brightness-4 .bedside-hint{color:#060000}.picker-wrapper{cursor:pointer;background:0 0;border:2px solid #fff3;border-radius:50%;width:48px;height:48px;position:relative;overflow:hidden;box-shadow:0 4px 10px #0000004d}.picker-wrapper input[type=color]{cursor:pointer;background:0 0;border:none;width:70px;height:70px;padding:0;position:absolute;top:-10px;left:-10px}@media (orientation:landscape) and (height<=600px){#app{flex-direction:column;justify-content:space-between;align-items:center;height:100vh;padding:10px;display:flex;position:relative;overflow:hidden}.app-header{justify-content:space-between;width:100%;max-width:600px;height:auto;margin-bottom:0}.main-clock-section{border:none;flex:1;justify-content:center;align-items:center;padding:0;display:flex}.clock-card{text-align:center;padding:0}.clock-row{justify-content:center;width:auto}.time-display{font-size:32vh}.bedside-time{font-size:45vh}.seconds-seconds{font-size:8vh}.date-display{text-align:center;margin-top:2px;font-size:4.5vh}.next-alarm-info{text-align:center;margin-top:4px;font-size:3.5vh}.quick-actions{flex-direction:column;flex-shrink:0;align-items:center;width:auto;margin-top:0;padding:0;display:flex;position:absolute;top:50%;right:24px;transform:translateY(-50%)}.quick-actions .action-btn{border-radius:16px;flex-direction:column;justify-content:center;align-items:center;gap:6px;min-width:90px;padding:10px 16px;font-size:.85rem;display:flex}.quick-actions .action-btn svg{width:22px;height:22px;margin-bottom:0}.ringing-overlay{padding:10px}.ringing-content{border-radius:24px;flex-direction:row;justify-content:center;align-items:center;gap:40px;width:95%;max-width:750px;padding:20px 30px}.ringing-info-group{text-align:left;flex-direction:row;align-items:center;gap:20px}.ringing-text-group{align-items:flex-start}.ringing-actions{flex-direction:row;gap:15px;width:auto}.ringing-btn{min-width:140px;padding:14px 28px;font-size:1.1rem}.ringing-time{margin-bottom:0;font-size:3.5rem}.ringing-label,.ringing-icon{margin-bottom:0}.ringing-icon svg{width:60px;height:60px}}::backdrop{background-color:#000!important}html:fullscreen{background-color:#000!important}body:fullscreen{background-color:#000!important}
