:root{--ink:#213b37;--muted:#6b7a73;--green:#087e68;--line:#dee5df;--paper:#fff;--bg:#f6f7f2}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.7 -apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif}a{color:inherit}button,input{font:inherit;color:inherit}button{cursor:pointer;background:white;border:1px solid var(--line);border-radius:9px;padding:10px 15px;min-height:44px}button:hover{border-color:var(--green);background:#f0f7f2}button:disabled{opacity:.45;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #319b82;outline-offset:4px}[hidden]{display:none!important}.site-header{display:flex;align-items:center;justify-content:space-between;background:white;border-bottom:1px solid var(--line);padding:24px max(24px,calc((100vw - 1120px)/2))}.brand{display:flex;gap:12px;align-items:center;text-decoration:none;font-size:18px;font-weight:650;line-height:1.4}.brand-mark{display:grid;place-items:center;width:43px;height:43px;border-radius:12px;color:white;background:var(--green);font-size:27px;font-weight:500}.brand small{display:block;color:var(--muted);font-size:10px;letter-spacing:.18em;margin-top:4px}.preview{font-size:11px;letter-spacing:.1em;color:var(--muted);border:1px solid var(--line);padding:3px 10px;border-radius:30px}main,footer{max-width:1168px;margin:auto;padding:0 24px}nav{display:flex;flex-wrap:wrap;gap:8px;padding-top:28px}nav a{font-size:13px;text-decoration:none;padding:7px 14px;border-radius:30px;color:var(--muted)}nav a[aria-current]{background:#e1ede5;color:#21664f;font-weight:600}.intro{display:flex;justify-content:space-between;align-items:center;padding:44px 0 34px}.eyebrow{font-size:11px;letter-spacing:.22em;color:var(--green);margin:0 0 12px}h1{font-size:clamp(25px,3.6vw,39px);letter-spacing:.025em;font-weight:600;line-height:1.4;margin:0}.intro p:last-child{color:var(--muted);margin:14px 0 0}.globe{font-size:78px;line-height:1;text-align:center;color:#90b19d;transform:rotate(-10deg);padding:0 28px}.globe span{display:block;font-size:10px;letter-spacing:.05em;transform:rotate(10deg);margin-top:13px}.controls{padding:22px 26px;border-radius:16px;background:#eaf0e9;border:1px solid #d9e4d7}.control-top{display:flex;align-items:center;justify-content:space-between;gap:15px}.mode-switch{display:flex;padding:4px;background:#dfe8df;border-radius:11px;gap:4px}.mode-switch button{background:transparent;border:0;font-size:13px;padding:8px 17px;min-height:40px}.mode-switch button.active{background:white;box-shadow:0 2px 5px #233f3210;color:#07694f}.control-top>span{font-size:12px;color:var(--muted)}.basis{font-size:13px;margin:15px 0 0}.plan-fields{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px;padding-top:20px}label{font-size:12px}input{display:block;border:1px solid #bdcdc0;border-radius:8px;background:white;padding:10px;max-width:100%;min-height:46px;margin-top:5px}button.primary{background:var(--green);color:white;border-color:var(--green)}.error{font-size:13px;color:#a12d36;margin:10px 0 0}.section-heading{display:flex;justify-content:space-between;align-items:center;margin:31px 0 15px}h2{font-size:16px;font-weight:600;margin:0}.section-heading>span{color:var(--muted);font-size:12px}.clocks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.clock-card{position:relative;border:1px solid var(--line);background:var(--paper);border-radius:15px;padding:24px 25px 21px;overflow:hidden}.clock-card.home{border-color:#92b7a0;background:#f1f7ef}.city-head{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}.city-head h3{font-size:19px;margin:0;font-weight:600}.city-head p{margin:3px 0 0;font-size:10px;letter-spacing:.12em;color:var(--muted)}.remove{padding:0;width:32px;min-height:32px;border:0;background:transparent;color:#84938c;font-size:20px;margin:-7px -10px 0 0}.base-tag{font-size:10px;background:#dbe9db;padding:3px 9px;border-radius:20px}.date{margin:22px 0 0;font-size:12px;color:var(--muted)}.time{font-variant-numeric:tabular-nums;font-size:48px;letter-spacing:-.035em;font-weight:400;line-height:1.25;margin:4px 0 12px}.time small{font-size:20px;letter-spacing:0;color:#93a39b;margin-left:5px}.offset{display:flex;justify-content:space-between;gap:5px;font-size:11px;color:var(--muted)}.status{font-size:11px;margin-top:20px;display:flex;gap:7px;align-items:center}.status:before{content:'';width:6px;height:6px;border-radius:50%;background:#a9b2ac}.status.working{color:#167553}.status.working:before{background:#33865c}.day-strip{height:4px;position:relative;background:linear-gradient(to right,#e5e8e2 0% 37.5%,#bbd7ba 37.5% 75%,#e5e8e2 75%);border-radius:5px;margin-top:10px}.day-strip:after{content:'';position:absolute;left:var(--position);top:-2px;width:3px;height:8px;background:#315e46;border-radius:2px;transform:translateX(-50%)}.city-picker{border-top:1px solid var(--line);margin-top:30px;padding:25px 0 10px}.city-picker p{color:var(--muted);font-size:12px;margin:5px 0 14px}.city-options{display:flex;gap:9px;flex-wrap:wrap}.city-options button{border-radius:30px;font-size:12px;padding:6px 15px;min-height:38px}.city-options button[aria-pressed=true]{background:#eaf0e9;color:#738177;border-color:transparent}.notes{display:grid;grid-template-columns:230px 1fr;gap:20px;border-top:1px solid var(--line);padding:30px 0 40px;margin-top:10px}.notes p{font-size:12px;color:var(--muted);margin:0 0 10px}.notes strong{font-weight:500;color:var(--ink)}.key{display:inline-block;background:#bbd7ba;width:8px;height:8px;margin-right:7px;border-radius:2px}footer{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:23px;padding-bottom:30px;font-size:11px;color:var(--muted)}@media(max-width:850px){.clocks{grid-template-columns:repeat(2,minmax(0,1fr))}.globe{display:none}.notes{grid-template-columns:1fr;gap:12px}}@media(max-width:520px){.site-header{padding:19px 18px}.brand{font-size:16px}main,footer{padding-left:18px;padding-right:18px}nav{gap:2px}nav a{font-size:11px;padding:6px 9px}.intro{padding:30px 0 25px}.intro p:last-child{font-size:13px}.controls{padding:16px}.control-top{align-items:flex-start;flex-direction:column;gap:9px}.mode-switch{width:100%}.mode-switch button{flex:1;font-size:12px;padding:8px}.clocks{gap:10px}.clock-card{padding:17px 13px}.city-head h3{font-size:15px}.city-head p{font-size:8px;letter-spacing:.07em}.base-tag{font-size:8px;padding:3px 5px}.date{font-size:10px;margin-top:18px}.time{font-size:35px}.time small{font-size:13px;margin-left:2px}.offset{flex-direction:column;gap:0;font-size:10px}.status{font-size:10px;margin-top:15px}.remove{margin-right:-6px}.plan-fields label{width:100%}.plan-fields input{width:100%}.plan-fields button{font-size:12px;padding:8px 12px}footer{gap:10px;font-size:10px}}
/* Two-place comparison, expanded only when requested. */
.clocks{grid-template-columns:repeat(2,minmax(0,1fr))}.clock-card{padding:28px 30px}.time{font-size:60px}.city-head h3{font-size:23px}.city-head p{font-size:11px;letter-spacing:.015em;overflow-wrap:anywhere}.difference{font-size:22px;font-weight:700;line-height:1.6;min-height:24px;margin:18px 0 0;padding:14px 16px;border-radius:12px;background:#edf4ed;color:#28553e}.change-city{margin-top:22px;border:0;border-top:1px solid var(--line);border-radius:0;padding:12px 0 0;background:transparent;width:100%;text-align:left;font-size:12px;color:var(--muted)}.change-city span{float:right}.base-source{font-size:11px;color:var(--muted);margin:6px 0 0}.add-city{background:transparent;font-size:12px;border-radius:25px;min-height:38px;padding:6px 13px}.picker-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.picker-head button{font-size:12px}.city-picker{background:white;border:1px solid var(--line);border-radius:16px;padding:22px}.city-picker input{width:100%;max-width:100%;margin-top:8px}.city-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));max-height:360px;overflow:auto;padding:4px}.city-options button{border-radius:9px;text-align:left;min-width:0;padding:10px 12px}.city-options strong{display:block;font-size:13px;font-weight:500}.city-options small{display:block;color:var(--muted);font-size:10px;overflow-wrap:anywhere}.city-options button:disabled{opacity:.5;background:#edf1eb}.announcement{font-size:12px;color:var(--muted)}#ambiguity{padding-top:16px}#ambiguity select{display:block;max-width:100%;margin-top:5px;padding:10px;border:1px solid #bdcdc0;background:white;border-radius:8px;color:var(--ink);font:inherit}@media(max-width:650px){.clocks{grid-template-columns:1fr}.clock-card{padding:22px 25px}.time{font-size:55px}.city-head h3{font-size:21px}.city-head p{font-size:10px}.date{font-size:12px;margin-top:17px}.offset{flex-direction:row;font-size:11px}.status{font-size:11px}.difference{font-size:19px}.change-city{margin-top:15px}.city-options{grid-template-columns:repeat(2,minmax(0,1fr))}.city-picker{padding:17px}.section-heading{gap:9px}.section-heading h2{font-size:14px}.add-city{font-size:10px;padding:7px 10px}.base-tag{font-size:10px}.time small{font-size:20px}}