:root{--control-bg:#152b44;--control-bg-end:#132238;--control-border:#486f97;--control-ink:#edf6ff;--control-active:#244e78;--control-shadow:#06132144}
:root[data-theme=light]{--control-bg:#f0f6ff;--control-bg-end:#e1ebf8;--control-border:#a4bdd8;--control-ink:#163b62;--control-active:#c5dcf5;--control-shadow:#173c6314}
a.sp-control,button.sp-control{display:inline-flex!important;align-items:center;justify-content:center;gap:9px;position:relative;min-height:50px;max-width:100%;padding:10px 15px;border:1px solid var(--control-border)!important;border-radius:15px;background:linear-gradient(125deg,var(--control-bg),var(--control-bg-end))!important;color:var(--control-ink)!important;box-shadow:inset 0 1px 0 #9bcbff18,0 4px 12px var(--control-shadow);font-size:15px!important;font-weight:600;line-height:1.45;letter-spacing:-.015em;text-align:center;text-decoration:none;white-space:normal;overflow-wrap:anywhere;transition:transform .18s,box-shadow .18s,border-color .18s}
.sp-control .control-icon{width:29px;height:29px;flex-shrink:0;transition:transform .2s}.sp-control>.sp-icon{width:29px;height:29px}.sp-control.primary{border-color:#6398cb!important;background:linear-gradient(125deg,#20466d,#173350)!important;color:#f4f8ff!important;box-shadow:inset 0 2px 0 #70b6ff88,0 5px 16px var(--control-shadow)}
.sp-control:hover{border-color:#84c8ff!important;box-shadow:inset 0 1px 0 #b8dbff30,0 7px 20px var(--control-shadow);transform:translateY(-1px);filter:none}.sp-control:hover .control-icon{transform:translateY(-2px)}.sp-control:active{transform:scale(.98);box-shadow:inset 0 2px 8px #07132130}.sp-control:focus-visible{outline:3px solid #e7a9bb;outline-offset:3px}.sp-control:disabled{opacity:.65;cursor:wait;transform:none;box-shadow:none}
.map-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;background:var(--control-bg-end);border:1px solid var(--control-border);border-radius:20px;padding:8px}.map-controls:has(.chip:nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}.map-controls button.chip{display:flex!important;flex-direction:column;gap:5px;min-width:0;min-height:85px;margin:0;padding:10px 7px;border-color:transparent!important;background:transparent!important;box-shadow:none;border-radius:13px;font-size:15px!important;font-weight:550;color:var(--control-ink)!important}.map-controls .chip .control-icon{width:31px;height:31px}.map-controls button.chip.selected{background:var(--control-active)!important;border-color:var(--control-border)!important;color:var(--control-ink)!important;box-shadow:inset 0 -3px 0 #79bfff;font-weight:750}.filters{align-items:end;gap:20px}.filters>div:first-child{min-width:0;flex:1}.filter-label{display:block;margin-bottom:10px;text-transform:none;letter-spacing:.025em;font-size:14px}.filters select,.catalog-control select,.theme-control select{background:linear-gradient(125deg,var(--control-bg),var(--control-bg-end))!important;border:1px solid var(--control-border)!important;color:var(--control-ink)!important;box-shadow:inset 0 1px 0 #9bcbff18;border-radius:13px;min-height:50px;font-weight:550}.filters select{font-size:16px;max-width:100%}.theme-control select{min-height:44px}.sheet-controls{gap:8px;padding:12px;background:var(--surface);border-bottom:1px solid var(--edge)}.sheet-controls strong{flex:1 1 100%;font-size:15px;padding:0 2px 3px}.sheet-controls button.sp-control{padding:6px 10px;min-height:44px;font-size:14px!important;flex:1}.sheet-controls .control-icon{width:25px;height:25px}#event-detail>.sp-control{width:100%;justify-content:flex-start;text-align:left;margin:6px 0 14px;padding:14px}.install-card button.sp-control{font-size:14px!important}.update-notice{align-items:center;gap:14px;border-color:var(--control-border);background:var(--surface);border-radius:18px}.update-notice button.sp-control{flex-shrink:0}.atlas-top a.sp-control{padding:7px 11px;font-size:14px!important}.section-head a.sp-control,.section-head button.sp-control{font-size:14px!important;padding:8px 12px}.feed-status .sp-control{align-self:center}.activity-summary .sp-control{font-size:15px!important}.all-records.sp-control{width:100%}.atlas-metrics>a{border:1px solid var(--control-border);background:linear-gradient(125deg,var(--control-bg),var(--control-bg-end));color:var(--control-ink);border-radius:15px;padding:16px}.atlas-metrics>a>span,.atlas-metrics>a small{color:var(--control-ink)}
@media(max-width:800px){a.sp-control,button.sp-control{font-size:15px!important;padding:10px 13px;min-height:49px;border-radius:14px}.map-controls button.chip{font-size:14px!important;min-height:86px;padding:9px 5px}.map-controls{gap:6px;padding:6px;grid-template-columns:repeat(3,minmax(0,1fr))}.filters{display:flex;flex-direction:column;align-items:stretch;padding:15px}.filters>div{width:100%}.filters select{width:100%}.atlas-top{gap:9px}.atlas-top a.sp-control{font-size:13px!important}.atlas-top .control-icon{width:25px;height:25px}.sheet-controls strong{font-size:15px}.sheet-controls button.sp-control{min-height:44px;font-size:14px!important;padding:6px 9px}.sheet-controls .control-icon{width:25px;height:25px}.update-notice{flex-wrap:wrap}.update-notice button.sp-control{margin-left:auto;min-height:46px}.section-head{gap:10px}.section-head a.sp-control{font-size:14px!important}.feed-status{gap:16px}.activity-summary a.sp-control{padding:10px 13px}}
@media(prefers-reduced-motion:reduce){.sp-control,.sp-control .control-icon{animation:none!important;transition:none!important}.sp-control:hover,.sp-control:active,.sp-control:hover .control-icon{transform:none}}
header .country-label::before{display:none}header .country-label{gap:8px}header .country-label .panama-flag{width:26px;height:18px}

/* Mobile viewport: navigation has its own space, never covers the map. */
main{animation:none;transform:none}
.feed-status{display:flex;align-items:center;flex-wrap:nowrap;gap:12px;margin:12px 0;padding:12px 0}
.feed-details{flex:1;min-width:0;color:var(--muted)}
.feed-details summary{cursor:pointer;min-height:44px;display:list-item;align-content:center;font-size:14px;font-weight:600;color:var(--ink);line-height:1.45}
.feed-details small{font-size:13px;line-height:1.6;margin:8px 0}
.feed-status .refresh-feed{flex-shrink:0}
.update-notice{width:min(520px,calc(100% - 24px));flex-wrap:nowrap;padding:10px 12px;gap:10px;font-size:13px}
.update-notice>span{flex:1;min-width:0;line-height:1.4}
.update-notice strong,.update-notice small{display:block}
.update-notice small{font-size:12px;color:var(--muted);margin-top:3px}
.update-notice button.sp-control{padding:7px 10px;min-height:44px;font-size:13px!important;margin:0}
.update-notice button .control-icon{display:none}
.update-notice .dismiss-update{flex:0 0 44px;width:44px;height:44px;padding:0;color:var(--ink);font-size:25px;background:transparent;border:0}
@media(max-width:800px){
 html,body{height:100%;overflow:hidden}
 .shell{height:calc(100dvh - 94px - env(safe-area-inset-bottom));overflow-y:auto;overflow-x:hidden;overscroll-behavior-y:contain;scroll-padding-top:110px;width:100%;margin-left:0}
 header{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto;gap:2px 12px;padding:10px 18px;padding-top:max(10px,env(safe-area-inset-top));min-height:82px;height:auto;align-items:center}
 header .mobile-brand{grid-column:1;grid-row:1;display:flex;gap:8px;white-space:nowrap;font-size:19px;letter-spacing:-.6px}
 header .mobile-brand svg{width:31px;height:31px;flex-shrink:0}
 header .theme-control{grid-column:2;grid-row:1 / span 2;margin:0}
 header .theme-control select{width:94px;max-width:94px;min-height:44px;font-size:14px}
 header .country-label{grid-column:1;grid-row:2;justify-self:start;margin:0 0 0 39px!important;padding:1px 0;min-height:25px;font-size:13px!important;background:transparent;border:0;gap:7px}
 header .country-label .panama-flag{width:22px;height:15px}
 main{padding:20px 18px 28px}
 footer{padding-bottom:22px}
 #mobile-nav{bottom:max(8px,env(safe-area-inset-bottom));height:82px}
 .geo-map{height:clamp(260px,46svh,400px);scroll-margin-top:110px}
 .map-toolbar{margin:0 0 10px;padding:4px 0;gap:8px}
 .map-toolbar .tag{font-size:11px;padding:7px 9px;white-space:nowrap}
 .map-toolbar button.sp-control{font-size:13px!important;padding:7px 10px}
 .map-toolbar .control-icon{width:24px;height:24px}
 .feed-status button.sp-control{font-size:13px!important;padding:7px 10px;gap:6px}
 .feed-status .control-icon{width:24px;height:24px}
 .event-sheet{bottom:calc(96px + env(safe-area-inset-bottom));max-height:45dvh;z-index:1100}
 .event-sheet.expanded{max-height:calc(100dvh - 200px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}
 .sheet-controls{display:grid;grid-template-columns:1fr 1fr;gap:8px}
 .sheet-controls strong{grid-column:1/-1}
 .update-notice{bottom:calc(98px + env(safe-area-inset-bottom));font-size:13px;gap:6px;padding:9px}
 .update-notice button.sp-control{font-size:13px!important;padding:7px 8px}
}

/* Origin time stays separate from catalog download time. */
button.sp-record .record-brand,.detail-country{align-items:flex-start;gap:12px}
.event-identity{display:flex;align-items:flex-start!important;gap:10px!important;min-width:0}
.event-identity>.panama-flag{margin-top:3px}
.event-identity-copy{display:flex;flex-direction:column;gap:3px;min-width:0;line-height:1.45}
.identity-name{font-size:13px;font-weight:650;color:var(--ink)}
.event-elapsed{font-size:16px;font-weight:750;color:var(--ink);letter-spacing:0;font-variant-numeric:tabular-nums}
.identity-clock{font-size:13px;font-weight:450;color:var(--muted);letter-spacing:0}
button.sp-record .record-source.source-badge,.source-badge{position:relative;overflow:hidden;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;min-height:30px;padding:5px 10px;font-size:11px;font-weight:750;letter-spacing:.06em;color:#cde8ff;background:linear-gradient(135deg,#234e76,#162e51);border:1px solid #5686b2;border-radius:10px;box-shadow:inset 0 1px 0 #cce9ff22}
.source-badge::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 30%,#d1edff30 50%,transparent 70%);transform:translateX(-120%);animation:source-sheen 1.2s ease-out .2s 1}
.detail-country .source-badge{margin-left:auto}
[data-theme=light] .source-badge,[data-theme=light] button.sp-record .record-source.source-badge{color:#154776;background:linear-gradient(135deg,#e0efff,#cfe3fb);border-color:#88afd2}
@keyframes source-sheen{to{transform:translateX(120%)}}
@media(prefers-reduced-motion:reduce){.source-badge::after{animation:none;display:none}}

/* Branded activity dashboard. The decorative country shape encodes no impact. */
.activity-panel{position:relative;isolation:isolate;overflow:hidden;border:1px solid #537ca4;border-radius:26px;padding:28px;background:radial-gradient(ellipse at 90% 20%,#215b8955,transparent 65%),linear-gradient(140deg,#163551,#101e35);color:#f3f8ff;box-shadow:0 15px 35px #0002}
.activity-panel::before{content:'';position:absolute;inset:0 24px auto;height:3px;background:linear-gradient(90deg,#7dc6ff 40%,#fff 40% 60%,#ff738d 60%);border-radius:4px}
.activity-country{position:absolute;z-index:-1;width:76%;height:auto;right:-8%;top:14%;color:#7dbaf1;opacity:.1;pointer-events:none}
.panel-heading{display:flex;justify-content:space-between;align-items:center;gap:12px}
.panel-brand{display:flex;align-items:center;gap:9px;font-size:13px;font-weight:650;letter-spacing:.02em}
.activity-panel h1{font-size:38px;line-height:1.15;margin:23px 0 8px;letter-spacing:-.045em}
.panel-region{font-size:14px;color:#bacfe3;line-height:1.6;margin:0}
.panel-reading{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:20px;padding:25px 0}
.count-display{display:flex;flex-direction:column;gap:7px;min-width:0}
.count-caption{font-size:14px;color:#c7dbee}
.activity-count{display:block;font-size:96px;line-height:1.05;font-weight:750;font-variant-numeric:tabular-nums;letter-spacing:-.065em;color:#fff;text-shadow:0 5px 24px #8bcaff20;transform-origin:left center}
.count-period{font-size:13px;color:#c7dbee;line-height:1.5}
.peak-reading{display:flex;flex-direction:column;align-items:flex-start;gap:7px;border-left:1px solid #7a9fb54d;padding-left:22px}
.peak-reading>span{width:40px;height:40px;display:grid;place-items:center;background:#79bfff1a;border:1px solid #7ba9cf55;border-radius:12px;color:#9ed3ff}
.peak-reading small{font-size:12px;color:#c7dbee}
.peak-reading strong{font-size:29px;color:var(--mag-color);line-height:1.2;letter-spacing:-.04em}
.panel-foot{display:flex;align-items:center;justify-content:space-between;gap:15px;padding-top:18px;border-top:1px solid #799dbc45}
.panel-foot>span{font-size:13px;color:#dcecff;line-height:1.5}
.panel-foot small{display:block;font-size:11px;max-width:250px;color:#b5cbe0;margin-top:4px}
.panel-foot a{flex-shrink:0}
.catalog-panel{margin:16px 0 0;border:1px solid var(--edge);border-radius:18px;padding:18px;background:var(--surface)}
.catalog-panel .catalog-control{margin:0;gap:9px;font-size:14px}
.catalog-panel .catalog-control small{font-size:12px;line-height:1.55;margin:0}
.count-arrive{animation:count-arrive .65s cubic-bezier(.16,.8,.25,1) both}
@keyframes count-arrive{from{opacity:.3;transform:translateY(12px) scale(.94);filter:blur(3px)}to{opacity:1;transform:none;filter:none}}
[data-theme=light] .activity-panel{background:radial-gradient(ellipse at 90% 20%,#c1e6ff88,transparent 65%),linear-gradient(140deg,#eff7ff,#dceafb);color:#132f4c;border-color:#8cafd0;box-shadow:0 12px 25px #24476b10}
[data-theme=light] .activity-count{color:#163e69;text-shadow:none}
[data-theme=light] .activity-country{color:#225f9b;opacity:.09}
[data-theme=light] .panel-region,[data-theme=light] .count-caption,[data-theme=light] .count-period,[data-theme=light] .peak-reading small,[data-theme=light] .panel-foot>span,[data-theme=light] .panel-foot small{color:#365675}
[data-theme=light] .peak-reading>span{color:#1d5d94}
@media(max-width:800px){.activity-panel{padding:21px;border-radius:23px}.activity-panel h1{font-size:31px;margin-top:21px}.panel-reading{gap:12px;padding:22px 0}.activity-count{font-size:80px}.peak-reading{padding-left:14px}.peak-reading strong{font-size:25px}.peak-reading small{font-size:11px}.count-caption{font-size:13px}.count-period{font-size:12px}.panel-foot{gap:10px}.panel-foot a.sp-control{font-size:13px!important;padding:9px 10px}.panel-foot .sp-icon{width:25px;height:25px}.panel-foot>span{font-size:12px}.panel-foot small{font-size:11px}.catalog-panel{padding:15px}.panel-region{font-size:13px}.activity-country{width:110%;top:23%;right:-24%}}
@media(prefers-reduced-motion:reduce){.count-arrive{animation:none}}

.permission-center{max-width:760px;margin-bottom:26px;border-color:var(--control-border);background:var(--surface)}
.permission-title{display:flex;align-items:center;gap:15px;margin-bottom:20px}.permission-title>.sp-icon{width:46px;height:46px;flex-shrink:0}.permission-title h2{font-size:27px;margin:4px 0}
.permission-steps{list-style:none;padding:0;margin:0}.permission-steps li{padding:21px 0;border-bottom:1px solid var(--edge)}.permission-steps li>strong{font-size:18px}.permission-steps p,.foreground-setting p,.background-pending p{font-size:14px;line-height:1.7;color:var(--muted);margin:10px 0}.permission-steps button{width:100%;justify-content:center}.permission-steps [role=status]:empty{display:none}.permission-center .device-status{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;padding:14px;background:var(--muted-surface);border-radius:12px;font-size:14px}.foreground-setting{padding:22px 0}.foreground-setting h3{font-size:21px}.background-pending{border:1px solid var(--edge);border-left:3px solid #e5b85f;border-radius:12px;padding:15px;font-size:14px}.background-pending p{margin-bottom:0}.notification-entry{display:flex;align-items:center;gap:12px;margin:12px 0 24px;padding:16px;border:1px solid var(--control-border);border-radius:16px;background:linear-gradient(125deg,var(--control-bg),var(--control-bg-end));color:var(--control-ink)}.notification-entry>.sp-icon{width:32px;height:32px;flex-shrink:0}.notification-entry strong{font-size:15px}.notification-entry small{display:block;font-size:12px;margin-top:3px}.notification-entry>span:last-child{margin-left:auto}.permission-center .sp-control{justify-content:center}

.notification-shortcut{position:fixed;z-index:1400;right:22px;bottom:22px;width:min(380px,calc(100% - 24px));padding:10px;border-radius:20px;border:1px solid #6d9fc9;background:linear-gradient(125deg,#173f65,#162c49);color:#f2f8ff;box-shadow:0 10px 32px #0005}
.notification-shortcut-actions{display:flex;align-items:center;gap:4px}.notification-shortcut button{color:inherit;background:transparent;border:0;min-height:44px;font-weight:650;font-size:14px;border-radius:12px}.notification-shortcut button:focus-visible{outline:3px solid #fff;outline-offset:2px}#quick-notifications{display:flex;align-items:center;justify-content:center;gap:10px;flex:1;padding:6px;text-align:left;line-height:1.4}#quick-notifications .sp-icon{width:29px;height:29px;flex-shrink:0}#dismiss-notification-shortcut{flex:0 0 44px;font-size:25px}.notification-shortcut p{font-size:13px;line-height:1.6;margin:10px 7px}.notification-shortcut .quick-note{font-size:11px;color:#c6ddef;margin:0 7px 3px}.notification-shortcut #quick-confirm-notification{background:#295777;border:1px solid #86b9df;width:100%;margin-top:4px}.permission-details summary{font-size:15px;padding:14px 0;cursor:pointer}
body:has(.update-notice:not([hidden])) .notification-shortcut{bottom:145px}
@media(max-width:800px){.notification-shortcut{left:12px;right:12px;width:auto;bottom:calc(98px + env(safe-area-inset-bottom));max-height:50dvh;overflow:auto}body:has(.update-notice:not([hidden])) .notification-shortcut{bottom:calc(205px + env(safe-area-inset-bottom))}}
