@charset "UTF-8";
:root{color-scheme:dark;--bg:#141713;--panel:#1d211b;--line:#343a2f;--text:#f1f3ea;--muted:#a2ab98;--green:#c7f879;--ink:#1c2712;font-family:Inter,"Noto Sans JP",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-synthesis:none;scroll-behavior:smooth}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-size:14px;line-height:1.7}a{color:inherit;text-underline-offset:4px}button,input,select{font:inherit}button,a,input,select,summary{-webkit-tap-highlight-color:transparent}button,select,summary{cursor:pointer}button{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid var(--green);outline-offset:5px}button:disabled{cursor:default;opacity:.6}[hidden]{display:none!important}.wrap{width:min(1120px,calc(100% - 64px));margin-inline:auto}.site-header{height:96px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:inline-flex;gap:9px;align-items:center;text-decoration:none;font-size:28px;font-weight:750;letter-spacing:-1.7px;line-height:1}.brand-dot{color:var(--green);margin-left:-9px}.header-link{font-size:13px;text-decoration:none}.header-link span{margin-left:12px;color:var(--green);font-size:20px}.intro{padding:54px 0 35px}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:650;color:var(--muted);margin:0 0 16px;display:flex;align-items:center;gap:9px}.eyebrow>span{width:6px;height:6px;border-radius:50%;background:var(--green)}h1{margin:0;font-size:clamp(28px,3.5vw,42px);font-weight:680;line-height:1.4;letter-spacing:-1.3px}.green{color:var(--green)}.mobile-break{display:none}.intro-copy{color:var(--muted);font-size:13px;line-height:1.9;margin:17px 0 0}.workspace{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(300px,1fr);gap:24px;align-items:stretch}.surface-card{overflow:hidden;background:var(--panel);border:1px solid var(--line);border-radius:20px;display:flex;flex-direction:column;min-width:0}.surface-bar,.surface-footer{display:flex;align-items:center;justify-content:space-between;padding:17px 22px;min-height:58px;gap:10px}.surface-bar{border-bottom:1px solid var(--line)}.surface-status{display:flex;align-items:center;gap:8px;font-size:12px}.surface-status i{width:6px;height:6px;background:#89927e;border-radius:50%}.surface-status i.running{background:var(--green);box-shadow:0 0 10px #c7f83750}.surface-tag{font-size:9px;letter-spacing:1.5px;color:var(--muted)}.surface{position:relative;flex:1;min-height:380px;background:#171b15;overflow:hidden;isolation:isolate;touch-action:pan-y}canvas{display:block;width:100%;height:100%;position:absolute;inset:0}.surface-idle{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;background:#161b15c4;pointer-events:none}.surface-idle svg{width:60px;height:90px;color:var(--green);margin-bottom:23px;filter:drop-shadow(0 0 22px #c7f83020)}.surface-idle strong{font-size:16px;font-weight:550}.surface-idle span{color:var(--muted);font-size:12px;margin-top:6px}.surface-footer{border-top:1px solid var(--line);font-size:11px;color:var(--muted)}.text-button{display:inline-flex;align-items:center;gap:5px;border:0;background:none;padding:4px 0;color:var(--green);font-size:12px;white-space:nowrap}.text-button span{font-size:19px}.controls{border:1px solid var(--line);border-radius:20px;background:var(--panel);padding:24px}.controls-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:23px;gap:10px}.controls-top h2{font-size:15px;font-weight:600;margin:0}.controls-top>span{color:var(--muted);font-size:9px;letter-spacing:1px}.pattern-control{border:0;padding:0;margin:0 0 21px;min-width:0}.pattern-control legend{padding:0;margin-bottom:10px;font-size:12px;width:100%;display:flex;justify-content:space-between;gap:8px}.pattern-control legend span{font-size:10px;color:var(--muted)}.pattern-options{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.pattern-options label{position:relative;cursor:pointer}.pattern-options input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}.pattern-choice{display:flex;flex-direction:column;align-items:center;border:1px solid #444c3b;background:#23281f;border-radius:10px;padding:10px 5px 6px;gap:7px}.pattern-choice b{font-size:11px;font-weight:500}.pattern-options input:checked+.pattern-choice{border-color:var(--green);background:#2d3823;color:var(--green)}.pattern-options input:focus-visible+.pattern-choice{outline:2px solid var(--green);outline-offset:3px}.swatch{width:44px;height:24px;display:block;border-radius:3px;color:#bac7a6}.swatch-noise{background-image:radial-gradient(#bac7a6 1px,transparent 1.5px),radial-gradient(#bac7a6 1.5px,transparent 2px);background-size:7px 8px,11px 9px;background-position:0 0,3px 4px}.swatch-checker{background:conic-gradient(#bac7a6 25%,transparent 0 50%,#bac7a6 0 75%,transparent 0);background-size:10px 10px}.swatch-stripes{background:repeating-linear-gradient(120deg,#bac7a6 0 2px,transparent 2px 6px)}.range-control{margin-bottom:17px}.range-control>label{display:flex;justify-content:space-between;font-size:12px;margin-bottom:8px}.range-control output{font-family:ui-monospace,monospace;color:var(--green);font-size:11px}input[type=range]{width:100%;margin:0;height:24px;accent-color:var(--green);cursor:pointer}.range-ends{display:flex;justify-content:space-between;font-size:9px;color:var(--muted)}.timer-control{display:flex;align-items:center;justify-content:space-between;font-size:12px;margin:0 0 18px}.timer-control select{background:#262e20;color:var(--text);border:1px solid #454e3c;border-radius:8px;padding:7px 10px;font-size:12px;min-width:130px;min-height:40px}.wake-control{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:18px;gap:10px}.wake-control label{font-size:12px}.wake-control p{font-size:10px;color:var(--muted);margin:4px 0 0;line-height:1.5}.wake-control p[data-state=active]{color:var(--green)}.wake-control p[data-state=error],.wake-control p[data-state=unsupported],.wake-control p[data-state=paused]{color:#edcb8b}.switch{position:relative;display:block;width:42px;height:28px;flex-shrink:0}.switch input{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer;margin:0;z-index:1}.switch span{position:absolute;inset:3px 0;border-radius:30px;background:#56604c;transition:background .15s}.switch span:after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;background:#d7decc;border-radius:50%;transition:transform .15s}.switch input:checked+span{background:var(--green)}.switch input:checked+span:after{transform:translateX(20px);background:#223118}.switch input:focus-visible+span{outline:2px solid var(--green);outline-offset:4px}.retry{margin-top:8px;font-size:11px}.run-controls{margin-top:24px}.start-button{width:100%;display:flex;justify-content:space-between;align-items:center;background:var(--green);color:var(--ink);border:0;border-radius:12px;padding:14px 20px;font-weight:700;font-size:17px;min-height:56px;transition:background .15s,transform .15s}.start-button:hover{background:#d7ff9c}.start-button:active{transform:scale(.985)}.start-button>span:last-child{font-size:22px;font-weight:400}.start-button[data-running=true]{background:#303b26;color:var(--green);box-shadow:inset 0 0 0 1px #667b47}.session-line{display:flex;justify-content:space-between;margin-top:10px;font-size:10px;color:var(--muted);gap:8px}.session-line time{font-family:ui-monospace,monospace;font-variant-numeric:tabular-nums;font-size:12px;color:var(--text)}.compatibility-note{font-size:11px;color:var(--muted);display:flex;align-items:baseline;gap:8px;margin:16px 0 0}.compatibility-note>span{color:var(--green)}.how-to{padding:65px 0 42px;border-bottom:1px solid var(--line);scroll-margin-top:24px}.section-heading .eyebrow{font-size:9px;margin-bottom:11px}.section-heading h2,.faq h2{font-size:22px;font-weight:600;letter-spacing:-.4px;margin:0}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:38px;margin-top:30px}.step-number{display:block;color:var(--green);font-family:ui-monospace,monospace;font-size:12px;margin-bottom:14px}.steps h3{font-size:14px;font-weight:550;margin:0 0 8px}.steps p{color:var(--muted);font-size:12px;line-height:1.9;margin:0}.faq{padding:42px 0 56px}.faq h2{font-size:17px;margin-bottom:18px}.faq details{border-bottom:1px solid var(--line)}.faq summary{list-style:none;padding:18px 30px 18px 0;position:relative;font-size:13px}.faq summary::-webkit-details-marker{display:none}.faq summary:after{content:"+";position:absolute;right:3px;color:var(--green);font-size:20px;top:12px}.faq details[open] summary:after{content:"−"}.faq details p{font-size:12px;color:var(--muted);margin:0 0 20px;max-width:850px;line-height:1.9}.site-footer{display:flex;align-items:center;gap:22px;border-top:1px solid var(--line);padding-block:28px 40px}.site-footer .brand{font-size:24px}.site-footer>span{font-size:10px;color:var(--muted);flex:1}.site-footer>a:last-child{font-size:11px;color:var(--muted);text-decoration:none}.focus-controls{display:none}.focused{overflow:hidden}.focused .surface-card{position:fixed;inset:0;z-index:100;border:0;border-radius:0;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom);height:100dvh}.focused .surface{min-height:0}.focused .surface-footer{flex-shrink:0}.focused .focus-controls{display:flex;align-items:center;justify-content:space-between;padding:12px 22px 20px;gap:24px}.focus-controls>span{font:20px ui-monospace,monospace;color:var(--green)}.focus-controls button{background:var(--green);color:var(--ink);border:0;border-radius:10px;padding:13px 28px;min-width:150px;font-weight:650;min-height:48px}.focus-controls button span{margin-left:15px}.legal{max-width:760px;padding-block:50px 70px}.legal h1{font-size:30px}.legal h2{font-size:18px;margin-top:30px}.legal p,.legal li{color:var(--muted);font-size:14px}.legal .updated{font-size:11px}.notice{color:#edcb8b}.legal .back-link{display:inline-block;margin-top:25px;color:var(--green)}
@media(min-width:1400px){.intro{padding-top:65px}.workspace{gap:30px}.surface{min-height:430px}}
@media(max-width:740px){.wrap{width:calc(100% - 36px)}.site-header{height:70px}.brand{font-size:25px}.brand img{width:27px;height:27px}.intro{padding:29px 0 23px}.intro .eyebrow{font-size:8px;letter-spacing:1.5px;margin-bottom:12px}.mobile-break{display:block}h1{font-size:29px;letter-spacing:-.9px;line-height:1.5}.intro-copy{font-size:11px;margin-top:11px}.workspace{grid-template-columns:1fr;gap:16px}.surface{min-height:280px;height:280px;flex:auto}.surface-card{border-radius:16px}.surface-bar,.surface-footer{padding:12px 16px;min-height:45px}.surface-tag{font-size:8px}.surface-footer{font-size:10px}.surface-idle svg{width:48px;height:72px;margin-bottom:13px}.surface-idle strong{font-size:14px}.surface-idle span{font-size:11px}.controls{padding:20px;border-radius:16px}.controls-top{margin-bottom:19px}.controls-top h2{font-size:14px}.pattern-control legend{font-size:12px}.pattern-choice{padding-top:12px;padding-bottom:9px}.pattern-choice b{font-size:12px}.swatch{height:26px}.range-control{margin-bottom:19px}.range-control>label,.timer-control,.wake-control label{font-size:13px}.range-ends{font-size:10px}.wake-control p{font-size:11px}.run-controls{margin-top:20px}.start-button{min-height:58px}.session-line{font-size:11px}.compatibility-note{font-size:10px;line-height:1.8;margin-top:13px}.how-to{padding-top:44px;padding-bottom:30px}.section-heading h2{font-size:20px}.steps{grid-template-columns:1fr;gap:23px;margin-top:26px}.steps article{display:grid;grid-template-columns:34px 1fr;column-gap:9px}.step-number{grid-row:1/3;padding-top:2px;margin:0}.steps h3{font-size:13px;margin-bottom:5px}.steps p{font-size:11px}.faq{padding-top:30px;padding-bottom:38px}.faq h2{font-size:16px}.faq summary{font-size:12px;padding-block:17px}.faq details p{font-size:11px}.site-footer{padding:24px 0 30px;gap:15px}.site-footer>span{font-size:9px}.site-footer>a:last-child{font-size:10px}.focused .surface{height:auto;flex:1}.focused .surface-footer{font-size:10px}.focused .focus-controls{padding:10px 16px 17px}.legal{padding-top:35px}.legal h1{font-size:24px}.legal p,.legal li{font-size:12px}}
@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}
.mobile-run{display:none}@media(max-width:740px){.mobile-run{display:block}.controls .run-controls{display:none}}
.focus-wake{display:none}.focused .focus-wake{display:flex;align-items:center;justify-content:space-between;padding:3px 22px 0;font-size:11px;color:var(--muted);min-height:22px}.focus-wake [data-state=active]{color:var(--green)}.focus-wake [data-state=error],.focus-wake [data-state=paused],.focus-wake [data-state=unsupported]{color:#edcb8b}
