:root{color:#30343b;font-synthesis:none;background:#f4f6fa;font-family:Inter,Noto Sans JP,system-ui,sans-serif}*{box-sizing:border-box}body{min-width:320px;margin:0}button,input{font:inherit}.app{--accent:#ff626b;background:#fff;flex-direction:column;width:min(100%,480px);min-height:100vh;margin:auto;display:flex;box-shadow:0 0 30px #dce0e8}.app.shortBreak,.app.longBreak{--accent:#4caf65}header{border-bottom:1px solid #e2e5ea;justify-content:space-between;align-items:center;height:62px;padding:0 18px;display:flex}.logo{color:#ffb51a;font-size:25px}.icon{background:0 0;border:0;font-size:22px;display:none}.content{flex:1;padding:14px 16px 20px}.status{background:color-mix(in srgb, var(--accent) 18%, white);width:max-content;color:var(--accent);border-radius:99px;margin:0 auto 12px;padding:6px 24px;font-weight:800}.timer{aspect-ratio:1;background:conic-gradient(var(--accent) var(--progress), #edf0f3 0);border-radius:50%;place-items:center;width:250px;margin:auto;display:grid;position:relative}.timer:before{content:"";background:#fff;border-radius:50%;position:absolute;inset:11px}.timer div{z-index:1;text-align:center}.timer b{letter-spacing:-2px;font-size:50px;display:block}.timer span{color:#657080}.message{text-align:center;margin:14px 0;font-size:14px}.primary{background:linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent), #ffaf8f 40%));color:#fff;width:min(100%,280px);box-shadow:0 7px 16px color-mix(in srgb, var(--accent) 25%, transparent);border:0;border-radius:9px;margin:10px auto;padding:13px;font-weight:800;display:block}.controls{justify-content:center;gap:12px;margin:12px;display:flex}.controls button,.content>section>button{background:#fff;border:1px solid #cfd4dc;border-radius:8px;padding:9px 15px}.card{border:1px solid #dce0e6;border-radius:12px;margin-top:12px;padding:15px}.card h2{margin:7px 0}.card small,.level small{color:#657080;font-weight:400}.blocks{flex-wrap:wrap;gap:6px;display:flex}.blocks span{border:2px dashed #c7ccd3;border-radius:4px;width:26px;height:27px}.blocks .done{border-style:solid;border-color:var(--accent);background:linear-gradient(135deg, var(--accent), #ff8b82);box-shadow:inset 0 0 0 2px #fff4}.level{align-items:center;gap:15px;display:flex}.level div{flex-direction:column;gap:5px;display:flex}.avatar{font-size:36px}.metrics{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.metrics div{text-align:center;border:1px solid #e0e3e8;border-radius:10px;padding:14px 5px}.metrics b{font-size:23px;display:block}.metrics small{font-size:11px}.chart{border-bottom:1px solid #bfc5ce;align-items:end;gap:3px;height:150px;padding-top:15px;display:flex}.chart span{background:var(--accent);border-radius:3px 3px 0 0;flex:1}.settings{border:1px solid #dde1e7;border-radius:10px}.settings label{border-bottom:1px solid #e7e9ed;justify-content:space-between;align-items:center;padding:12px;display:flex}.settings label:last-child{border:0}.settings span{align-items:center;display:flex}.settings button{background:#fff;border:1px solid #d5d9e0;width:34px;height:34px}.settings input[type=number]{text-align:center;border:1px solid #d5d9e0;width:55px;height:34px}.settings input[type=checkbox]{width:42px;height:22px;accent-color:var(--accent)}.history article{border-bottom:1px solid #e4e7eb;grid-template-columns:1fr 2fr auto;gap:8px;padding:13px 2px;display:grid}.history em{color:var(--accent);font-style:normal}nav{background:#fff;border-top:1px solid #d8dce3;grid-template-columns:repeat(4,1fr);width:100%;height:70px;display:grid;position:sticky;bottom:0}nav button{color:#69717c;background:#fff;border:0;font-size:11px}nav span{margin-bottom:3px;font-size:23px;display:block}nav .active{color:var(--accent);font-weight:800}.overlay{z-index:5;background:#20242b88;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.modal{text-align:center;background:#fff;border-radius:18px;width:min(100%,360px);padding:35px 24px;animation:.3s pop}.confetti{color:#ffb51a;letter-spacing:20px}@keyframes pop{0%{opacity:0;transform:scale(.8)}}button:focus-visible,input:focus-visible{outline-offset:2px;outline:3px solid #265dbe}@media (width>=700px){body{padding:24px}.app{border-radius:18px;min-height:calc(100vh - 48px);overflow:hidden}nav{border-radius:0 0 18px 18px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}.site-shell{min-width:0}.affiliate-rail{display:none}.affiliate-rail-heading{flex-direction:column;gap:5px;margin-bottom:12px;display:flex}.affiliate-rail-heading span{color:#845400;background:#fff0d6;border-radius:99px;width:max-content;padding:3px 8px;font-size:11px;font-weight:800}.affiliate-rail-heading strong{font-size:15px}.affiliate-card{background:#fff;border:1px solid #dce0e6;border-radius:12px;margin-bottom:12px;padding:15px;box-shadow:0 8px 24px #2c344012}.affiliate-card h2{margin:0 0 5px;font-size:15px;line-height:1.45}.affiliate-card p{color:#596272;margin:0 0 12px;font-size:12px;line-height:1.6}.affiliate-card a,.affiliate-preview{text-align:center;border-radius:8px;padding:9px 10px;font-size:12px;font-weight:800;text-decoration:none;display:block}.affiliate-card a{color:#744900;background:#fff2d6;border:1px solid #f1cd80}.affiliate-card a:hover{background:#ffe6ae}.affiliate-preview{color:#7a828d;background:#f1f3f6;border:1px dashed #c9ced6}.affiliate-disclosure{color:#596272;background:#f8f9fb;border-radius:10px;padding:12px;font-size:10px;line-height:1.65}@media (width>=1100px){body{padding:24px}.site-shell{grid-template-columns:220px 480px 220px;justify-content:center;align-items:start;gap:24px;max-width:1008px;margin:auto;display:grid}.affiliate-rail{max-height:calc(100vh - 48px);display:block;position:sticky;top:24px;overflow:auto}.app{width:480px;margin:0}}