:root{color-scheme:dark;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#090a0c;color:#f5f5f7;--muted:#999ba3;--accent:#ff9f0a}*{box-sizing:border-box}body{margin:0}main{max-width:1400px;margin:auto;padding:env(safe-area-inset-top) max(24px,env(safe-area-inset-right)) env(safe-area-inset-bottom) max(24px,env(safe-area-inset-left))}a{color:inherit}nav{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:25px 0;color:var(--muted);font-size:12px}.home{text-decoration:none}.home:hover{color:white}.wordmark{font-size:10px;letter-spacing:.24em;color:#c4c5ca}header{display:flex;align-items:center;justify-content:space-between;padding:20px 0 28px}h1{font-size:clamp(27px,4vw,40px);letter-spacing:-.045em;margin:0}header p{color:var(--muted);margin:7px 0 0;font-size:13px}button,input{font:inherit}button{cursor:pointer;border:1px solid #3c3e44;background:#202125;color:white;border-radius:12px;min-height:44px;padding:8px 16px}button:hover{background:#303238}button:disabled{opacity:.4;cursor:default}:focus-visible{outline:2px solid var(--accent);outline-offset:4px}.add{width:58px;height:58px;padding:0;border-radius:50%;font-size:40px;line-height:1;color:var(--accent);font-weight:300}.map-frame{height:clamp(360px,51vw,640px);border:1px solid #2e3035;border-radius:16px;overflow:hidden;background:#222428}#map{display:block;width:100%;height:100%}.legend{display:flex;gap:22px;align-items:center;padding:17px 2px;color:#a7a9b1;font-size:11px}.legend span{display:flex;align-items:center;gap:7px}.legend i{display:inline-block;width:8px;height:8px;border-radius:50%;background:#b5b8bf}.legend .night{background:#22242a;border:1px solid #5b606e}.legend .line{height:1px;width:14px;border-radius:0;background:#d1d6df}.legend .live{margin-left:auto;font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:#b6b8be}.live:before{content:"";width:5px;height:5px;background:#b5ce9d;border-radius:50%}.clocks{display:flex;gap:14px;overflow-x:auto;padding:4px 0 14px;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:#3b3d45 transparent}.card{flex:0 0 176px;scroll-snap-align:start;background:#1f2024;border:1px solid #393b42;border-radius:21px;padding:19px 12px 15px;text-align:center}.face{display:block;width:108px;height:108px;margin:0 auto 16px}.card h2{font-size:16px;letter-spacing:-.025em;margin:0 0 6px}.card .time{font-size:13px;color:#c4c6cd;font-variant-numeric:tabular-nums;white-space:nowrap}.card .date{font-size:11px;color:#989ba6;margin-top:5px}.card .state{display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:12px;margin-top:9px;color:#8cb9ff}.card .state::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;box-shadow:0 0 0 2px #1114}.card .state.daylight{color:#ffbe50}.card .state.twilight{color:#dcb49a}.notice:empty{display:none}.notice{font-size:12px;color:#c5bba9}footer{padding:28px 0 30px;text-align:center}footer>p:first-child{color:#d7d8dd;font-size:14px}.download{display:inline-flex;gap:24px;align-items:center;padding:13px 18px;border:1px solid #34363d;border-radius:12px;text-decoration:none;font-size:12px}.download:hover{border-color:#ff9f0a}.download span{color:var(--accent)}footer small{display:block;color:#999ba3;font-size:10px;margin-top:9px}.privacy{color:#999ba3;font-size:11px;margin:25px 0 0;line-height:1.6}dialog{width:min(480px,calc(100% - 24px));max-height:85dvh;padding:24px;border:1px solid #41434a;border-radius:22px;background:#191a1f;color:#f5f5f7;box-shadow:0 30px 100px #0009}dialog::backdrop{background:#000a;backdrop-filter:blur(5px)}.dialog-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}h2{margin:0;font-size:23px}.dialog-head p{font-size:12px;color:#a7a9b1}.dialog-head button{font-size:24px;padding:0;min-width:44px}.search-label{display:block;font-size:12px;margin:18px 0 8px;color:#bcbec6}input[type=search]{width:100%;padding:12px;border-radius:10px;border:1px solid #454750;background:#101115;color:white;font-size:14px}#city-list{max-height:40dvh;overflow:auto;margin-top:14px}.city-choice{display:flex;align-items:center;gap:12px;padding:12px 4px;cursor:pointer;border-bottom:1px solid #2a2c32;font-size:14px}.city-choice input{width:19px;height:19px;accent-color:var(--accent)}.city-choice small{display:block;color:#999ba3;font-size:11px;margin-top:3px;line-height:1.35}.dialog-actions{display:flex;align-items:center;gap:8px;margin-top:20px}#count{margin-right:auto;font-size:11px;color:#b4b6bf}#done{background:var(--accent);border-color:var(--accent);color:#17120a;font-weight:650}#empty{color:#b4b6bf;font-size:13px}@media(max-width:600px){main{padding-left:max(14px,env(safe-area-inset-left));padding-right:max(14px,env(safe-area-inset-right))}nav{padding:20px 0 10px}.wordmark{font-size:9px}header{padding:24px 0}.add{width:50px;height:50px;font-size:35px}.map-frame{height:440px;border-radius:12px}.legend{gap:12px;font-size:10px}.card{flex-basis:156px}.face{width:100px;height:100px}.legend .live{display:none}dialog{padding:18px}}