@import url('https://fonts.googleapis.com/css2?family=Zen+Maru+Gothic:wght@400;500;700&display=swap');
:root{font-family:'UD デジタル 教科書体 NK-R','UD Digi Kyokasho NK-R','Zen Maru Gothic',sans-serif;color:#2f3c46;background:#f7f9fb;--primary:#315d78;--light:#eaf2f7;--muted:#788a98;--stroke:#e1e9ed}
*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer;touch-action:manipulation}button:disabled{opacity:.48;cursor:default}button:focus-visible,input:focus-visible{outline:3px solid #75b3d7;outline-offset:3px}h1,h2,h3,p{margin-top:0}h1{font-weight:700;font-size:22px}h2{font-size:18px;font-weight:700}h3{font-size:14px}small,.muted{color:var(--muted)}.main{max-width:1160px;margin:auto;padding:24px 20px}.brand{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-bottom:22px}.brandtitle{display:flex;gap:12px;align-items:center}.brandtitle img{width:46px;height:46px}.brandtitle p{margin:4px 0 0;color:var(--muted);font-size:12px}.badge{border-radius:50px;background:#eaf2f7;color:var(--primary);padding:7px 12px;font-size:12px}.badge.offline{background:#fff2e7;color:#9f633c}.layout{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(270px,.9fr);gap:18px;align-items:start}.panel{background:#fff;border:1px solid var(--stroke);border-radius:23px;padding:23px;box-shadow:0 8px 30px #234b6410}.timerpanel{display:flex;flex-direction:column;align-items:center}.tabs{display:inline-flex;gap:3px;padding:4px;background:#f1f5f7;border-radius:40px}.tabs button{background:none;border:none;border-radius:30px;padding:9px 16px;color:#738594}.tabs .on{background:#fff;color:var(--primary);box-shadow:0 2px 6px #5674891c}.round{position:relative;width:min(100%,385px);aspect-ratio:1;margin:15px 0 5px;display:grid;place-items:center}.round svg{position:absolute;width:100%;height:100%;transform:rotate(-90deg)}.round circle{fill:none;stroke:#e7edef;stroke-width:8}.round .progress{stroke:var(--primary);stroke-linecap:round;stroke-width:9;transition:stroke-dashoffset .25s linear}.timer-center{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center}.timer-center .time{font-size:clamp(30px,5.7vw,60px);letter-spacing:-.055em;font-variant-numeric:tabular-nums;line-height:1.15;font-weight:500;white-space:nowrap}.timer-center .hint{color:var(--muted);font-size:13px}.endtime{border-radius:50px;background:#eff4f6;padding:7px 12px;font-size:13px;color:#748695;font-variant-numeric:tabular-nums}.overtime{color:#af6338!important}.controls{display:flex;gap:10px;justify-content:center;align-items:center;flex-wrap:wrap;margin:8px 0 3px}.btn{border:1px solid var(--stroke);background:#fff;border-radius:14px;padding:12px 16px;min-height:44px;color:var(--primary);font-weight:700}.btn:hover{background:#f6f9fa}.btn.primary{background:var(--primary);border-color:var(--primary);color:#fff}.btn.primary:hover{background:#234b66}.btn.ghost{background:transparent;border-color:transparent}.btn.xsmall{padding:6px 11px;min-height:34px;font-size:12px}.target{width:100%;max-width:480px;margin:22px 0 3px;border-top:1px solid var(--stroke);padding-top:21px}.inputrow{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:7px}.inputrow input{width:95px;text-align:center;border:1px solid var(--stroke);border-radius:12px;padding:10px;color:#2a4d63;font-size:19px;font-variant-numeric:tabular-nums}.chips{display:flex;gap:7px;flex-wrap:wrap;justify-content:center;margin-top:13px}.chip{padding:8px 11px;border-radius:30px;border:1px solid #dce6ed;color:#476b82;background:white;font-size:12px}.chip.active{background:var(--light);border-color:#a4c4d5}.sectiontitle{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:12px}.sectiontitle h2{margin:0}.progressarea .label{display:flex;align-items:center;justify-content:space-between;font-size:13px;font-weight:700;gap:8px}.bar{width:100%;height:11px;background:#e9f0f4;border-radius:20px;overflow:hidden;margin:12px 0}.bar>div{background:var(--primary);height:100%;width:0;border-radius:20px;transition:width .2s}.bigcount{display:flex;justify-content:center;gap:19px;align-items:center;margin:17px auto 6px}.countnum{font-size:49px;font-variant-numeric:tabular-nums;white-space:nowrap}.countnum span{font-size:15px;color:var(--muted)}.countbutton{font-size:28px;width:55px;height:55px;border:1px solid #d5e4ed;border-radius:15px;background:var(--light);color:var(--primary)}.countbutton.add{background:var(--primary);color:#fff}.two{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:17px}.stat{border-radius:13px;background:#f5f8fa;padding:13px}.stat strong{display:block;font-size:18px;font-variant-numeric:tabular-nums;margin-top:5px}.panel-stack{display:grid;gap:18px}.alert{background:#fff5eb;border:1px solid #f2d1b6;color:#a85b2c;padding:13px;border-radius:13px;display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap}.alert strong{font-size:15px}.tiny{font-size:12px;line-height:1.7}.divider{height:1px;background:var(--stroke);margin:21px 0}.field{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin:13px 0}.field select,.field input:not([type=range]){border:1px solid var(--stroke);border-radius:10px;background:#fff;padding:8px;max-width:100%}.field input[type=range]{flex:1;min-width:80px;accent-color:var(--primary)}.records{max-height:250px;overflow-y:auto}.record{display:flex;justify-content:space-between;border-top:1px solid var(--stroke);padding:10px 0;gap:12px;font-size:13px}.record strong{white-space:nowrap}.inputcode{font-family:monospace!important;max-width:100%;width:100%;background:#f6f9fb;border:1px solid var(--stroke);padding:11px;border-radius:10px;font-size:12px;overflow:hidden;text-overflow:ellipsis}.footnote{font-size:12px;line-height:1.75;color:#738593}.miniwrap{position:fixed;right:18px;bottom:18px;z-index:100;width:280px;height:365px;resize:both;overflow:hidden;border-radius:17px;box-shadow:0 15px 50px #23445c3b;border:1px solid #dce8ed;background:white;min-width:190px;min-height:125px}.miniwrap[data-layout="A"]{width:530px;height:122px;min-width:290px;min-height:90px}.miniwrap .close{position:absolute;right:4px;top:2px;z-index:5;border:0;background:#fff;border-radius:8px;color:#637b8b}.miniroot{height:100%;width:100%;container-type:size;background:#fff;overflow:hidden;color:#2e4351}.miniinside{height:100%;width:100%;container-type:size;padding:min(3.3cqw,9px);display:flex;flex-direction:column;justify-content:space-evenly;align-items:center;gap:1cqh}.minihead{display:flex;justify-content:space-between;align-items:center;align-self:stretch;font-size:clamp(10px,3cqw,18px);gap:4px;flex-shrink:0}.minihead button{background:none;border:0;font-size:inherit;color:var(--primary);font-weight:700}.minidial{width:min(66cqw,57cqh);height:min(66cqw,57cqh);flex-shrink:0;position:relative;display:grid;place-items:center}.minidial svg{position:absolute;width:100%;height:100%;transform:rotate(-90deg)}.minidial circle{fill:none;stroke:#edf1f4;stroke-width:8}.minidial .progress{stroke:#315d78;stroke-width:9;stroke-linecap:round}.minitimelabel{font-variant-numeric:tabular-nums;font-size:clamp(14px,min(10cqw,8cqh),52px);white-space:nowrap;letter-spacing:-.05em;z-index:1}.miniend{color:#8495a1;font-size:clamp(9px,min(3.5cqw,3cqh),23px);white-space:nowrap;z-index:1}.minitexts{display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:2;gap:3px}.minicounter{display:flex;align-items:center;justify-content:center;gap:min(4cqw,12px);font-size:clamp(13px,min(7cqw,6cqh),29px);font-variant-numeric:tabular-nums;white-space:nowrap}.minicounter button,.minitoggle{border:0;border-radius:12px;background:#e9f1f7;color:var(--primary);min-width:max(27px,10cqw);min-height:max(27px,9cqh);font-size:inherit}.minicounter button:last-child,.minitoggle{background:var(--primary);color:#fff}.minitoggle{width:min(90%,270px);font-size:clamp(11px,min(4cqw,3.3cqh),23px);font-weight:700}.miniroot[data-layout="A"] .miniinside{flex-direction:row;gap:1.6cqw;padding:1.7cqh 2cqw}.miniroot[data-layout="A"] .minihead{display:none}.miniroot[data-layout="A"] .minidial{width:min(16cqw,80cqh);height:min(16cqw,80cqh)}.miniroot[data-layout="A"] .minitimelabel{font-size:clamp(13px,min(5.2cqw,24cqh),47px)}.miniroot[data-layout="A"] .miniend{font-size:clamp(9px,min(2.1cqw,12cqh),17px)}.miniroot[data-layout="A"] .minicounter{font-size:clamp(13px,min(3.8cqw,17cqh),30px);gap:1cqw}.miniroot[data-layout="A"] .minicounter button{min-width:max(29px,6cqw);min-height:max(29px,40cqh)}.miniroot[data-layout="A"] .minitoggle{width:auto;min-height:max(32px,42cqh);font-size:clamp(11px,min(2.4cqw,13cqh),19px);padding:0 2cqw;white-space:nowrap}.mini-notice{position:absolute;inset:auto 5px 5px;z-index:6;text-align:center;background:#fff1e4;color:#9e572b;border-radius:9px;padding:4px;font-size:11px}.hidden{display:none!important}
@media(max-width:760px){.layout{grid-template-columns:1fr}.main{padding:13px}.panel{padding:18px}.round{width:min(100%,340px)}.timer-center .time{font-size:clamp(35px,9vw,55px)}.miniwrap{right:10px;bottom:10px;max-width:calc(100vw - 20px)}.brand h1{font-size:20px}}

body.is-mini,body.is-mini #app{width:100%;height:100dvh;margin:0;overflow:hidden}
/* Keep the fold/unfold control available even in horizontal mini mode. */
.miniroot[data-layout="A"] .minihead{display:flex;align-self:center;width:auto;flex:0 0 auto;font-size:clamp(10px,min(2cqw,11cqh),15px)}
.miniroot[data-layout="A"] .minihead span{display:none}
.miniroot[data-layout="A"] .minihead button{border-radius:10px;padding:8px 5px;background:#e9f1f7;white-space:nowrap}
