/* Local fonts: consistent across browsers and devices; no external font requests. */
@font-face{font-family:"TCT UI";src:url("../fonts/TCT-UI-Regular.ttf") format("truetype");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:"TCT UI";src:url("../fonts/TCT-UI-Semibold.ttf") format("truetype");font-style:normal;font-weight:600;font-display:swap}
@font-face{font-family:"TCT UI";src:url("../fonts/TCT-UI-Bold.ttf") format("truetype");font-style:normal;font-weight:700;font-display:swap}
@font-face{font-family:"TCT UI";src:url("../fonts/TCT-UI-Black.ttf") format("truetype");font-style:normal;font-weight:800 900;font-display:swap}
@font-face{font-family:"TCT Display";src:url("../fonts/TCT-Display.ttf") format("truetype");font-style:normal;font-weight:700;font-stretch:extra-condensed;font-display:swap}

.world-clock-card{width:min(940px,100%);--clock-accent:#43b8ff;--clock-rgb:67,184,255;position:relative;overflow:hidden}
.world-clock-card::before{content:"";position:absolute;inset:-180px 10% auto;height:260px;background:radial-gradient(circle,rgba(var(--clock-rgb),.22),transparent 68%);pointer-events:none}
.world-clock-card.theme-red{--clock-accent:#f13b50;--clock-rgb:241,59,80}.world-clock-card.theme-blue{--clock-accent:#43b8ff;--clock-rgb:67,184,255}.world-clock-card.theme-green{--clock-accent:#57d08a;--clock-rgb:87,208,138}.world-clock-card.theme-amber{--clock-accent:#ffb83e;--clock-rgb:255,184,62}.world-clock-card.theme-white{--clock-accent:#fff;--clock-rgb:255,255,255}
.world-clock-card .timer-status,.world-clock-card .theme-name,.world-clock-card .panel-kicker{color:var(--clock-accent)}
.world-location-bar{display:flex;align-items:end;justify-content:space-between;gap:20px;margin:24px 0 12px;padding:0 4px}.location-kicker{display:block;color:var(--text-secondary);font-size:.68rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase}.world-location-bar strong{display:block;font-size:clamp(1.25rem,3vw,1.8rem);letter-spacing:-.03em}.world-date{color:var(--text-secondary);font-size:.88rem;font-weight:700;text-align:right}
.world-display-stage{min-height:380px}.world-digital{min-height:360px;position:relative;flex-direction:column}.world-digital-time{display:flex;align-items:baseline;justify-content:center;font-family:"TCT Display",sans-serif;font-size:clamp(6.2rem,18vw,11.5rem);line-height:.82;letter-spacing:.015em;color:var(--clock-accent);text-shadow:0 0 18px rgba(var(--clock-rgb),.28),0 0 58px rgba(var(--clock-rgb),.15)}.world-digital .timer-colon{animation:clockBlink 1s steps(1) infinite}.world-seconds{margin-left:.16em;font-size:.32em;opacity:.72}.world-ampm{margin-left:.2em;font-family:Arial,sans-serif;font-size:.12em;font-weight:900;letter-spacing:.1em}.world-zone-line{display:flex;align-items:center;gap:9px;margin-top:26px;color:rgba(255,255,255,.56);font-size:.72rem;font-weight:800;letter-spacing:.15em}.live-dot{width:6px;height:6px;border-radius:50%;background:var(--clock-accent);box-shadow:0 0 10px var(--clock-accent)}
@keyframes clockBlink{50%{opacity:.28}}
.world-analogue{min-height:420px}.world-analogue .analogue-shell{width:min(390px,82vw);height:min(390px,82vw)}.world-analogue-face{background:radial-gradient(circle at 42% 35%,#252a31 0,#101318 46%,#040506 100%);box-shadow:inset 0 0 0 2px rgba(255,255,255,.04),inset 0 0 45px rgba(0,0,0,.8)}.world-analogue-face .clock-number{color:#e9eef3}.world-analogue-face .dial-brand-mark,.world-analogue-face .second-hand{background:var(--clock-accent);color:#050505}.world-date-window{position:absolute;right:22%;top:49%;transform:translateY(-50%);min-width:34px;padding:5px 7px;border:1px solid rgba(255,255,255,.2);background:#edf1f3;color:#16191c;border-radius:3px;font-weight:900;text-align:center;box-shadow:inset 0 1px 3px rgba(0,0,0,.35)}.clock-hand{position:absolute;left:50%;bottom:50%;transform-origin:50% 100%;border-radius:99px;z-index:8}.hour-hand{width:8px;height:27%;margin-left:-4px;background:#e8edf2}.minute-hand{width:5px;height:36%;margin-left:-2.5px;background:#f4f7f9}.second-hand{width:2px;height:40%;margin-left:-1px;box-shadow:0 0 8px rgba(var(--clock-rgb),.7)}.clock-pin{position:absolute;left:50%;top:50%;width:18px;height:18px;transform:translate(-50%,-50%);border:4px solid #e8edf2;border-radius:50%;background:var(--clock-accent);z-index:10}
.world-flip{min-height:380px;flex-direction:column;justify-content:center}.world-flip-row{display:flex;align-items:center;justify-content:center;gap:10px}.world-flip .flip-card{width:clamp(62px,14vw,112px);height:clamp(100px,20vw,168px)}.world-flip .flip-digit{font-size:clamp(5rem,14vw,10rem);color:var(--clock-accent)}.world-flip-meta{display:flex;justify-content:center;align-items:center;gap:16px;margin-top:24px;color:#aeb7c1;font-size:.78rem;font-weight:900;letter-spacing:.14em}.world-flip-meta strong{color:var(--clock-accent);font-size:1.2rem}
.world-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:18px}.world-city{min-width:0;padding:15px 12px;border:1px solid var(--border-color);border-radius:13px;background:var(--button-background);color:var(--text-primary);text-align:left;cursor:pointer;transition:.18s ease}.world-city:hover{transform:translateY(-2px);border-color:rgba(var(--clock-rgb),.5)}.world-city.active{border-color:var(--clock-accent);box-shadow:0 0 0 2px rgba(var(--clock-rgb),.12),0 10px 28px rgba(var(--clock-rgb),.12)}.city-top{display:flex;justify-content:space-between;gap:6px}.city-name{font-size:.76rem;font-weight:900}.city-day{color:var(--text-secondary);font-size:.58rem;font-weight:800;text-transform:uppercase}.city-time{display:block;margin-top:6px;color:var(--clock-accent);font-family:"TCT Display",sans-serif;font-size:2rem;line-height:1}.city-offset{display:block;margin-top:5px;color:var(--text-secondary);font-size:.61rem;font-weight:800}
.clock-controls-panel{display:grid;grid-template-columns:1.2fr .8fr;gap:14px;margin-top:18px}.alarm-panel,.speaking-panel{border:1px solid var(--border-color);border-radius:18px;background:color-mix(in srgb,var(--card-background) 84%,var(--button-hover));padding:20px}.panel-heading{display:flex;justify-content:space-between;align-items:start}.panel-heading h2,.speaking-panel h2{font-size:1.15rem}.panel-kicker{font-size:.62rem;font-weight:900;letter-spacing:.13em;text-transform:uppercase}.alarm-state{padding:5px 9px;border-radius:999px;background:var(--button-hover);color:var(--text-secondary);font-size:.64rem;font-weight:900;text-transform:uppercase}.alarm-state.on{background:rgba(var(--clock-rgb),.13);color:var(--clock-accent)}.alarm-controls{display:grid;grid-template-columns:1fr 1.15fr auto auto;gap:9px;align-items:end;margin-top:15px}.alarm-controls label span{display:block;margin-bottom:5px;color:var(--text-secondary);font-size:.65rem;font-weight:800}.alarm-controls input,.alarm-controls select{width:100%;height:42px;border:1px solid var(--border-color);border-radius:9px;background:var(--button-background);color:var(--text-primary);padding:0 10px}.alarm-controls button{height:42px}.alarm-note{margin-top:10px;color:var(--text-secondary);font-size:.72rem}.speaking-panel{position:relative;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:14px;overflow:hidden}.speaking-panel::after{content:"";position:absolute;right:-50px;bottom:-80px;width:180px;height:180px;border-radius:50%;background:rgba(var(--clock-rgb),.1)}.premium-badge{position:absolute;right:13px;top:12px;padding:4px 7px;border:1px solid rgba(var(--clock-rgb),.35);border-radius:5px;color:var(--clock-accent);font-size:.55rem;font-weight:900;letter-spacing:.12em}.speaking-icon{display:grid;place-items:center;width:58px;height:58px;border-radius:50%;background:#080b10;color:var(--clock-accent);font-size:1.1rem;box-shadow:0 0 28px rgba(var(--clock-rgb),.18)}.speaking-panel p{margin-top:6px;color:var(--text-secondary);font-size:.76rem;line-height:1.45}.premium-button{grid-column:1/-1;position:relative;z-index:2;height:40px;border:1px solid rgba(var(--clock-rgb),.35);border-radius:9px;background:rgba(var(--clock-rgb),.1);color:var(--clock-accent);font-weight:900;cursor:pointer}
.primary-button,.secondary-button{padding:0 14px;border-radius:9px;font-weight:900;cursor:pointer}.primary-button{border:0;background:var(--clock-accent);color:#080a0d}.secondary-button{border:1px solid var(--border-color);background:var(--button-background);color:var(--text-primary)}
.world-clock-card:fullscreen{width:100vw;height:100vh;max-width:none;margin:0;border:0;border-radius:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto;align-items:center;padding:clamp(18px,3vh,38px) clamp(18px,4vw,58px);box-sizing:border-box;background:var(--card-background);overflow:hidden}.world-clock-card:fullscreen .display-toolbar,.world-clock-card:fullscreen .theme-toolbar,.world-clock-card:fullscreen .clock-controls-panel{display:none}.world-clock-card:fullscreen .world-location-bar{width:min(1080px,92vw);margin:0 auto clamp(8px,1.5vh,18px);align-self:end}.world-clock-card:fullscreen .world-display-stage{width:100%;height:100%;min-height:0;display:grid;place-items:center;align-self:center}.world-clock-card:fullscreen .world-digital,.world-clock-card:fullscreen .world-analogue,.world-clock-card:fullscreen .world-flip{width:100%;height:100%;min-height:0;align-items:center;justify-content:center}.world-clock-card:fullscreen .world-digital-time{font-size:clamp(8rem,24vw,20rem)}.world-clock-card:fullscreen .world-flip-row{transform:none}.world-clock-card:fullscreen .world-flip .flip-card{width:clamp(120px,15vw,240px);height:clamp(180px,22vw,350px)}.world-clock-card:fullscreen .world-flip .flip-digit{font-size:clamp(9rem,18vw,20rem)}.world-clock-card:fullscreen .world-flip-meta{margin-top:clamp(14px,2vh,28px)}.world-clock-card:fullscreen .world-grid{width:min(1080px,92vw);margin:clamp(8px,1.5vh,18px) auto 0;align-self:start}.world-clock-card:fullscreen .world-analogue .analogue-shell{width:min(72vh,72vw);height:min(72vh,72vw)}
.alarm-ringing{animation:alarmPulse .7s ease-in-out infinite alternate}@keyframes alarmPulse{to{box-shadow:0 0 0 5px rgba(var(--clock-rgb),.25),0 0 90px rgba(var(--clock-rgb),.28)}}
@media(max-width:850px){.world-grid{grid-template-columns:repeat(3,1fr)}.clock-controls-panel{grid-template-columns:1fr}.alarm-controls{grid-template-columns:1fr 1fr}.alarm-controls button{width:100%}}
@media(max-width:560px){.world-clock-card{padding:18px 14px}.world-display-stage{min-height:300px}.world-digital{min-height:290px}.world-digital-time{font-size:clamp(4.8rem,25vw,7.5rem)}.world-seconds{display:none}.world-location-bar{align-items:start}.world-date{max-width:45%}.world-grid{grid-template-columns:repeat(2,1fr)}.world-flip-row{gap:5px}.world-flip .flip-card{width:18vw;height:29vw}.world-flip-meta{gap:9px}.alarm-controls{grid-template-columns:1fr}.world-clock-card:fullscreen .world-grid{display:none}}

/* White Minimal contrast correction: retain the dark display chamber while
   making only the flip leaves white and the analogue hands dark. */
.world-clock-card.theme-white .world-flip .flip-card{
    border-color:#767a7d;
    background:linear-gradient(180deg,#fbfbf8 0%,#dedfdb 49.4%,#9da0a1 50%,#d0d2cf 100%);
    box-shadow:inset 0 1px rgba(255,255,255,.95),inset 0 -16px 25px rgba(70,72,72,.22),0 13px 25px rgba(0,0,0,.72);
}
.world-clock-card.theme-white .world-flip .flip-digit{
    color:#111315;
    text-shadow:0 1px rgba(255,255,255,.65);
}
.world-clock-card.theme-white .world-flip-row .timer-colon{
    color:#f4f5f5;
}
.world-clock-card.theme-white .world-analogue .hour-hand{
    background:#111315;
    box-shadow:0 1px 2px rgba(255,255,255,.22);
}
.world-clock-card.theme-white .world-analogue .minute-hand{
    background:#171a1d;
    box-shadow:0 1px 2px rgba(255,255,255,.22);
}
.world-clock-card.theme-white .world-analogue .second-hand{
    background:#34393d;
    box-shadow:0 0 5px rgba(0,0,0,.35);
}
.world-clock-card.theme-white .world-analogue .clock-pin{
    border-color:#111315;
    background:#f3f4f2;
}

/* ==================================================
   v1.6.0 WORLD CLOCK FULLSCREEN LAYOUT FIX
   Keep the visible clock composition together instead of centring the display
   inside an oversized flexible row, which created the large empty upper area.
================================================== */
.world-clock-card:fullscreen {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto auto;
    align-content: center;
    justify-items: center;
    row-gap: clamp(16px, 2.5vh, 34px);
}

.world-clock-card:fullscreen > .timer-status,
.world-clock-card:fullscreen > .display-toolbar,
.world-clock-card:fullscreen > .theme-toolbar,
.world-clock-card:fullscreen > .clock-controls-panel {
    display: none !important;
}

.world-clock-card:fullscreen > .world-location-bar {
    grid-row: 1;
    width: min(1080px, 92vw);
    margin: 0;
    align-self: auto;
}

.world-clock-card:fullscreen > .world-display-stage {
    grid-row: 2;
    width: 100%;
    height: auto;
    min-height: 0;
    margin: 0;
    display: grid;
    place-items: center;
}

.world-clock-card:fullscreen > .world-grid {
    grid-row: 3;
    width: min(1080px, 92vw);
    margin: 0;
    align-self: auto;
}

.world-clock-card:fullscreen .world-digital,
.world-clock-card:fullscreen .world-flip {
    width: 100%;
    height: auto;
    min-height: 0;
    align-items: center;
    justify-content: center;
}

@media (max-height: 760px) {
    .world-clock-card:fullscreen {
        row-gap: 10px;
        padding-top: 12px;
        padding-bottom: 12px;
    }
    .world-clock-card:fullscreen .world-digital-time {
        font-size: clamp(7rem, 21vw, 16rem);
    }
    .world-clock-card:fullscreen .world-flip .flip-card {
        width: clamp(100px, 13vw, 190px);
        height: clamp(150px, 19vw, 275px);
    }
    .world-clock-card:fullscreen .world-flip .flip-digit {
        font-size: clamp(7rem, 16vw, 15rem);
    }
}

/* ==================================================
   v1.6.1 WORLD CLOCK DIGITAL / FLIP FULLSCREEN POSITION
   Move the visible digital composition upward without altering analogue mode.
================================================== */
.world-clock-card:fullscreen .world-display-stage[data-display="digital"],
.world-clock-card:fullscreen .world-display-stage[data-display="flip"] {
    transform: translateY(clamp(-150px, -11vh, -80px));
}

.world-clock-card:fullscreen .world-display-stage[data-display="digital"] + .world-grid,
.world-clock-card:fullscreen .world-display-stage[data-display="flip"] + .world-grid {
    transform: translateY(clamp(-150px, -11vh, -80px));
}

@media (max-height: 760px) {
    .world-clock-card:fullscreen .world-display-stage[data-display="digital"],
    .world-clock-card:fullscreen .world-display-stage[data-display="flip"],
    .world-clock-card:fullscreen .world-display-stage[data-display="digital"] + .world-grid,
    .world-clock-card:fullscreen .world-display-stage[data-display="flip"] + .world-grid {
        transform: translateY(-5vh);
    }
}
