:root{
  --info-rgb:212,154,36;--dim:1;--clock-brightness:1;--dim-soft:.55;--dim-faint:.14;--dim-visible:.9;
  --clock-font:Impact,Haettenschweiler,"Arial Narrow Bold",sans-serif;--digit-weight:500;--digit-spacing:.01em;--card-radius:10px;color-scheme:dark;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{width:100%;height:100%;margin:0;background:#000;overflow:hidden}body{font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:rgba(var(--info-rgb),var(--dim))}button,input,select{font:inherit}.screen{min-height:100dvh;width:100%;background:#000;position:relative;display:flex;align-items:center;justify-content:center;padding:max(18px,env(safe-area-inset-top)) 12px max(20px,env(safe-area-inset-bottom));touch-action:manipulation}.clock-wrap{text-align:center;display:flex;flex-direction:column;align-items:center;width:max-content;max-width:calc(100vw - 24px);touch-action:none;transform:translate3d(var(--shift-x,0),var(--shift-y,0),0) scale(var(--clock-scale,1));transform-origin:center center;transition:transform .22s ease,opacity .2s ease;opacity:var(--clock-brightness,1);color:rgb(var(--info-rgb))}
.flip-clock{display:flex;align-items:center;justify-content:center;gap:clamp(2px,.7vw,6px);width:max-content;max-width:100%;margin-inline:auto;perspective:1200px}.time-group{display:flex;gap:clamp(1px,.22vw,3px)}.flip-digit{position:relative;width:clamp(47px,14.2vw,92px);height:clamp(78px,23vw,148px);border-radius:var(--card-radius);background:#070707;box-shadow:0 0 0 1px rgba(var(--info-rgb),calc(var(--dim-faint)*.45)),0 9px 20px rgba(0,0,0,.78);overflow:hidden;font-family:var(--clock-font);font-weight:var(--digit-weight);letter-spacing:var(--digit-spacing);font-variant-numeric:tabular-nums}.digit-half,.flip-overlay{position:absolute;left:0;width:100%;height:50%;overflow:hidden;background:linear-gradient(180deg,#0a0a0a 0%,#050505 100%);color:rgba(var(--info-rgb),var(--dim));text-shadow:0 0 12px rgba(var(--info-rgb),var(--dim-faint));backface-visibility:hidden;-webkit-backface-visibility:hidden}.digit-half>span,.flip-overlay>span{position:absolute;left:0;width:100%;height:200%;display:flex;align-items:center;justify-content:center;font-size:clamp(70px,20.8vw,136px);line-height:1}.digit-top{top:0;border-bottom:1px solid #000}.digit-top>span{top:0}.digit-bottom{bottom:0;border-top:1px solid #111}.digit-bottom>span{bottom:0}.flip-digit:after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:#000;box-shadow:0 -1px 0 rgba(255,255,255,.018);z-index:6}.flip-overlay{z-index:5;transform-style:preserve-3d}.flip-overlay.top{top:0;transform-origin:bottom;border-bottom:1px solid #000}.flip-overlay.top>span{top:0}.flip-overlay.bottom{bottom:0;transform-origin:top;transform:rotateX(90deg);border-top:1px solid #111}.flip-overlay.bottom>span{bottom:0}.flip-overlay.top.animate{animation:flipTop var(--flip-duration,300ms) cubic-bezier(.42,0,.72,.62) forwards}.flip-overlay.bottom.animate{animation:flipBottom var(--flip-duration,300ms) cubic-bezier(.28,.38,.18,1) forwards;animation-delay:calc(var(--flip-duration,300ms)*.46)}@keyframes flipTop{0%{transform:rotateX(0);filter:brightness(1)}100%{transform:rotateX(-90deg);filter:brightness(.58)}}@keyframes flipBottom{0%{transform:rotateX(90deg);filter:brightness(.55)}100%{transform:rotateX(0);filter:brightness(1)}}.colon{width:clamp(6px,1.7vw,11px);height:clamp(78px,23vw,148px);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:18%;opacity:.78}.colon span{width:clamp(5px,1.4vw,9px);height:clamp(5px,1.4vw,9px);border-radius:50%;background:rgba(var(--info-rgb),var(--dim));box-shadow:0 0 9px rgba(var(--info-rgb),var(--dim-faint))}.flip-clock.hide-seconds .seconds,.flip-clock.hide-seconds .seconds-colon{display:none}
body.font-mechanical{--clock-font:Impact,Haettenschweiler,"Arial Narrow Bold",sans-serif;--digit-weight:500;--digit-spacing:.01em;--card-radius:10px}body.font-radio70{--clock-font:"Arial Black",Arial,sans-serif;--digit-weight:900;--digit-spacing:-.055em;--card-radius:7px}body.font-vfd{--clock-font:"Courier New",Courier,monospace;--digit-weight:700;--digit-spacing:-.08em;--card-radius:5px}body.font-lcd{--clock-font:"Lucida Console",Monaco,monospace;--digit-weight:700;--digit-spacing:-.11em;--card-radius:4px}body.font-modern{--clock-font:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--digit-weight:260;--digit-spacing:-.055em;--card-radius:14px}body.font-plain{--clock-font:Arial,Helvetica,sans-serif;--digit-weight:500;--digit-spacing:0;--card-radius:10px}.date{margin-top:28px;font-size:clamp(16px,4.1vw,23px);font-weight:350;text-transform:capitalize;letter-spacing:.02em}.info-lines{display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:26px}.sun-row,.alarm-row{display:inline-flex;align-items:center;gap:10px;font-size:clamp(14px,3.5vw,19px);opacity:.78}.sun-row strong{font-weight:600;font-variant-numeric:tabular-nums}.sun-icon{font-size:1.15em}
.alarm-days-display{display:none;margin-top:4px;font-size:clamp(12px,3vw,16px);font-weight:650;letter-spacing:.03em;opacity:.96;white-space:nowrap;text-align:center}
@media(max-width:380px){.alarm-days-display{font-size:clamp(11px,3vw,14px)}}
@media(orientation:landscape){.alarm-days-display{font-size:clamp(11px,2.7vh,15px);margin-top:3px}}

.top-controls{position:absolute;top:max(12px,env(safe-area-inset-top));right:10px;display:flex;gap:4px;z-index:3;transition:opacity .35s,transform .35s}.icon-btn{width:44px;height:44px;display:grid;place-items:center;border:0;background:rgba(12,12,12,.35);color:rgba(var(--info-rgb),var(--dim-visible));border-radius:50%;font-size:23px}.bottom-actions{position:absolute;bottom:max(20px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);display:flex;gap:8px;z-index:3;transition:opacity .35s,transform .35s;max-width:calc(100% - 18px)}.action-btn{border:1px solid rgba(var(--info-rgb),var(--dim-soft));background:rgba(var(--info-rgb),.025);color:rgba(var(--info-rgb),var(--dim-visible));border-radius:999px;min-height:44px;padding:0 14px;display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap}.action-btn.primary{background:rgba(var(--info-rgb),.08)}.spotify-mark{width:13px;height:13px;font-size:0;border-radius:50%;border:2px solid currentColor;position:relative}.spotify-mark:after{content:"";position:absolute;width:5px;height:1px;border-radius:2px;background:currentColor;left:2px;top:4px;box-shadow:0 3px currentColor}.secondary{opacity:.75}.controls-hidden{opacity:0!important;pointer-events:none;transform:translateY(10px)!important}.top-controls.controls-hidden{transform:translateY(-10px)!important}.tap-hint{position:absolute;top:max(14px,env(safe-area-inset-top));left:50%;transform:translateX(-50%);font-size:12px;color:rgba(var(--info-rgb),.23);opacity:0;transition:opacity .3s;pointer-events:none}.tap-hint.show{opacity:1}
.panel{position:fixed;inset:0;background:#050505;color:#d8d8d8;z-index:10;transform:translateY(101%);transition:transform .28s ease;overflow-y:auto;padding:max(22px,env(safe-area-inset-top)) 22px max(32px,env(safe-area-inset-bottom))}.panel.open{transform:translateY(0)}.panel-head{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:24px}.panel-head small{color:#777;letter-spacing:.16em;font-size:11px}.panel-head h1{margin:3px 0 0;font-size:30px;font-weight:650}.panel .icon-btn{color:#aaa;background:#111}.settings-section{padding:0 0 26px;border-bottom:1px solid #151515}.settings-section:last-of-type{border-bottom:0}.settings-section h2{margin:27px 0 4px;font-size:19px;font-weight:650;color:#d0d0d0}.field-label{display:block;margin:20px 0 9px;color:#9e9e9e;font-size:14px}.field-help{margin:8px 0 0;color:#5f5f5f;font-size:12px;line-height:1.45}.swatches{display:flex;gap:12px;margin-bottom:14px}.swatch{width:42px;height:42px;border:1px solid #242424;border-radius:50%;background:var(--sw);box-shadow:inset 0 0 0 5px #050505}#colorPicker{width:100%;height:44px;border:1px solid #202020;border-radius:12px;background:#0a0a0a;padding:4px}input[type=range]{width:100%;accent-color:#777}.select-input,.text-input{width:100%;border:1px solid #202020;background:#0a0a0a;color:#ddd;border-radius:12px;min-height:48px;padding:0 13px;outline:none}.time-input{font-size:22px;font-variant-numeric:tabular-nums}.toggle-row{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 0;border-bottom:1px solid #151515}.toggle-row strong{display:block;font-size:15px;font-weight:550}.toggle-row small{display:block;color:#666;margin-top:3px;line-height:1.35}.switch input{display:none}.switch span{display:block;width:48px;height:28px;background:#1a1a1a;border:1px solid #242424;border-radius:20px;position:relative;transition:.2s}.switch span:after{content:"";position:absolute;width:22px;height:22px;border-radius:50%;background:#6b6b6b;left:2px;top:2px;transition:.2s}.switch input:checked+span{background:#2b2b2b}.switch input:checked+span:after{transform:translateX(20px);background:#b0b0b0}.weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}.weekdays button{height:40px;border:1px solid #161616;background:#000;color:#4b4b4b;border-radius:11px;font-weight:650;transition:transform .15s ease,background .18s ease,color .18s ease,border-color .18s ease,box-shadow .18s ease}.weekdays button:active{transform:scale(.96)}.weekdays button.active{background:rgb(var(--info-rgb));color:#050505;border-color:rgb(var(--info-rgb));box-shadow:0 0 0 1px rgba(var(--info-rgb),.28),0 0 16px rgba(var(--info-rgb),.13)}.panel-actions{display:grid;gap:10px;margin-top:22px}.panel-button{min-height:48px;border:1px solid #242424;background:#0e0e0e;color:#c8c8c8;border-radius:12px}.panel-button.compact{width:100%;margin-top:12px}.status{min-height:20px;color:#6f6f6f;font-size:13px;line-height:1.4;margin:18px 0 0}
.alarm-overlay{position:fixed;inset:0;background:#000;z-index:30;display:flex;align-items:center;justify-content:center;padding:24px;opacity:0;pointer-events:none;transition:opacity .25s}.alarm-overlay.active{opacity:1;pointer-events:auto}.alarm-card{text-align:center;width:min(430px,100%);color:rgba(var(--info-rgb),.92)}.alarm-card small{letter-spacing:.28em;font-size:12px;opacity:.65}.alarm-now{font-family:var(--clock-font);font-size:clamp(86px,25vw,150px);line-height:1;margin:20px 0 6px}.alarm-message{font-size:20px;margin-bottom:35px;opacity:.8}.alarm-stop,.alarm-snooze{width:100%;min-height:58px;border-radius:16px;margin-top:10px;font-weight:650}.alarm-stop{border:1px solid rgba(var(--info-rgb),.8);background:rgba(var(--info-rgb),.18);color:rgba(var(--info-rgb),1)}.alarm-snooze{border:1px solid #222;background:#0b0b0b;color:#bbb}
body.mode-day{--dim:1;--dim-soft:.55;--dim-faint:.14;--dim-visible:.95}body.mode-day .flip-digit{background:#090909}body.mode-night .screen{background:#000}
@media(max-width:560px){.bottom-actions{flex-wrap:wrap;justify-content:center}.action-btn{min-height:42px;padding:0 12px;font-size:13px}}@media(max-width:380px){.flip-digit{width:43px;height:70px}.digit-half>span,.flip-overlay>span{font-size:63px}.colon{height:70px;width:7px}.date{margin-top:15px}.info-lines{margin-top:14px}}@media(orientation:landscape){.screen{padding-left:max(14px,env(safe-area-inset-left));padding-right:max(14px,env(safe-area-inset-right))}.flip-digit{width:min(12.5vh,80px);height:min(20vh,128px)}.digit-half>span,.flip-overlay>span{font-size:min(18vh,116px)}.colon{height:min(20vh,128px)}.date{margin-top:8px}.info-lines{margin-top:9px;gap:3px}.bottom-actions{bottom:8px}}
@media(prefers-reduced-motion:reduce){.flip-overlay.top.animate,.flip-overlay.bottom.animate{animation-duration:1ms!important;animation-delay:0ms!important}}

.info-card{display:flex;flex-direction:column;gap:4px;padding:14px 15px;margin:8px 0 14px;border:1px solid rgba(var(--info-rgb),.22);border-radius:14px;background:rgba(var(--info-rgb),.06)}.info-card strong{font-size:.95rem}.info-card small{opacity:.7;line-height:1.35}

/* v3.2 */
[hidden]{display:none!important}
.alarm-icon{width:1.15em;height:1.15em;display:inline-flex;align-items:center;justify-content:center;color:rgba(var(--info-rgb),var(--dim))}.alarm-icon svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.flip-clock{transform:none;transform-origin:center center;transition:none;margin-bottom:0}


/* v3.4 modelos extras */
.tap-hint{display:none!important}
body.display-slide .flip-digit:after,body.display-reel .flip-digit:after,body.display-fade .flip-digit:after{display:none}
body.display-slide .digit-top,body.display-slide .digit-bottom,body.display-reel .digit-top,body.display-reel .digit-bottom,body.display-fade .digit-top,body.display-fade .digit-bottom{border:0}
.slide-overlay,.fade-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,#0b0b0b 0%,#050505 100%);color:rgba(var(--info-rgb),var(--dim));text-shadow:0 0 12px rgba(var(--info-rgb),var(--dim-faint));font-family:var(--clock-font);font-weight:var(--digit-weight);letter-spacing:var(--digit-spacing);font-variant-numeric:tabular-nums;z-index:8;overflow:hidden}
.slide-overlay>span,.fade-overlay>span{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:clamp(70px,20.8vw,136px);line-height:1}
.slide-overlay.old{transform:translateY(0);opacity:1}.slide-overlay.new{transform:translateY(-100%);opacity:.38}.slide-overlay.old.animate{animation:slideOld var(--slide-duration,280ms) cubic-bezier(.28,.5,.2,1) forwards}.slide-overlay.new.animate{animation:slideNew var(--slide-duration,280ms) cubic-bezier(.2,.65,.16,1) forwards}
.slide-overlay.reel{background:linear-gradient(180deg,#0d0d0d 0%,#050505 14%,#050505 86%,#0d0d0d 100%)}
body.display-reel .flip-digit{border-radius:4px;box-shadow:0 0 0 1px rgba(var(--info-rgb),calc(var(--dim-faint)*.65)),0 12px 24px rgba(0,0,0,.82),inset 0 8px 18px rgba(255,255,255,.02),inset 0 -8px 18px rgba(0,0,0,.45)}
body.display-reel .digit-half{background:linear-gradient(180deg,#0c0c0c 0%,#060606 100%)}
.fade-overlay.old{opacity:1}.fade-overlay.new{opacity:0;transform:scale(.985)}.fade-overlay.old.animate{animation:fadeOld var(--fade-duration,240ms) ease forwards}.fade-overlay.new.animate{animation:fadeNew var(--fade-duration,240ms) ease forwards}
@keyframes slideOld{0%{transform:translateY(0);opacity:1;filter:brightness(1)}100%{transform:translateY(100%);opacity:.12;filter:brightness(.7)}}
@keyframes slideNew{0%{transform:translateY(-100%);opacity:.25;filter:brightness(.76)}100%{transform:translateY(0);opacity:1;filter:brightness(1)}}
@keyframes fadeOld{0%{opacity:1}100%{opacity:0}}
@keyframes fadeNew{0%{opacity:0;transform:scale(.985)}100%{opacity:1;transform:scale(1)}}
body.display-slide .flip-digit,body.display-reel .flip-digit,body.display-fade .flip-digit{perspective:none}


/* v3.5 - modelos históricos e prévia ao vivo */
.clock-preview{position:sticky;top:-1px;z-index:4;margin:10px 0 20px;padding:14px 14px 12px;border:1px solid rgba(var(--info-rgb),.25);border-radius:16px;background:rgba(5,5,5,.96);backdrop-filter:blur(10px);box-shadow:0 12px 30px rgba(0,0,0,.35)}
.preview-kicker{font-size:10px;letter-spacing:.18em;color:#666;margin-bottom:8px}.preview-time{display:flex;align-items:center;justify-content:center;gap:2px;min-height:64px;color:rgba(var(--info-rgb),.96);font-family:var(--clock-font);font-weight:var(--digit-weight);letter-spacing:var(--digit-spacing);font-variant-numeric:tabular-nums;text-shadow:0 0 14px rgba(var(--info-rgb),.18)}
.preview-digit{display:inline-grid;place-items:center;min-width:.64em;font-size:clamp(46px,12vw,72px);line-height:1}.preview-colon{font-size:clamp(36px,9vw,56px);line-height:1;opacity:.7;margin:0 1px}.preview-caption{text-align:center;color:#777;font-size:11px;margin-top:5px}.preset-description{min-height:38px}
.preview-digit.preview-flip{animation:previewFlip .45s ease}.preview-digit.preview-slide{animation:previewSlide .34s ease}.preview-digit.preview-reel{animation:previewReel .55s ease}.preview-digit.preview-fade{animation:previewFade .28s ease}.preview-digit.preview-instant{animation:none}
@keyframes previewFlip{0%{transform:rotateX(-78deg);opacity:.4}100%{transform:rotateX(0);opacity:1}}@keyframes previewSlide{0%{transform:translateY(-80%);opacity:.3}100%{transform:translateY(0);opacity:1}}@keyframes previewReel{0%{transform:translateY(-100%);opacity:.2;filter:blur(2px)}70%{filter:blur(.4px)}100%{transform:translateY(0);opacity:1;filter:blur(0)}}@keyframes previewFade{0%{opacity:.15;transform:scale(.98)}100%{opacity:1;transform:scale(1)}}
body.font-numitron{--clock-font:"Arial Narrow",Arial,sans-serif;--digit-weight:400;--digit-spacing:-.025em;--card-radius:8px}body.font-numitron .flip-digit,body.font-numitron .slide-overlay,body.font-numitron .fade-overlay{box-shadow:0 0 0 1px rgba(var(--info-rgb),.14),inset 0 0 24px rgba(var(--info-rgb),.025)}body.font-numitron .digit-half,body.font-numitron .slide-overlay,body.font-numitron .fade-overlay{color:rgba(var(--info-rgb),var(--dim));text-shadow:0 0 4px rgba(var(--info-rgb),.55),0 0 12px rgba(var(--info-rgb),.28),0 0 24px rgba(var(--info-rgb),.12)}body.font-numitron .preview-time{text-shadow:0 0 5px rgba(var(--info-rgb),.58),0 0 16px rgba(var(--info-rgb),.28)}
body.font-led7{--clock-font:"Courier New",Courier,monospace;--digit-weight:900;--digit-spacing:-.12em;--card-radius:5px}body.font-led7 .flip-digit{background:#030303;border:1px solid rgba(var(--info-rgb),.08)}body.font-led7 .digit-half,body.font-led7 .slide-overlay,body.font-led7 .fade-overlay{background:#030303;text-shadow:0 0 3px rgba(var(--info-rgb),.95),0 0 10px rgba(var(--info-rgb),.52),0 0 22px rgba(var(--info-rgb),.18)}body.font-led7 .preview-time{text-shadow:0 0 4px rgba(var(--info-rgb),.9),0 0 14px rgba(var(--info-rgb),.42)}
body.font-vfd{--clock-font:"Lucida Console",Monaco,monospace;--digit-weight:500;--digit-spacing:-.08em;--card-radius:5px}body.font-vfd .flip-digit{background:linear-gradient(180deg,#061012,#020607)}body.font-vfd .digit-half,body.font-vfd .slide-overlay,body.font-vfd .fade-overlay{background:linear-gradient(180deg,#071214,#020708);text-shadow:0 0 4px rgba(var(--info-rgb),.85),0 0 14px rgba(var(--info-rgb),.38)}body.font-vfd .preview-time{text-shadow:0 0 5px rgba(var(--info-rgb),.8),0 0 16px rgba(var(--info-rgb),.32)}
body.font-lcd{--clock-font:"Lucida Console",Monaco,monospace;--digit-weight:700;--digit-spacing:-.11em;--card-radius:3px}body.font-lcd .flip-digit{background:#11140f;box-shadow:0 0 0 1px rgba(var(--info-rgb),.12)}body.font-lcd .digit-half,body.font-lcd .slide-overlay,body.font-lcd .fade-overlay{background:#11140f;text-shadow:none;color:rgba(var(--info-rgb),calc(var(--dim)*.82))}body.font-lcd .preview-time{text-shadow:none;opacity:.84}
body.font-nixie{--clock-font:Georgia,"Times New Roman",serif;--digit-weight:400;--digit-spacing:-.04em;--card-radius:22px}body.font-nixie .flip-digit{background:radial-gradient(circle at 50% 45%,#120805 0%,#070302 60%,#020101 100%);border:1px solid rgba(var(--info-rgb),.12);box-shadow:inset 0 0 22px rgba(var(--info-rgb),.035),0 7px 20px rgba(0,0,0,.8)}body.font-nixie .digit-half,body.font-nixie .slide-overlay,body.font-nixie .fade-overlay{background:transparent;text-shadow:0 0 2px rgba(var(--info-rgb),1),0 0 7px rgba(var(--info-rgb),.75),0 0 18px rgba(var(--info-rgb),.38),0 0 34px rgba(var(--info-rgb),.14)}body.font-nixie .preview-time{text-shadow:0 0 3px rgba(var(--info-rgb),1),0 0 10px rgba(var(--info-rgb),.62),0 0 24px rgba(var(--info-rgb),.26)}
body.display-instant .flip-digit:after{display:none}body.display-instant .digit-top,body.display-instant .digit-bottom{border:0}
@media(max-width:560px){.clock-preview{top:-1px;margin-left:-4px;margin-right:-4px}.preview-time{min-height:58px}}


/* v3.6 - presets históricos nomeados; Wake Lock permanece automático sem botão visível */
body.preset-panasonic6180 .flip-digit{background:linear-gradient(180deg,#041012,#010708)}
body.preset-ge74612a .flip-digit{background:#020202;box-shadow:0 0 0 1px rgba(var(--info-rgb),.10),0 9px 20px rgba(0,0,0,.82)}
body.preset-sonyDream .flip-digit{background:#0d120d}
body.preset-solariCifra3 .flip-digit{border-radius:3px;box-shadow:0 0 0 1px rgba(255,255,255,.035),0 10px 20px rgba(0,0,0,.8)}
body.preset-sony8fc .flip-digit{box-shadow:0 0 0 1px rgba(var(--info-rgb),.10),0 0 16px rgba(212,154,36,.045),0 9px 20px rgba(0,0,0,.78)}
body.preset-ge74612a #clockPreview{box-shadow:inset 0 0 0 1px rgba(120,70,35,.24),0 12px 30px rgba(0,0,0,.35)}
body.preset-panasonic6180 #clockPreview{background:linear-gradient(180deg,rgba(6,18,20,.97),rgba(3,7,8,.97))}
body.preset-sonyDream #clockPreview{background:linear-gradient(180deg,rgba(12,17,12,.97),rgba(4,6,4,.97))}

/* v3.8 — listas suspensas premium */
.select-input{
  -webkit-appearance:none;
  appearance:none;
  min-height:54px;
  padding:0 48px 0 16px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:16px;
  background-color:#0b0b0b;
  background-image:
    linear-gradient(45deg,transparent 50%,rgba(var(--info-rgb),.78) 50%),
    linear-gradient(135deg,rgba(var(--info-rgb),.78) 50%,transparent 50%),
    linear-gradient(to right,rgba(255,255,255,.055),rgba(255,255,255,.055));
  background-position:
    calc(100% - 21px) 23px,
    calc(100% - 15px) 23px,
    calc(100% - 43px) 10px;
  background-size:6px 6px,6px 6px,1px 34px;
  background-repeat:no-repeat;
  color:#ececec;
  font-weight:520;
  letter-spacing:.005em;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 8px 20px rgba(0,0,0,.16);
  transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease,transform .12s ease;
}
.select-input:hover{border-color:rgba(var(--info-rgb),.28);background-color:#0d0d0d}
.select-input:focus{
  outline:none;
  border-color:rgba(var(--info-rgb),.62);
  box-shadow:0 0 0 3px rgba(var(--info-rgb),.10),inset 0 1px 0 rgba(255,255,255,.03),0 10px 24px rgba(0,0,0,.20);
}
.select-input:active{transform:scale(.997)}
.select-input option,.select-input optgroup{background:#101010;color:#ededed}
.select-input optgroup{font-weight:700;color:#b9b9b9}
.field-label+ .select-input{margin-top:2px}

/* deixa as listas especialmente claras no painel escuro */
#clockPreset,#displayMode,#fontStyle,#colorPreset,#flipSpeed,#alarmRepeat,#alarmSound,#snoozeMinutes{
  background-color:#0a0a0a;
}

/* campo de cor personalizada aparece como complemento elegante */
#colorPicker{
  margin-top:10px;
  border-radius:14px;
  border-color:rgba(var(--info-rgb),.20);
  background:#090909;
}

@media(max-width:560px){
  .select-input{min-height:52px;border-radius:15px;padding-left:14px;font-size:15px}
}

/* v3.10 — movimentos mecânicos mais realistas + velocidades bem distintas */
.flip-digit.slide-active .digit-half>span,.flip-digit.reel-active .digit-half>span{opacity:0}
.slide-overlay.slide{background:transparent;will-change:transform,opacity,filter}
.slide-overlay.slide.old{transform:translateY(0);opacity:1}
.slide-overlay.slide.new{transform:translateY(-100%);opacity:1}
.slide-overlay.slide.old.animate{animation:slideOldV310 var(--slide-duration,300ms) cubic-bezier(.32,.02,.22,1) forwards}
.slide-overlay.slide.new.animate{animation:slideNewV310 var(--slide-duration,300ms) cubic-bezier(.32,.02,.22,1) forwards}
@keyframes slideOldV310{0%{transform:translateY(0);opacity:1;filter:brightness(1)}58%{opacity:1;filter:brightness(.94)}100%{transform:translateY(100%);opacity:.92;filter:brightness(.82)}}
@keyframes slideNewV310{0%{transform:translateY(-100%);opacity:.92;filter:brightness(.82)}42%{opacity:1;filter:brightness(.94)}100%{transform:translateY(0);opacity:1;filter:brightness(1)}}

body.display-reel .flip-digit{perspective:420px;perspective-origin:50% 50%;background:radial-gradient(ellipse at center,#0d0d0d 0%,#070707 58%,#020202 100%);box-shadow:0 0 0 1px rgba(var(--info-rgb),calc(var(--dim-faint)*.65)),0 12px 24px rgba(0,0,0,.82),inset 0 14px 24px rgba(255,255,255,.018),inset 0 -16px 26px rgba(0,0,0,.62)}
body.display-reel .flip-digit:before{content:"";position:absolute;inset:0;z-index:10;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,.72) 0%,rgba(0,0,0,.22) 16%,transparent 39%,transparent 61%,rgba(0,0,0,.22) 84%,rgba(0,0,0,.76) 100%);box-shadow:inset 0 10px 16px rgba(255,255,255,.012),inset 0 -10px 18px rgba(0,0,0,.52)}
.slide-overlay.reel{background:transparent;transform-style:preserve-3d;backface-visibility:hidden;-webkit-backface-visibility:hidden;will-change:transform,filter,opacity}
.slide-overlay.reel.old{transform:translateY(0) rotateX(0deg) scaleY(1);transform-origin:50% 62%;opacity:1}
.slide-overlay.reel.new{transform:translateY(-100%) rotateX(72deg) scaleY(.48);transform-origin:50% 38%;opacity:.52}
.slide-overlay.reel.old.animate{animation:reelOldV310 var(--slide-duration,430ms) cubic-bezier(.33,.02,.28,1) forwards}
.slide-overlay.reel.new.animate{animation:reelNewV310 var(--slide-duration,430ms) cubic-bezier(.22,.45,.2,1) forwards}
@keyframes reelOldV310{0%{transform:translateY(0) rotateX(0deg) scaleY(1);filter:brightness(1);opacity:1}45%{transform:translateY(40%) rotateX(-30deg) scaleY(.88);filter:brightness(.78);opacity:.96}72%{transform:translateY(70%) rotateX(-52deg) scaleY(.67);filter:brightness(.58);opacity:.75}100%{transform:translateY(103%) rotateX(-78deg) scaleY(.4);filter:brightness(.34);opacity:.24}}
@keyframes reelNewV310{0%{transform:translateY(-103%) rotateX(78deg) scaleY(.4);filter:brightness(.34);opacity:.24}28%{transform:translateY(-70%) rotateX(52deg) scaleY(.67);filter:brightness(.58);opacity:.75}55%{transform:translateY(-40%) rotateX(30deg) scaleY(.88);filter:brightness(.78);opacity:.96}100%{transform:translateY(0) rotateX(0deg) scaleY(1);filter:brightness(1);opacity:1}}

body.display-flip .flip-digit{perspective:980px;perspective-origin:50% 46%}
body.display-flip .flip-digit:before{content:"";position:absolute;left:0;right:0;top:calc(50% - 5px);height:10px;z-index:7;pointer-events:none;background:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.34) 38%,rgba(0,0,0,.9) 49%,rgba(255,255,255,.025) 53%,rgba(0,0,0,.26) 66%,transparent 100%)}
.flip-overlay.top,.flip-overlay.bottom{transform-style:preserve-3d;will-change:transform,filter}
.flip-overlay.top:after,.flip-overlay.bottom:after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;z-index:2}
.flip-overlay.top:after{background:linear-gradient(180deg,rgba(255,255,255,.015),rgba(0,0,0,.7))}
.flip-overlay.bottom:after{background:linear-gradient(180deg,rgba(0,0,0,.72),rgba(255,255,255,.012))}
.flip-overlay.top.animate{animation:flipTopRealV310 var(--flip-duration,500ms) cubic-bezier(.42,.02,.78,.58) forwards}
.flip-overlay.bottom.animate{animation:flipBottomRealV310 var(--flip-duration,500ms) cubic-bezier(.16,.48,.18,1) forwards;animation-delay:calc(var(--flip-duration,500ms)*.46)}
.flip-overlay.top.animate:after{animation:flipShadowTopV310 var(--flip-duration,500ms) linear forwards}
.flip-overlay.bottom.animate:after{animation:flipShadowBottomV310 var(--flip-duration,500ms) linear forwards;animation-delay:calc(var(--flip-duration,500ms)*.46)}
@keyframes flipTopRealV310{0%{transform:rotateX(0deg) translateZ(0);filter:brightness(1)}34%{filter:brightness(.86)}72%{filter:brightness(.58)}100%{transform:rotateX(-90deg) translateZ(1px);filter:brightness(.34)}}
@keyframes flipBottomRealV310{0%{transform:rotateX(90deg) translateZ(1px);filter:brightness(.38)}55%{filter:brightness(.76)}82%{transform:rotateX(-4deg);filter:brightness(1.03)}93%{transform:rotateX(1.5deg);filter:brightness(.98)}100%{transform:rotateX(0deg);filter:brightness(1)}}
@keyframes flipShadowTopV310{0%{opacity:.05}65%{opacity:.58}100%{opacity:.84}}
@keyframes flipShadowBottomV310{0%{opacity:.82}60%{opacity:.32}100%{opacity:0}}
.flip-digit.flip-impact{animation:flipImpactV310 130ms ease-out}
@keyframes flipImpactV310{0%{transform:scaleY(1)}42%{transform:scaleY(.985)}100%{transform:scaleY(1)}}

.preview-digit.preview-flip{animation:previewFlipV310 .58s cubic-bezier(.16,.48,.18,1)}
.preview-digit.preview-slide{animation:previewSlideV310 .42s cubic-bezier(.32,.02,.22,1)}
.preview-digit.preview-reel{animation:previewReelV310 .62s cubic-bezier(.22,.45,.2,1)}
@keyframes previewFlipV310{0%{transform:perspective(240px) rotateX(82deg);opacity:.35;filter:brightness(.5)}78%{transform:perspective(240px) rotateX(-3deg);opacity:1}100%{transform:perspective(240px) rotateX(0);opacity:1;filter:brightness(1)}}
@keyframes previewSlideV310{0%{transform:translateY(-90%);opacity:.65}100%{transform:translateY(0);opacity:1}}
@keyframes previewReelV310{0%{transform:perspective(220px) translateY(-84%) rotateX(66deg) scaleY(.55);opacity:.35;filter:brightness(.5)}60%{transform:perspective(220px) translateY(-18%) rotateX(18deg) scaleY(.9);opacity:.9}100%{transform:perspective(220px) translateY(0) rotateX(0) scaleY(1);opacity:1;filter:brightness(1)}}

@media(prefers-reduced-motion:reduce){.slide-overlay.slide.animate,.slide-overlay.reel.animate,.flip-overlay.top.animate,.flip-overlay.bottom.animate,.flip-digit.flip-impact{animation-duration:1ms!important;animation-delay:0ms!important}}
\n\n/* v3.12 — transições proporcionais por algarismo */\n.flip-digit.progressive-slide .digit-half>span,.flip-digit.progressive-reel .digit-half>span,.flip-digit.progressive-fade .digit-half>span,.flip-digit.progressive-instant .digit-half>span{opacity:0}\n.slide-overlay.progressive,.fade-overlay.progressive,.flip-overlay.progressive{animation:none!important;transition:none!important}\n.flip-digit.progressive-slide .slide-overlay,.flip-digit.progressive-reel .slide-overlay{pointer-events:none}\n.flip-digit.progressive-fade .fade-overlay,.flip-digit.progressive-instant .fade-overlay{pointer-events:none;will-change:opacity}\n.flip-digit.progressive-flip .flip-overlay.top:after{opacity:var(--progress-shadow-top,0)!important}\n.flip-digit.progressive-flip .flip-overlay.bottom:after{opacity:var(--progress-shadow-bottom,0)!important}\n.flip-digit.progressive-flip .flip-overlay{animation:none!important}\nbody.display-instant .fade-overlay.progressive{z-index:9}\n

/* v3.13 — configurações em painel lateral com relógio visível */
:root{--settings-drawer-width:clamp(280px,28vw,340px)}
.panel{
  inset:0 0 0 auto;
  width:var(--settings-drawer-width);
  max-width:calc(100vw - 92px);
  transform:translateX(105%);
  transition:transform .3s cubic-bezier(.22,.72,.22,1),box-shadow .3s ease;
  border-left:1px solid rgba(255,255,255,.08);
  box-shadow:-22px 0 46px rgba(0,0,0,.0);
  background:rgba(5,5,5,.97);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  overscroll-behavior:contain;
}
.panel.open{transform:translateX(0);box-shadow:-22px 0 46px rgba(0,0,0,.55)}
.panel-head{position:sticky;top:calc(-1 * max(22px,env(safe-area-inset-top)));z-index:12;margin:-1px -22px 14px;padding:max(22px,env(safe-area-inset-top)) 22px 16px;background:linear-gradient(180deg,rgba(5,5,5,.99) 72%,rgba(5,5,5,.92));border-bottom:1px solid rgba(255,255,255,.055)}
.screen{transition:padding-right .3s cubic-bezier(.22,.72,.22,1)}
@media (min-width:701px){
  .screen.panel-open{padding-right:calc(var(--settings-drawer-width) + 12px)}
  .screen.panel-open .bottom-actions{left:calc((100% - var(--settings-drawer-width))/2)}
  .screen.panel-open .top-controls{right:calc(var(--settings-drawer-width) + 10px)}
}
@media (max-width:700px){
  :root{--settings-drawer-width:min(72vw,310px)}
  .panel{max-width:calc(100vw - 92px);padding-left:16px;padding-right:16px}
  .panel-head{margin-left:-16px;margin-right:-16px;padding-left:16px;padding-right:16px}
}
@media (max-width:420px){:root{--settings-drawer-width:min(74vw,280px)}}

@media (orientation:landscape) and (max-height:620px){
  :root{--settings-drawer-width:clamp(220px,25vw,280px)}
  .panel{padding-left:14px;padding-right:14px}
  .panel-head{margin-left:-14px;margin-right:-14px;padding-left:14px;padding-right:14px}
  .settings-section h2{margin-top:20px}
  .field-label{margin-top:14px}
  .select-input,.text-input{min-height:44px}
}

.live-preview-note{margin:7px 0 2px;color:rgba(var(--info-rgb),.72);font-size:12px;line-height:1.4}


/* v3.15 — elimina camadas fantasmas nos modos progressivos */
.flip-digit.progressive-slide .digit-half,
.flip-digit.progressive-reel .digit-half,
.flip-digit.progressive-fade .digit-half,
.flip-digit.progressive-instant .digit-half{opacity:0!important;visibility:hidden!important}
.flip-digit.progressive-slide .slide-overlay.slide.progressive,
.flip-digit.progressive-reel .slide-overlay.reel.progressive{z-index:12}
.flip-digit.progressive-slide .slide-overlay.slide.progressive{background:transparent}
.flip-digit.progressive-reel .slide-overlay.reel.progressive{background:transparent}


/* v3.16 — Spotify totalmente preto no modo noturno até o toque */
#spotifyBtn.stealth-black{
  background:#000!important;
  border-color:#000!important;
  color:#000!important;
  box-shadow:none!important;
}
#spotifyBtn.stealth-black .spotify-mark,
#spotifyBtn.stealth-black .spotify-mark:after{
  border-color:#000!important;
  background:#000!important;
}


/* v3.17 — aproxima os algarismos para leitura mais clara */
@media(orientation:landscape){
  .flip-clock{gap:clamp(1px,.42vw,4px)}
  .time-group{gap:1px}
  .colon{width:clamp(5px,1.15vw,8px)}
}
@media(max-width:560px){
  .flip-clock{gap:clamp(1px,.55vw,4px)}
  .time-group{gap:1px}
  .colon{width:6px}
}


/* v3.18 — painel lateral mais estreito em paisagem */
@media (orientation:landscape) and (max-height:620px){
  :root{--settings-drawer-width:clamp(220px,25vw,280px)}
}


/* v3.19 — mobile paisagem, listas flutuantes, fonte normal e escala inteligente */
.native-select-hidden{display:none!important}
.yako-select-host{position:relative;width:100%;margin-top:2px}
.yako-select-button{width:100%;min-height:54px;padding:0 46px 0 16px;border:1px solid rgba(255,255,255,.10);border-radius:16px;background:#0a0a0a;color:#ececec;text-align:left;font-weight:520;letter-spacing:.005em;position:relative;box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 8px 20px rgba(0,0,0,.16);transition:border-color .18s ease,box-shadow .18s ease,background .18s ease,transform .12s ease}
.yako-select-button:after{content:"";position:absolute;right:18px;top:50%;width:8px;height:8px;border-right:2px solid rgba(var(--info-rgb),.78);border-bottom:2px solid rgba(var(--info-rgb),.78);transform:translateY(-65%) rotate(45deg);transition:transform .18s ease}
.yako-select-button.open:after{transform:translateY(-25%) rotate(225deg)}
.yako-select-button:focus-visible{outline:none;border-color:rgba(var(--info-rgb),.62);box-shadow:0 0 0 3px rgba(var(--info-rgb),.10),0 10px 24px rgba(0,0,0,.25)}
.yako-select-menu{position:fixed;z-index:80;overflow:auto;overscroll-behavior:contain;padding:7px;border:1px solid rgba(var(--info-rgb),.28);border-radius:16px;background:rgba(8,8,8,.98);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 18px 54px rgba(0,0,0,.72),inset 0 1px 0 rgba(255,255,255,.035);animation:yakoMenuIn .16s ease-out}
@keyframes yakoMenuIn{from{opacity:0;transform:translateY(-5px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
.yako-select-group{padding:8px 11px 5px;color:#6e6e6e;font-size:10px;font-weight:750;letter-spacing:.12em;text-transform:uppercase}
.yako-select-option{display:flex;width:100%;min-height:44px;align-items:center;padding:9px 12px;border:0;border-radius:11px;background:transparent;color:#d7d7d7;text-align:left;line-height:1.25}
.yako-select-option:hover,.yako-select-option:focus-visible{outline:none;background:rgba(var(--info-rgb),.08)}
.yako-select-option.selected{background:rgba(var(--info-rgb),.16);color:rgb(var(--info-rgb));font-weight:650}
.yako-select-option.selected:after{content:"✓";margin-left:auto;padding-left:10px}
body.font-plain .digit-half,body.font-plain .flip-overlay,body.font-plain .slide-overlay,body.font-plain .fade-overlay{ text-shadow:none!important;filter:none }
body.font-plain .preview-time{ text-shadow:none!important }
.alarm-weekdays{margin-top:4px}

/* No celular deitado, TODAS as camadas usam a mesma métrica. Corrige números grandes fora dos cartões. */
@media (orientation:landscape) and (max-height:620px){
  .flip-digit{width:clamp(38px,12.5vh,72px);height:clamp(62px,20vh,112px)}
  .digit-half>span,.flip-overlay>span,.slide-overlay>span,.fade-overlay>span{font-size:clamp(50px,16.4vh,94px)}
  .colon{height:clamp(62px,20vh,112px);width:clamp(4px,1.05vw,8px)}
  .colon span{width:clamp(4px,1.2vh,7px);height:clamp(4px,1.2vh,7px)}
  .date{font-size:clamp(14px,3.6vh,20px);margin-top:7px}
  .sun-row,.alarm-row{font-size:clamp(12px,3.1vh,17px)}
  .info-lines{margin-top:7px;gap:2px}
}
@media(max-width:560px){.yako-select-button{min-height:52px;border-radius:15px;padding-left:14px;font-size:15px}.yako-select-menu{border-radius:15px}.yako-select-option{min-height:46px}}


/* v3.21 — leitura mais compacta e transições sem vazio no meio */
.flip-clock{gap:0!important}
.time-group{gap:0!important}
.time-group .flip-digit + .flip-digit{margin-left:-2px}
.colon{width:clamp(4px,.82vw,7px)!important;margin-inline:-1px}
.slide-overlay.progressive{will-change:clip-path,transform,filter,opacity}
@media(orientation:landscape){
  .flip-clock{gap:0!important}
  .time-group{gap:0!important}
  .time-group .flip-digit + .flip-digit{margin-left:-3px}
  .colon{width:clamp(3px,.72vw,6px)!important;margin-inline:-1px}
}
@media(orientation:landscape) and (max-height:620px){
  .flip-digit{width:clamp(36px,11.8vh,68px)}
  .time-group .flip-digit + .flip-digit{margin-left:-3px}
  .colon{width:clamp(3px,.7vw,5px)!important;margin-inline:-1px}
}


/* v3.22 — distância fixa entre algarismos; somente a velocidade varia */
.flip-digit.progressive-slide,.flip-digit.progressive-reel{overflow:hidden!important}
.flip-digit.progressive-slide .slide-overlay.progressive,
.flip-digit.progressive-reel .slide-overlay.progressive{
  inset:0!important;
  width:100%!important;
  height:100%!important;
  margin:0!important;
  padding:0!important;
}
.flip-digit.progressive-slide .slide-overlay.progressive>span,
.flip-digit.progressive-reel .slide-overlay.progressive>span{
  width:100%!important;
  height:100%!important;
  margin:0!important;
  padding:0!important;
}


/* v3.23 — sequência vertical praticamente encostada, sem vazios nas transições */
.flip-digit.progressive-slide .slide-overlay.progressive,
.flip-digit.progressive-reel .slide-overlay.progressive{
  overflow:hidden!important;
}
.flip-digit.progressive-slide .slide-overlay.progressive>span,
.flip-digit.progressive-reel .slide-overlay.progressive>span{
  transform:scaleY(1.035);
  transform-origin:center;
}


/* v3.24 — brilho noturno uniforme + escala proporcional de todo o conjunto */
.clock-wrap .digit-half,
.clock-wrap .flip-overlay,
.clock-wrap .slide-overlay,
.clock-wrap .fade-overlay{color:rgb(var(--info-rgb))!important}
.clock-wrap .colon span{background:rgb(var(--info-rgb))}
.clock-wrap .alarm-icon{color:rgb(var(--info-rgb))}
.clock-wrap .date,
.clock-wrap .sun-row,
.clock-wrap .alarm-row,
.clock-wrap .alarm-days-display{color:rgb(var(--info-rgb))}
.clock-wrap .date{white-space:nowrap}
.clock-wrap .sun-row,
.clock-wrap .alarm-row,
.clock-wrap .alarm-days-display{white-space:nowrap}


/* v3.26 — números inteiros em fita contínua; remove o recorte que criava faixas pretas */
.flip-digit.progressive-slide,
.flip-digit.progressive-reel{overflow:hidden!important}
.flip-digit.progressive-slide .slide-overlay.progressive,
.flip-digit.progressive-reel .slide-overlay.progressive{
  clip-path:none!important;
  overflow:visible!important;
  background:transparent!important;
  will-change:transform,filter!important;
}
.flip-digit.progressive-slide .slide-overlay.progressive>span,
.flip-digit.progressive-reel .slide-overlay.progressive>span{
  transform-origin:center center;
}

.alarm-row + .alarm-days-display{padding-top:1px}


/* v3.31 — dias e horário do alarme editáveis na própria tela do relógio */
.alarm-row-editable{cursor:pointer;border-radius:12px;padding:2px 7px;transition:background .16s ease,transform .12s ease}
.alarm-row-editable:active{transform:scale(.985);background:rgba(var(--info-rgb),.07)}
.alarm-days-display{display:flex!important;align-items:center;justify-content:center;gap:5px;flex-wrap:nowrap;margin-top:5px}
.main-alarm-day{min-width:30px;height:26px;padding:0 6px;border:1px solid rgba(var(--info-rgb),.16);border-radius:999px;background:#000;color:#090909;font:inherit;font-size:.78em;font-weight:750;line-height:1;opacity:.95;transition:background .16s ease,color .16s ease,border-color .16s ease,transform .12s ease,box-shadow .16s ease}
.main-alarm-day:active{transform:scale(.92)}
.main-alarm-day.active{background:rgb(var(--info-rgb));border-color:rgb(var(--info-rgb));color:#050505;box-shadow:0 0 10px rgba(var(--info-rgb),.10)}
body.mode-night .main-alarm-day:not(.active){background:#000;color:#000;border-color:#000}
.time-editor-overlay{position:fixed;inset:0;z-index:45;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(0,0,0,.72);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);opacity:0;pointer-events:none;transition:opacity .18s ease}
.time-editor-overlay.active{opacity:1;pointer-events:auto}
.time-editor-card{width:min(420px,94vw);padding:22px;border:1px solid rgba(var(--info-rgb),.22);border-radius:22px;background:#080808;color:#ddd;box-shadow:0 22px 70px rgba(0,0,0,.72)}
.time-editor-card>small{display:block;color:rgba(var(--info-rgb),.72);font-size:10px;font-weight:750;letter-spacing:.18em}
.time-editor-card h2{margin:5px 0 20px;font-size:24px;font-weight:700}
.time-editor-fields{display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:10px}
.time-editor-field label{display:block;margin:0 0 7px;color:#777;font-size:12px}
.time-editor-separator{padding-bottom:13px;color:rgb(var(--info-rgb));font-size:28px;font-weight:700}
.time-editor-actions{display:grid;grid-template-columns:1fr 1.25fr;gap:9px;margin-top:20px}
.time-editor-actions button{min-height:48px;border-radius:14px;border:1px solid #232323;background:#0d0d0d;color:#aaa;font-weight:650}
.time-editor-actions button.primary{border-color:rgba(var(--info-rgb),.5);background:rgba(var(--info-rgb),.14);color:rgb(var(--info-rgb))}
@media(orientation:landscape) and (max-height:620px){.main-alarm-day{min-width:26px;height:23px;padding:0 5px;font-size:.72em}.alarm-days-display{gap:3px;margin-top:2px}.time-editor-card{width:min(390px,74vw);padding:17px}.time-editor-card h2{margin-bottom:13px}.time-editor-actions{margin-top:14px}}


/* v3.32 — zoom por pinça no conjunto do relógio */
.clock-wrap.pinch-zooming{transition:opacity .2s ease!important;will-change:transform}


/* v3.33 — opção de movimento normal e fonte LED clássica de rádio-relógio */
body.font-ledclassic{--clock-font:"Courier New",Courier,monospace;--digit-weight:900;--digit-spacing:-.14em;--card-radius:4px}
body.font-ledclassic .flip-digit{background:#030303;border:1px solid rgba(var(--info-rgb),.12);box-shadow:inset 0 0 0 1px rgba(255,255,255,.015), inset 0 8px 18px rgba(255,255,255,.015)}
body.font-ledclassic .digit-half,
body.font-ledclassic .slide-overlay,
body.font-ledclassic .fade-overlay{background:#030303;color:rgb(var(--info-rgb));text-shadow:0 0 1px rgba(255,255,255,.18),0 0 4px rgba(var(--info-rgb),.98),0 0 10px rgba(var(--info-rgb),.70),0 0 20px rgba(var(--info-rgb),.24);filter:saturate(1.22) contrast(1.08)}
body.font-ledclassic .digit-half>span,
body.font-ledclassic .slide-overlay>span,
body.font-ledclassic .fade-overlay>span,
body.font-ledclassic .flip-overlay>span{display:inline-block;transform:scaleY(1.02);letter-spacing:-.11em}
body.font-ledclassic .preview-time{text-shadow:0 0 1px rgba(255,255,255,.16),0 0 5px rgba(var(--info-rgb),.92),0 0 14px rgba(var(--info-rgb),.46)}


/* v3.35 — LED clássico com algarismos realmente segmentados */
body.font-ledclassic{--clock-font:Arial,Helvetica,sans-serif;--digit-weight:700;--digit-spacing:0;--card-radius:4px}
body.font-ledclassic .digit-half>span,
body.font-ledclassic .slide-overlay>span,
body.font-ledclassic .fade-overlay>span,
body.font-ledclassic .flip-overlay>span{display:flex;align-items:center;justify-content:center;letter-spacing:0!important;transform:none!important}
body.font-ledclassic .seg7-svg{width:84%;height:84%;overflow:visible;display:block;filter:drop-shadow(0 0 1px rgba(255,255,255,.26)) drop-shadow(0 0 5px rgba(var(--info-rgb),.88)) drop-shadow(0 0 12px rgba(var(--info-rgb),.42))}
body.font-ledclassic .seg7-svg .seg7-on{fill:currentColor;stroke:rgba(255,255,255,.18);stroke-width:1.35;stroke-linejoin:round;paint-order:stroke fill markers}
body.font-ledclassic .flip-digit{background:#050505;border:1px solid rgba(var(--info-rgb),.12);box-shadow:inset 0 0 0 1px rgba(255,255,255,.015), inset 0 8px 18px rgba(255,255,255,.02),0 10px 24px rgba(0,0,0,.84)}
body.font-ledclassic .digit-half,body.font-ledclassic .slide-overlay,body.font-ledclassic .fade-overlay,body.font-ledclassic .flip-overlay{background:#050505;color:rgba(var(--info-rgb),var(--clock-brightness));text-shadow:none!important}
body.font-ledclassic .preview-time{text-shadow:0 0 5px rgba(var(--info-rgb),.64),0 0 14px rgba(var(--info-rgb),.3)}


/* v3.36 — controles rápidos na tela principal + rádio-relógio clássico */
.quick-settings{
  position:fixed;left:50%;bottom:max(72px,calc(env(safe-area-inset-bottom) + 62px));transform:translateX(-50%);
  z-index:4;display:flex;align-items:flex-end;gap:7px;max-width:calc(100vw - 22px);padding:8px;
  border:1px solid rgba(255,255,255,.075);border-radius:18px;background:rgba(5,5,5,.74);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 10px 34px rgba(0,0,0,.38);
  transition:opacity .2s ease,transform .2s ease;overflow-x:auto;overflow-y:visible;scrollbar-width:none
}
.quick-settings::-webkit-scrollbar{display:none}
.quick-setting{flex:0 0 auto;min-width:118px;max-width:170px}
.quick-setting:first-child{min-width:168px;max-width:210px}
.quick-label{display:block;margin:0 0 4px 8px;color:#777;font-size:9px;font-weight:750;letter-spacing:.095em;text-transform:uppercase;white-space:nowrap}
.quick-label strong{color:rgb(var(--info-rgb));font-weight:750}
.quick-settings .yako-select-host{margin:0}
.quick-settings .yako-select-button{min-height:35px;padding:0 29px 0 10px;border-radius:11px;font-size:11px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:rgba(14,14,14,.94)}
.quick-settings .yako-select-button:after{right:11px;width:6px;height:6px;border-width:1.5px}
.quick-brightness{min-width:126px;padding:0 8px 4px}
.quick-brightness input[type=range]{display:block;width:118px;height:30px;margin:0;accent-color:rgb(var(--info-rgb))}
body.mode-night .quick-settings{display:flex}
body.settings-open .quick-settings{opacity:.12;pointer-events:none}
body.font-ledclassic .seg7-svg{width:90%;height:88%;filter:drop-shadow(0 0 1px rgba(255,235,220,.34)) drop-shadow(0 0 4px rgba(var(--info-rgb),.96)) drop-shadow(0 0 11px rgba(var(--info-rgb),.52)) drop-shadow(0 0 20px rgba(var(--info-rgb),.18))}
body.font-ledclassic .seg7-svg .seg7-on{stroke:rgba(255,225,205,.25);stroke-width:1.6}
body.preset-classicRadioClock .flip-digit{background:linear-gradient(180deg,#060404 0%,#010101 100%);border-color:rgba(var(--info-rgb),.12);box-shadow:inset 0 0 25px rgba(var(--info-rgb),.025),0 10px 28px rgba(0,0,0,.86)}
body.preset-classicRadioClock .colon span{box-shadow:0 0 4px rgba(var(--info-rgb),.9),0 0 12px rgba(var(--info-rgb),.42)}
@media(orientation:landscape) and (max-height:620px){
  .quick-settings{bottom:max(54px,calc(env(safe-area-inset-bottom) + 48px));padding:6px;gap:5px;border-radius:15px;max-width:calc(100vw - 18px)}
  .quick-setting{min-width:106px;max-width:142px}.quick-setting:first-child{min-width:145px;max-width:182px}
  .quick-settings .yako-select-button{min-height:31px;font-size:10px;border-radius:9px}
  .quick-label{font-size:8px;margin-left:6px}.quick-brightness{min-width:112px}.quick-brightness input[type=range]{width:104px;height:26px}
}
@media(max-width:560px) and (orientation:portrait){
  .quick-settings{bottom:max(76px,calc(env(safe-area-inset-bottom) + 66px));max-width:calc(100vw - 14px);border-radius:16px}
  .quick-setting{min-width:118px}.quick-setting:first-child{min-width:160px}
}


/* v3.37 — separadores adaptativos, controles por toque e textos limitados */
.clock-wrap .colon{opacity:1!important;filter:brightness(1.18);transition:filter .2s ease,opacity .2s ease}
.clock-wrap .colon span{background:rgb(var(--info-rgb))!important;opacity:1!important;box-shadow:0 0 5px rgba(var(--info-rgb),.78),0 0 12px rgba(var(--info-rgb),.30)}
body.mode-night .clock-wrap .colon{filter:brightness(2.15) saturate(1.12)}
body.font-mechanical .colon span,body.font-radio70 .colon span{border-radius:50%;width:clamp(5px,1.35vw,9px);height:clamp(5px,1.35vw,9px)}
body.font-ledclassic .colon span,body.font-led7 .colon span{border-radius:2px;width:clamp(5px,1.18vw,8px);height:clamp(9px,2vw,14px);box-shadow:0 0 4px rgba(var(--info-rgb),.98),0 0 11px rgba(var(--info-rgb),.58),0 0 20px rgba(var(--info-rgb),.20)}
body.font-vfd .colon span{border-radius:999px;width:clamp(5px,1.15vw,8px);height:clamp(7px,1.55vw,11px);box-shadow:0 0 5px rgba(var(--info-rgb),.95),0 0 15px rgba(var(--info-rgb),.46)}
body.font-lcd .colon span{border-radius:1px;width:clamp(5px,1.05vw,7px);height:clamp(7px,1.45vw,10px);box-shadow:none!important;filter:contrast(1.2)}
body.font-nixie .colon span{border-radius:50%;width:clamp(5px,1.25vw,8px);height:clamp(5px,1.25vw,8px);box-shadow:0 0 3px rgba(var(--info-rgb),1),0 0 9px rgba(var(--info-rgb),.78),0 0 18px rgba(var(--info-rgb),.30)}
body.font-modern .colon span,body.font-plain .colon span{border-radius:50%;width:clamp(4px,.95vw,7px);height:clamp(4px,.95vw,7px);box-shadow:0 0 6px rgba(var(--info-rgb),.46)}

.quick-settings.controls-hidden{opacity:0!important;pointer-events:none!important;transform:translate(-50%,10px)!important}

/* Informações seguem o zoom só até 125%, que corresponde a 50% do antigo teto de 250%. */
.clock-wrap .date,.clock-wrap .info-lines{transform:scale(var(--info-counter-scale,1));transform-origin:top center}
.clock-wrap .date{margin-top:calc(28px * var(--info-counter-scale,1))}
.clock-wrap .info-lines{margin-top:calc(26px * var(--info-counter-scale,1));gap:calc(8px * var(--info-counter-scale,1))}
@media(max-width:380px){.clock-wrap .date{margin-top:calc(20px * var(--info-counter-scale,1))}.clock-wrap .info-lines{margin-top:calc(18px * var(--info-counter-scale,1))}}
@media(orientation:landscape){.clock-wrap .date{margin-top:calc(14px * var(--info-counter-scale,1))}.clock-wrap .info-lines{margin-top:calc(14px * var(--info-counter-scale,1));gap:calc(4px * var(--info-counter-scale,1))}}


/* v3.38 — controles noturnos mais fáceis de localizar ao tocar na tela */
body.mode-night #nightBtn{
  color:rgb(var(--info-rgb))!important;
  border-color:rgba(var(--info-rgb),.88)!important;
  background:rgba(var(--info-rgb),.20)!important;
  box-shadow:0 0 0 1px rgba(var(--info-rgb),.16),0 0 18px rgba(var(--info-rgb),.30)!important;
  opacity:1!important;
  font-weight:750;
}
body.mode-night #nightBtn .spotify-mark{opacity:1}
body.mode-night #fullscreenQuickBtn{
  width:88px!important;
  height:88px!important;
  min-width:88px!important;
  min-height:88px!important;
  font-size:42px!important;
  color:rgb(var(--info-rgb))!important;
  background:rgba(var(--info-rgb),.16)!important;
  border:2px solid rgba(var(--info-rgb),.72)!important;
  box-shadow:0 0 0 1px rgba(var(--info-rgb),.10),0 0 22px rgba(var(--info-rgb),.28)!important;
  opacity:1!important;
}
body.mode-night .top-controls{gap:8px}
body.mode-night #settingsBtn{
  color:rgba(var(--info-rgb),.92)!important;
  background:rgba(var(--info-rgb),.08)!important;
}
@media(orientation:landscape) and (max-height:620px){
  body.mode-night #fullscreenQuickBtn{width:76px!important;height:76px!important;min-width:76px!important;min-height:76px!important;font-size:36px!important}
}




/* v3.41 — centralização reforçada também no desktop */
/* O relógio principal é o foco: deslocamos o conjunto para baixo e abrimos uma faixa visual maior para as informações secundárias. */
.clock-wrap{margin-top:5.5vh}
.clock-wrap .date{margin-top:calc(34px * var(--info-counter-scale,1))}
.clock-wrap .info-lines{margin-top:calc(30px * var(--info-counter-scale,1));gap:calc(9px * var(--info-counter-scale,1))}

@media(min-width:900px){
  .clock-wrap{margin-top:7vh}
  .clock-wrap .date{margin-top:calc(40px * var(--info-counter-scale,1))}
  .clock-wrap .info-lines{margin-top:calc(34px * var(--info-counter-scale,1));gap:calc(10px * var(--info-counter-scale,1))}
}

@media(orientation:landscape) and (max-height:620px){
  .clock-wrap{margin-top:3.2vh}
  .clock-wrap .date{margin-top:calc(20px * var(--info-counter-scale,1))}
  .clock-wrap .info-lines{margin-top:calc(18px * var(--info-counter-scale,1));gap:calc(5px * var(--info-counter-scale,1))}
}

@media(max-width:560px) and (orientation:portrait){
  .clock-wrap{margin-top:4.5vh}
  .clock-wrap .date{margin-top:calc(28px * var(--info-counter-scale,1))}
  .clock-wrap .info-lines{margin-top:calc(24px * var(--info-counter-scale,1))}
}


/* v3.42 — data e nascer do sol acima; alarme abaixo para centralizar melhor o relógio */
.top-info.info-lines{margin-top:0!important;margin-bottom:calc(18px * var(--info-counter-scale,1));gap:calc(6px * var(--info-counter-scale,1))}
.bottom-info.info-lines{margin-top:calc(24px * var(--info-counter-scale,1))!important;gap:calc(8px * var(--info-counter-scale,1))}
.top-info .date{margin-top:0!important}
.top-info .sun-row,.bottom-info .alarm-row,.bottom-info .alarm-days-display{text-align:center}
@media(min-width:900px){
  .top-info.info-lines{margin-bottom:calc(24px * var(--info-counter-scale,1))}
  .bottom-info.info-lines{margin-top:calc(30px * var(--info-counter-scale,1))!important}
}
@media(orientation:landscape){
  .top-info.info-lines{margin-bottom:calc(12px * var(--info-counter-scale,1))}
  .bottom-info.info-lines{margin-top:calc(16px * var(--info-counter-scale,1))!important}
}
@media(max-width:380px){
  .top-info.info-lines{margin-bottom:calc(10px * var(--info-counter-scale,1))}
  .bottom-info.info-lines{margin-top:calc(14px * var(--info-counter-scale,1))!important}
}


/* v3.43 — informações fixas acima/abaixo e tamanho independente */
.top-fixed-info,.bottom-fixed-info{position:absolute;left:50%;transform:translateX(-50%) scale(var(--info-scale,1));transform-origin:center center;display:flex;flex-direction:column;align-items:center;z-index:2;color:rgb(var(--info-rgb));width:max-content;max-width:calc(100vw - 28px);pointer-events:auto}
.top-fixed-info{top:max(58px,calc(env(safe-area-inset-top) + 50px));gap:6px}
.bottom-fixed-info{bottom:max(126px,calc(env(safe-area-inset-bottom) + 116px));gap:8px}
body.mode-night .bottom-fixed-info{bottom:max(24px,calc(env(safe-area-inset-bottom) + 18px))}
.top-fixed-info .date,.bottom-fixed-info .date{margin-top:0!important;white-space:nowrap;font-size:clamp(16px,4.1vw,23px);font-weight:350;text-transform:capitalize;letter-spacing:.02em;color:rgb(var(--info-rgb))}
.top-fixed-info .sun-row,.bottom-fixed-info .sun-row,.top-fixed-info .alarm-row,.bottom-fixed-info .alarm-row{display:inline-flex;align-items:center;gap:10px;font-size:clamp(14px,3.5vw,19px);opacity:.82;white-space:nowrap;color:rgb(var(--info-rgb))}
.top-fixed-info .sun-row strong,.bottom-fixed-info .sun-row strong{font-weight:600;font-variant-numeric:tabular-nums}
.top-fixed-info .sun-icon,.bottom-fixed-info .sun-icon{font-size:1.15em}
.top-fixed-info .alarm-days-display,.bottom-fixed-info .alarm-days-display{white-space:nowrap;color:rgb(var(--info-rgb))}
/* relógio centralizado sozinho */
.clock-wrap{margin-top:0!important}
/* regras antigas de escala dentro do clock deixam de valer para estas infos */
#date,.top-fixed-info,.bottom-fixed-info,.sun-row,.alarm-row,.alarm-days-display{will-change:transform}
@media(min-width:900px){.top-fixed-info{top:max(66px,calc(env(safe-area-inset-top) + 56px))}.bottom-fixed-info{bottom:max(134px,calc(env(safe-area-inset-bottom) + 122px))}body.mode-night .bottom-fixed-info{bottom:max(30px,calc(env(safe-area-inset-bottom) + 22px))}}
@media(orientation:landscape){.top-fixed-info{top:max(18px,calc(env(safe-area-inset-top) + 14px));gap:4px}.bottom-fixed-info{bottom:max(54px,calc(env(safe-area-inset-bottom) + 50px));gap:4px}.top-fixed-info .date{font-size:clamp(13px,2.7vh,18px)}.top-fixed-info .sun-row,.bottom-fixed-info .alarm-row{font-size:clamp(11px,2.5vh,16px)}.alarm-days-display{margin-top:2px}}
@media(max-width:560px) and (orientation:portrait){.bottom-fixed-info{bottom:max(152px,calc(env(safe-area-inset-bottom) + 138px))}body.mode-night .bottom-fixed-info{bottom:max(28px,calc(env(safe-area-inset-bottom) + 20px))}}
@media(max-width:380px) and (orientation:portrait){.top-fixed-info{top:max(52px,calc(env(safe-area-inset-top) + 44px))}.bottom-fixed-info{bottom:max(146px,calc(env(safe-area-inset-bottom) + 132px))}.top-fixed-info .date{font-size:clamp(13px,4vw,18px)}.top-fixed-info .sun-row,.bottom-fixed-info .alarm-row{font-size:clamp(11px,3.2vw,15px)}}


/* v3.44 — infos secundárias nos limites úteis da tela + controle rápido de tamanho */
.top-fixed-info{top:max(8px,calc(env(safe-area-inset-top) + 4px))!important;gap:4px}
.bottom-fixed-info{bottom:max(8px,calc(env(safe-area-inset-bottom) + 6px))!important;gap:6px}
body.mode-night .bottom-fixed-info{bottom:max(8px,calc(env(safe-area-inset-bottom) + 6px))!important}
.quick-settings{bottom:max(118px,calc(env(safe-area-inset-bottom) + 108px))!important}
.bottom-actions{bottom:max(62px,calc(env(safe-area-inset-bottom) + 54px))!important}
.quick-info-scale{min-width:126px;padding:0 8px 4px}
.quick-info-scale input[type=range]{display:block;width:118px;height:30px;margin:0;accent-color:rgb(var(--info-rgb))}
@media(orientation:landscape) and (max-height:620px){
  .top-fixed-info{top:max(6px,calc(env(safe-area-inset-top) + 4px))!important;gap:3px}
  .bottom-fixed-info{bottom:max(6px,calc(env(safe-area-inset-bottom) + 4px))!important;gap:3px}
  .quick-settings{bottom:max(88px,calc(env(safe-area-inset-bottom) + 80px))!important}
  .bottom-actions{bottom:max(36px,calc(env(safe-area-inset-bottom) + 28px))!important}
  .quick-info-scale{min-width:112px}
  .quick-info-scale input[type=range]{width:104px;height:26px}
}
@media(max-width:560px) and (orientation:portrait){
  .quick-settings{bottom:max(128px,calc(env(safe-area-inset-bottom) + 118px))!important}
  .bottom-actions{bottom:max(70px,calc(env(safe-area-inset-bottom) + 60px))!important}
}
@media(min-width:900px){
  .top-fixed-info{top:max(10px,calc(env(safe-area-inset-top) + 6px))!important}
  .bottom-fixed-info{bottom:max(10px,calc(env(safe-area-inset-bottom) + 8px))!important}
  .quick-settings{bottom:max(126px,calc(env(safe-area-inset-bottom) + 114px))!important}
  .bottom-actions{bottom:max(66px,calc(env(safe-area-inset-bottom) + 56px))!important}
}


/* v3.45 — botão X para sair; no modo noite fica grande como maximizar/minimizar */
.exit-app-btn{font-size:30px;font-weight:300;line-height:1}
body.mode-night #exitAppBtn{
  width:88px!important;height:88px!important;min-width:88px!important;min-height:88px!important;
  font-size:52px!important;font-weight:300!important;
  color:rgb(var(--info-rgb))!important;background:rgba(var(--info-rgb),.16)!important;
  border:2px solid rgba(var(--info-rgb),.72)!important;
  box-shadow:0 0 0 1px rgba(var(--info-rgb),.10),0 0 22px rgba(var(--info-rgb),.28)!important;opacity:1!important;
}
@media(orientation:landscape) and (max-height:620px){
  body.mode-night #exitAppBtn{width:76px!important;height:76px!important;min-width:76px!important;min-height:76px!important;font-size:46px!important}
}


/* v3.46 — data, nascer do sol, alarme e dias da semana com o mesmo brilho do relógio no Modo Noite */
.top-fixed-info,.bottom-fixed-info{
  opacity:var(--clock-brightness,1);
  transition:opacity .22s ease,color .22s ease,text-shadow .22s ease,filter .22s ease;
}
.top-fixed-info .date,
.top-fixed-info .sun-row,
.bottom-fixed-info .alarm-row,
.bottom-fixed-info .alarm-days-display,
.top-fixed-info .sun-icon,
.bottom-fixed-info .alarm-icon{
  color:rgba(var(--info-rgb),var(--dim))!important;
  text-shadow:0 0 10px rgba(var(--info-rgb),calc(var(--dim-faint) * 1.15));
}
.top-fixed-info .sun-row strong,
.bottom-fixed-info .alarm-row strong{
  color:rgba(var(--info-rgb),var(--dim))!important;
}
body.mode-night .top-fixed-info .date,
body.mode-night .top-fixed-info .sun-row,
body.mode-night .bottom-fixed-info .alarm-row,
body.mode-night .bottom-fixed-info .alarm-days-display{
  text-shadow:0 0 12px rgba(var(--info-rgb),calc(var(--dim-faint) * 1.35));
}
body.mode-night .top-fixed-info .sun-icon,
body.mode-night .bottom-fixed-info .alarm-icon{
  filter:drop-shadow(0 0 6px rgba(var(--info-rgb),calc(var(--dim-faint) * 1.25)));
}


/* v3.47 — blocos arrastáveis + brilho realmente igual ao relógio */
.top-fixed-info,.bottom-fixed-info{
  opacity:var(--clock-brightness,1);
  touch-action:none;
  user-select:none;-webkit-user-select:none;
  cursor:grab;
}
.top-fixed-info.drag-ready,.bottom-fixed-info.drag-ready{will-change:left,top,transform}
.top-fixed-info.dragging,.bottom-fixed-info.dragging{cursor:grabbing;z-index:6}
/* O relógio é escurecido uma única vez pelo opacity do conjunto. As informações seguem exatamente a mesma regra. */
.top-fixed-info .date,
.top-fixed-info .sun-row,
.top-fixed-info .sun-row strong,
.top-fixed-info .sun-icon,
.bottom-fixed-info .alarm-row,
.bottom-fixed-info .alarm-row strong,
.bottom-fixed-info .alarm-icon,
.bottom-fixed-info .alarm-days-display{
  color:rgb(var(--info-rgb))!important;
}
body.mode-night .top-fixed-info .date,
body.mode-night .top-fixed-info .sun-row,
body.mode-night .bottom-fixed-info .alarm-row,
body.mode-night .bottom-fixed-info .alarm-days-display{
  text-shadow:0 0 10px rgba(var(--info-rgb),.15);
}
body.mode-night .top-fixed-info .sun-icon,
body.mode-night .bottom-fixed-info .alarm-icon{
  filter:drop-shadow(0 0 5px rgba(var(--info-rgb),.14));
}


/* v3.48 — arraste livre também para a data/nascer do sol + botão Modo Noite/Dia acima das opções no retrato */
.top-fixed-info.custom-position,
.bottom-fixed-info.custom-position{
  left:auto;
  right:auto;
  bottom:auto;
}
/* Garante que o bloco superior não fique preso ao top original quando o usuário arrasta */
.top-fixed-info.custom-position,
.bottom-fixed-info.custom-position{
  cursor:grab;
}
/* No retrato do celular, deixamos as ações principais um pouco mais altas e na frente dos ajustes rápidos */
@media(max-width:560px) and (orientation:portrait){
  .bottom-actions{
    z-index:6!important;
    bottom:max(102px,calc(env(safe-area-inset-bottom) + 92px))!important;
  }
  .top-controls{z-index:6!important}
  .quick-settings{z-index:4!important}
}
/* No modo noite, em especial, o botão grande de alternar dia/noite precisa escapar claramente da faixa de opções */
@media(max-width:560px) and (orientation:portrait){
  body.mode-night .bottom-actions{
    bottom:max(112px,calc(env(safe-area-inset-bottom) + 102px))!important;
  }
}


/* v3.49 — toque simples para controles; segurar 1 s para arrastar */
.top-fixed-info.drag-pressing,.bottom-fixed-info.drag-pressing{
  cursor:default;
}
.top-fixed-info.drag-ready,.bottom-fixed-info.drag-ready{
  cursor:grab;
  filter:brightness(1.08);
}
.top-fixed-info.dragging,.bottom-fixed-info.dragging{
  cursor:grabbing;
  filter:brightness(1.14);
}
/* Retrato: ações principais ficam realmente acima da faixa de opções rápidas, sem sobreposição. */
@media(max-width:560px) and (orientation:portrait){
  .bottom-actions{
    bottom:max(205px,calc(env(safe-area-inset-bottom) + 195px))!important;
    z-index:6!important;
  }
  body.mode-night .bottom-actions{
    bottom:max(215px,calc(env(safe-area-inset-bottom) + 205px))!important;
  }
}


/* v3.50 — modo lanterna de tela para uso noturno */
.flashlight-btn{display:none}
.flashlight-btn svg{width:52%;height:52%;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
body.mode-night #flashlightBtn{
  display:grid;
  width:88px!important;height:88px!important;min-width:88px!important;min-height:88px!important;
  color:rgb(var(--info-rgb))!important;background:rgba(var(--info-rgb),.16)!important;
  border:2px solid rgba(var(--info-rgb),.72)!important;
  box-shadow:0 0 0 1px rgba(var(--info-rgb),.10),0 0 22px rgba(var(--info-rgb),.28)!important;
  opacity:1!important;
}
body.mode-night #flashlightBtn svg{width:48px;height:48px}
@media(orientation:landscape) and (max-height:620px){
  body.mode-night #flashlightBtn{width:76px!important;height:76px!important;min-width:76px!important;min-height:76px!important}
  body.mode-night #flashlightBtn svg{width:42px;height:42px}
}
/* A tela branca usa 100% de branco/opacity da própria aplicação, sem o dimmer do Modo Noite. */
body.flashlight-active,
body.flashlight-active .screen{background:#fff!important}
body.flashlight-active .clock-wrap,
body.flashlight-active .top-fixed-info,
body.flashlight-active .bottom-fixed-info,
body.flashlight-active .quick-settings,
body.flashlight-active .bottom-actions,
body.flashlight-active #settingsBtn,
body.flashlight-active #fullscreenQuickBtn,
body.flashlight-active #exitAppBtn{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
body.flashlight-active #topControls{
  opacity:1!important;visibility:visible!important;pointer-events:auto!important;
  transform:none!important;z-index:1000!important;
}
body.flashlight-active #flashlightBtn{
  display:grid!important;visibility:visible!important;opacity:1!important;pointer-events:auto!important;
  color:#111!important;background:rgba(255,255,255,.96)!important;
  border:2px solid rgba(0,0,0,.70)!important;
  box-shadow:0 2px 16px rgba(0,0,0,.20)!important;
}
body.flashlight-active #flashlightBtn svg{stroke:#111!important}
