:root{--navy:#102442;--navy-2:#1b3458;--blue:#2f6bff;--mint:#2fd4ad;--ink:#14233c;--muted:#71829b;--line:#dee6f0;--pale:#f3f6fa;--red:#e8484e;--amber:#f6aa39;--green:#138d71;--shadow:0 12px 35px rgba(23,44,77,.07)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--pale);color:var(--ink);font-family:Inter,-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Noto Sans JP",Meiryo,sans-serif;-webkit-font-smoothing:antialiased}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.48}button:focus-visible,input:focus-visible,a:focus-visible{outline:3px solid #48abff;outline-offset:3px}a{color:inherit;text-decoration:none}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.app-shell{min-height:100vh;display:flex;flex-direction:column}.topbar{background:var(--navy);height:76px;padding:0 max(32px,calc((100vw - 1480px)/2));display:flex;align-items:center;justify-content:space-between;color:#fff;gap:20px}.brand{display:flex;align-items:center;gap:12px;white-space:nowrap}.brand-mark{position:relative;width:38px;height:38px;border-radius:10px;background:linear-gradient(135deg,#2670ff,#35d5be);display:grid;place-items:center;font-size:24px;font-weight:900;letter-spacing:-.13em;padding-right:5px;line-height:1}.brand-mark span{position:absolute;font-size:15px;top:1px;right:3px;color:#b9ffe9}.brand-copy{display:flex;flex-direction:column;line-height:1.05}.brand-copy strong{font-weight:900;font-size:17px;letter-spacing:.02em}.brand-copy strong span{color:#75e2cf}.brand-copy small{font-size:10px;letter-spacing:.2em;margin-top:6px;font-weight:750;color:#aebdd3}.topbar-right{display:flex;align-items:center;gap:30px}.local-tag{font-size:12px;color:#b9c9db;display:flex;align-items:center;gap:9px}.local-dot{width:7px;height:7px;border-radius:50%;background:var(--mint);box-shadow:0 0 0 4px rgba(47,212,173,.14)}.wall-clock{font-size:27px;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:-.04em}
.workspace{width:min(1480px,100%);margin:auto;padding:38px 32px 72px;flex:1}.headline-row{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:28px}.eyebrow,.section-label{font-size:11px;font-weight:850;letter-spacing:.17em;color:var(--blue)}.eyebrow{margin:0 0 10px}.headline-row h1{font-size:clamp(30px,3.4vw,43px);letter-spacing:-.065em;line-height:1.25;margin:0 0 8px;font-weight:900}.headline-dot{color:var(--blue)}.intro{font-size:14px;color:#61728a;margin:0;line-height:1.8}.top-actions{display:flex;gap:8px;padding-bottom:5px}.button{min-height:43px;display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:10px 16px;border-radius:10px;border:1px solid transparent;font-size:13px;font-weight:800;white-space:nowrap;transition:transform .15s,background .15s,border-color .15s}.button:active{transform:scale(.97)}.button-light{background:#fff;color:#293d5b;border-color:var(--line)}.button-light:hover,.button-outline:hover{border-color:var(--blue);color:var(--blue)}.button-white{background:#fff;color:#a62730}.button-primary{background:var(--blue);color:#fff;box-shadow:0 12px 25px rgba(47,107,255,.22)}.button-primary:hover{background:#1956ec}.button-outline{color:var(--blue);border-color:#adc3fa;background:#f8faff}
.status-strip{background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);border-radius:14px;display:flex;align-items:center;padding:14px 25px;margin-bottom:22px;min-height:74px;gap:0}.status-stat{display:flex;align-items:center;gap:8px;border-right:1px solid var(--line);min-width:180px;padding-right:26px;margin-right:26px;font-size:13px;color:#52657f;font-weight:700}.status-stat strong{font-size:25px;line-height:1;color:var(--ink);font-variant-numeric:tabular-nums;margin-left:auto}.status-stat small{font-size:12px;color:#8290a3}.status-indicator{width:9px;height:9px;border-radius:50%;flex:0 0 auto}.active-indicator{background:#31c8a7}.soon-indicator{background:var(--amber)}.done-indicator{background:var(--red)}.wake-status{margin-left:auto;font-size:11px;font-weight:700;color:#74849b;background:#f1f5f9;border-radius:30px;padding:8px 11px;white-space:nowrap}.alarm-banner{background:linear-gradient(95deg,#c82637,#ec5358);color:#fff;border-radius:13px;padding:15px 20px;display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:20px;box-shadow:0 15px 28px rgba(209,43,61,.2);animation:alarm-in .2s ease}.alarm-banner>div{display:flex;align-items:center;gap:14px}.alarm-banner strong{font-size:16px}.alarm-banner p{font-size:12px;margin:3px 0 0;color:#ffe6e7}.alarm-icon{font-weight:900;font-size:23px;border:2px solid #fff;display:grid;place-items:center;width:39px;height:39px;flex:none;border-radius:50%}@keyframes alarm-in{from{transform:translateY(-8px);opacity:0}to{transform:translateY(0);opacity:1}}.notice{padding:12px 17px;border-radius:10px;margin-bottom:16px;font-size:13px}.warning{background:#fff5e5;color:#89571a;border:1px solid #f1d7ae}
.content-grid{display:grid;grid-template-columns:minmax(280px,340px) minmax(0,1fr);gap:22px;align-items:start}.setup-panel{display:grid;gap:22px}.setup-card{background:#fff;border:1px solid var(--line);border-radius:17px;padding:27px 25px 23px;box-shadow:var(--shadow)}.setup-card h2,.preset-section h2{font-size:21px;letter-spacing:-.045em;margin:7px 0 5px}.section-note{font-size:12px;line-height:1.7;color:#8795a7;margin:5px 0 22px}.setup-card form>label,.form-label{display:block;font-size:12px;font-weight:800;color:#34455e;margin:0 0 8px}.setup-card input{width:100%;min-height:46px;border-radius:9px;border:1px solid #d5dfeb;background:#f9fbfe;padding:10px 12px;color:var(--ink);outline:none;font-size:14px}.setup-card input:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(47,107,255,.12)}.setup-card input::placeholder{color:#aab7c6}.setup-card input[name=station],.setup-card input[name=item]{margin-bottom:20px}.duration-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px}.duration-fields>div{position:relative}.duration-fields input{font-size:24px;font-weight:800;font-variant-numeric:tabular-nums;padding-right:35px;appearance:textfield;-moz-appearance:textfield}.duration-fields input::-webkit-outer-spin-button,.duration-fields input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.duration-fields span{position:absolute;right:15px;top:50%;transform:translateY(-50%);font-size:13px;color:#8a9aaa;font-weight:700}.start-button{width:100%;margin-top:22px;height:49px;justify-content:center}.start-button span:last-child{margin-left:auto}.start-button span:first-child{font-size:11px}.text-button{display:block;margin:14px auto 0;background:none;border:0;color:var(--blue);font-size:12px;font-weight:800;padding:5px;text-decoration:underline;text-decoration-color:#b3c9ff;text-underline-offset:4px}.text-button:hover{color:#164fda}.form-error{font-size:12px;color:#b72d3b;background:#fff2f3;padding:8px 10px;border-radius:7px;margin:10px 0 -9px}
.preset-section{padding:22px 3px}.preset-heading{display:flex;justify-content:space-between;align-items:center;padding:0 8px}.preset-heading h2{margin-bottom:0}.count-chip{font-size:11px;color:#60738d;background:#e7edf5;border-radius:99px;padding:5px 9px;font-weight:800}.preset-section .section-note{margin:11px 8px 12px}.preset-list{display:grid;gap:8px}.preset-empty{border:1px dashed #c8d4e3;border-radius:11px;background:#f9fbfe;color:#8999ad;font-size:12px;padding:18px;text-align:center;line-height:1.7}.preset-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:4px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:5px;min-width:0}.preset-start{border:0;background:none;text-align:left;display:flex;align-items:center;gap:10px;padding:8px;min-width:0;color:var(--ink)}.preset-start:hover{color:var(--blue)}.preset-play{width:26px;height:26px;background:#e6efff;border-radius:7px;color:var(--blue);display:grid;place-items:center;font-size:11px;flex:0 0 auto}.preset-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:800;font-size:12px}.preset-time{font-size:12px;font-weight:850;font-variant-numeric:tabular-nums;color:var(--blue);white-space:nowrap}.tiny-button{background:none;border:0;color:#99a7b7;font-size:12px;padding:8px 4px}.tiny-button:hover{color:var(--ink)}
.board{background:#fff;border-radius:17px;border:1px solid var(--line);box-shadow:var(--shadow);min-height:690px;padding:27px 27px 22px}.board-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:15px;border-bottom:1px solid var(--line);padding-bottom:21px}.board-heading h2{font-size:21px;letter-spacing:-.04em;margin:8px 0 0}.board-count{font-size:13px;color:var(--blue);background:#ecf2ff;padding:3px 9px;border-radius:99px;margin-left:5px;vertical-align:3px}.board-tools{display:flex;align-items:center;gap:9px;font-size:12px}.sound-state{font-weight:800;color:var(--green)}.sound-state.off{color:#8b9aac}.plain-button{background:none;border:1px solid var(--line);border-radius:7px;color:#60728b;padding:7px 10px;font-size:11px;font-weight:750}.plain-button:hover{border-color:var(--blue);color:var(--blue)}.empty-state{text-align:center;padding:77px 12px 70px}.empty-illustration{width:124px;height:105px;margin:0 auto 28px;border:8px solid #dbe6fa;border-radius:21px;background:linear-gradient(135deg,#fff,#f4f8ff);display:flex;align-items:center;justify-content:center;position:relative;color:var(--blue);font-size:26px;font-weight:900;letter-spacing:-.05em;box-shadow:14px 13px 0 #e9f0fb}.empty-illustration i{position:absolute;width:7px;height:7px;border-radius:50%;background:var(--mint);bottom:8px;left:37px}.empty-illustration i:nth-child(3){left:51px;background:#8ab1ff}.empty-illustration i:nth-child(4){left:65px;background:#8ab1ff}.empty-state h3{font-size:18px;margin:0 0 9px}.empty-state p{font-size:13px;line-height:1.9;color:#8594a7;margin:0 0 25px}.board-tip{font-size:11px;line-height:1.7;color:#8997aa;border-top:1px solid var(--line);padding-top:17px;margin:24px 2px 0}.board-tip span{color:#718dae;font-size:14px;margin-right:4px}
.timer-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:21px}.timer-card{position:relative;overflow:hidden;border:1px solid #dce6f1;border-radius:13px;background:#fbfdff;padding:18px 18px 15px;min-width:0;transition:border-color .2s,box-shadow .2s}.timer-card.running{border-color:#b8d8d0;background:linear-gradient(165deg,#f9fffd,#fff 60%)}.timer-card.soon{border-color:#eec987;background:linear-gradient(155deg,#fffaf0,#fff 65%)}.timer-card.done:not(.acknowledged){background:#fff4f3;border-color:#ec9499;box-shadow:0 4px 15px rgba(232,72,78,.1)}.timer-card.paused{background:#f8faff}.timer-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.station-badge{display:inline-flex;align-items:center;border-radius:7px;background:#eaf1fa;padding:5px 8px;font-size:11px;font-weight:850;color:#3c597c;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.timer-card.done:not(.acknowledged) .station-badge{background:#ffe1e1;color:#b52f38}.timer-delete{border:0;background:none;color:#a1afbf;font-size:18px;line-height:1;padding:2px 5px}.timer-delete:hover{color:#c72d37}.timer-card h3{font-size:16px;margin:12px 0 3px;font-weight:850;letter-spacing:-.035em;overflow-wrap:anywhere}.timer-meta{font-size:11px;color:#8898aa}.timer-main{display:flex;align-items:end;justify-content:space-between;gap:6px;margin:15px 0 12px}.timer-display{font-size:clamp(37px,4.1vw,60px);font-weight:900;line-height:1;letter-spacing:-.065em;font-variant-numeric:tabular-nums;color:#18304e}.timer-card.soon .timer-display{color:#bd7a13}.timer-card.done:not(.acknowledged) .timer-display{color:#d53947}.timer-state{font-size:11px;font-weight:850;color:#128d6a;background:#e2f8ef;padding:6px 8px;border-radius:7px;white-space:nowrap}.timer-card.soon .timer-state{color:#a46a12;background:#fff0cd}.timer-card.paused .timer-state{color:#587299;background:#e9f0f9}.timer-card.done .timer-state{color:#ba3039;background:#ffe3e2}.timer-card.done.acknowledged .timer-state{color:#65798d;background:#e9eff5}.progress-track{height:7px;background:#e8eef4;border-radius:99px;overflow:hidden;margin:0 0 14px}.progress-fill{height:100%;width:100%;background:linear-gradient(90deg,#30bdb9,#38d7a7);border-radius:99px;transition:width .2s linear}.timer-card.soon .progress-fill{background:var(--amber)}.timer-card.done .progress-fill{background:var(--red)}.timer-card.paused .progress-fill{background:#9bb2ce}.timer-controls{display:flex;gap:7px;flex-wrap:wrap}.timer-controls button{border:1px solid #dbe5ef;background:#fff;color:#35506d;border-radius:8px;padding:8px 10px;font-size:11px;font-weight:850;min-height:36px}.timer-controls button:hover{border-color:#80a8ef;color:var(--blue)}.timer-controls .control-primary{background:#234f9a;color:#fff;border-color:#234f9a;flex:1}.timer-controls .control-primary:hover{background:#173c7b;color:#fff}.timer-card.done:not(.acknowledged) .timer-controls .control-primary{background:#d43242;border-color:#d43242}.timer-card.done:not(.acknowledged) .timer-controls .control-primary:hover{background:#af2936}.timer-controls .control-secondary{flex:1}.timer-card.acknowledged{opacity:.72}.timer-card.acknowledged:hover{opacity:1}
.footer{background:#eaf0f6;color:#8494a7;padding:17px max(32px,calc((100vw - 1480px)/2));display:flex;justify-content:space-between;gap:12px;font-size:10px;font-weight:700;letter-spacing:.03em}.toast{position:fixed;left:50%;bottom:25px;transform:translate(-50%,12px);opacity:0;pointer-events:none;background:#172a46;color:#fff;padding:11px 18px;font-size:12px;font-weight:750;border-radius:9px;box-shadow:0 8px 30px #10244233;z-index:10;transition:.2s}.toast.show{transform:translate(-50%,0);opacity:1}
@media(max-width:1100px){.status-stat{min-width:135px;padding-right:15px;margin-right:15px}.wake-status{font-size:10px}.timer-grid{grid-template-columns:1fr}.timer-display{font-size:58px}}@media(max-width:800px){.workspace{padding:28px 18px 50px}.content-grid{grid-template-columns:1fr}.setup-panel{grid-template-columns:1fr 1fr;gap:17px}.preset-section{padding:22px 9px}.board{min-height:450px}.timer-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.timer-display{font-size:clamp(34px,6vw,55px)}.status-strip{flex-wrap:wrap;gap:10px}.status-stat{flex:1;min-width:130px}.wake-status{margin-left:0}}@media(max-width:600px){.topbar{height:67px;padding:0 17px}.brand-mark{width:34px;height:34px}.brand-copy strong{font-size:14px}.brand-copy small{font-size:8px}.topbar-right{gap:9px}.local-tag{display:none}.wall-clock{font-size:23px}.workspace{padding:24px 14px 38px}.headline-row{align-items:start;flex-direction:column;gap:16px;margin-bottom:20px}.headline-row h1{font-size:31px}.top-actions{padding:0}.status-strip{padding:10px;gap:0;margin-bottom:15px}.status-stat{min-width:0;flex:1;gap:4px;padding:3px 8px;margin:0;border-right:1px solid var(--line);font-size:10px;flex-wrap:wrap}.status-stat:last-of-type{border-right:0}.status-stat strong{font-size:22px}.status-stat small{display:none}.status-indicator{width:7px;height:7px}.wake-status{width:100%;text-align:center;margin-top:6px}.alarm-banner{flex-direction:column;align-items:stretch}.alarm-banner .button{width:100%}.content-grid{gap:17px}.setup-panel{grid-template-columns:1fr;gap:0}.setup-card{padding:22px 20px}.preset-section{padding:24px 10px}.board{padding:21px 15px;min-height:370px}.board-heading{align-items:start;flex-wrap:wrap}.board-tools{flex-wrap:wrap}.board-heading h2{font-size:18px}.timer-grid{grid-template-columns:1fr}.timer-card{padding:18px}.timer-display{font-size:58px}.empty-state{padding:62px 12px}.footer{padding:18px 14px;flex-direction:column;gap:5px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}

/* Supporting information, guide, and clearly separated sponsor placement. */
.help-link{display:inline-flex;align-items:center;justify-content:center;color:#e4efff;font-size:12px;font-weight:800;border:1px solid #8296b2;border-radius:8px;padding:9px 12px;white-space:nowrap}
.help-link:hover,.help-link:focus-visible{background:#203b60;color:#fff}
.seo-info{margin-top:30px;padding:28px 32px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);border-radius:17px;display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,310px);align-items:center;gap:36px}
.seo-info h2{font-size:clamp(20px,2.3vw,28px);line-height:1.45;letter-spacing:-.04em;margin:8px 0 15px}
.seo-info p:not(.section-label){font-size:13px;line-height:1.95;color:#536783;margin:0 0 12px;max-width:760px}
.seo-link{display:inline-flex;align-items:center;gap:6px;margin-top:6px;color:#235cd9;font-size:13px;font-weight:850;text-decoration:underline;text-underline-offset:4px}
.seo-link:hover{color:#123d96}
.seo-benefits{display:grid;gap:10px;padding:0;margin:0;list-style:none}
.seo-benefits li{display:flex;align-items:center;gap:10px;font-size:12px;color:#4c627e;background:#f3f7fd;border:1px solid #e5edf8;border-radius:10px;padding:12px}
.seo-benefits strong{flex:none;color:#204d94;font-size:11px;background:#e0ebff;border-radius:6px;padding:5px 7px}
.ad-slot{grid-column:1/-1;justify-self:center;display:flex;flex-direction:column;align-items:center;gap:10px;width:282px;max-width:100%;margin:0;padding:15px 16px 16px;border:1px solid #dce5f0;border-radius:14px;background:#f9fbff}
.ad-label{align-self:flex-start;color:#75869d;font-size:11px;font-weight:750;letter-spacing:.08em}
.ad-slot a{display:flex;flex-direction:column;align-items:center;gap:9px;width:250px;max-width:100%;color:#235cd9;font-size:12px;font-weight:800}
.ad-slot a:hover{text-decoration:underline}
.ad-slot a img{display:block;width:250px;height:250px;max-width:100%;object-fit:contain;background:#edf2f8}
.ad-action{line-height:1.5;text-align:center}
.ad-tracking{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.footer a:hover{text-decoration:underline}

.button-guide{background:#fff;color:#183a69;border-color:#fff}
.button-guide:hover{background:#eaf3ff}
.guide-workspace{width:min(1080px,100%)}
.breadcrumbs{display:flex;align-items:center;gap:10px;margin:0 0 28px;color:#72829a;font-size:12px}
.breadcrumbs a{color:#275dd2;font-weight:750}
.breadcrumbs a:hover{text-decoration:underline}
.guide-intro{background:linear-gradient(120deg,#fff 35%,#e8f2ff);border:1px solid var(--line);border-radius:18px;padding:36px 42px;box-shadow:var(--shadow)}
.guide-intro h1{font-size:clamp(27px,3.7vw,42px);line-height:1.4;letter-spacing:-.05em;margin:8px 0 12px}
.guide-intro>p:not(.eyebrow){max-width:720px;color:#526782;line-height:1.85;font-size:14px;margin:0 0 22px}
.guide-article{background:#fff;border:1px solid var(--line);border-radius:18px;padding:12px 42px 38px;margin:22px 0;box-shadow:var(--shadow)}
.guide-article section{padding:27px 0;border-bottom:1px solid var(--line)}
.guide-article section:last-child{border-bottom:0;padding-bottom:4px}
.guide-article h2{font-size:22px;letter-spacing:-.04em;line-height:1.5;margin:7px 0 13px}
.guide-article p:not(.section-label){font-size:14px;line-height:1.95;color:#4e617d;margin:10px 0 0}
.guide-article .guide-note{background:#f3f8ff;border:1px solid #dce9fa;border-radius:12px;padding:24px;margin:20px 0 0}
.guide-article .guide-note h2{margin:0 0 8px;font-size:19px}
.guide-article details{border:1px solid var(--line);border-radius:10px;padding:14px 17px;margin-top:10px}
.guide-article summary{cursor:pointer;font-weight:800;font-size:14px;line-height:1.6;color:#223b59}
.guide-article details p{padding-top:4px}
.guide-cta{display:flex;justify-content:space-between;align-items:center;gap:20px;border-radius:15px;background:#17375f;color:#fff;padding:26px 30px}
.guide-cta strong{font-size:18px}
.guide-cta p{font-size:12px;line-height:1.7;color:#d4e3f2;margin:7px 0 0}
@media(min-width:1500px){.workspace:not(.guide-workspace){width:min(1700px,100%)}.topbar,.footer{padding-left:max(32px,calc((100vw - 1636px)/2));padding-right:max(32px,calc((100vw - 1636px)/2))}.content-grid{grid-template-columns:minmax(280px,340px) minmax(0,1fr) 282px}.ad-slot{grid-column:3;justify-self:stretch;align-self:start}}
@media(max-width:800px){.seo-info{grid-template-columns:1fr;gap:18px}.seo-benefits{grid-template-columns:repeat(3,minmax(0,1fr))}.seo-benefits li{flex-direction:column;align-items:flex-start}.guide-intro,.guide-article{padding-left:28px;padding-right:28px}}
@media(max-width:600px){.topbar{gap:8px}.button-guide{padding:8px;font-size:11px}.seo-info{margin-top:22px;padding:23px 20px}.seo-benefits{grid-template-columns:1fr;gap:7px}.seo-benefits li{flex-direction:row}.guide-workspace{padding-top:20px}.breadcrumbs{margin-bottom:16px}.guide-intro,.guide-article{padding-left:20px;padding-right:20px}.guide-article{padding-top:0}.guide-intro h1{font-size:28px}.guide-article h2{font-size:20px}.guide-cta{align-items:flex-start;flex-direction:column;padding:23px}.guide-cta .button{width:100%}}
