
:root{--paper:#eee5d7;--ink:#383d35;--muted:#858475;--red:#b74c39;--red-dark:#873729;--cream:#fff7e7;--green:#6f927b;--line:#d3cab8;--power:0%;font-family:"Yu Gothic UI","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}
*{box-sizing:border-box}body{margin:0;min-width:300px;background-image:radial-gradient(#b7ad972b .7px,transparent .7px);background-size:7px 7px}button,a,input{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:disabled{cursor:wait;opacity:.65}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #426f62;outline-offset:4px}button svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}button[hidden],div[hidden],p[hidden],span[hidden],section[hidden]{display:none!important}.app{width:min(100% - 36px,760px);margin:auto}header{display:flex;align-items:center;justify-content:space-between;padding:24px 0 12px}.brand{display:flex;gap:9px;align-items:center;text-decoration:none;color:var(--ink);font-size:8px;line-height:1.45;letter-spacing:1.4px;font-weight:900}.brand-mark{display:block;font-size:30px;line-height:29px;position:relative;font-weight:1000}.brand-mark span{font-size:10px;position:absolute;right:-4px;top:9px;color:var(--red)}.header-tools{display:flex;gap:8px}.icon-button{background:transparent;border:1px solid var(--line);color:var(--ink);width:36px;height:36px;border-radius:50%;font-size:17px;font-weight:700;display:grid;place-items:center}.icon-button svg{width:19px;height:19px}.icon-button[aria-pressed=true] .sound-wave{display:none}.heading{position:relative;margin:18px 0 22px}.eyebrow{font-size:9px;letter-spacing:2.5px;font-weight:800;color:var(--red);margin:0 0 9px}h1{font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-weight:900;font-size:clamp(32px,5.4vw,46px);letter-spacing:.07em;line-height:1.25;margin:0}h1 span{color:var(--red)}.subtitle{font-size:11px;font-weight:600;margin:9px 0 0;color:#7b7c6c}.playfield{position:relative;overflow:hidden;aspect-ratio:900/720;border-radius:20px;background:#d5c7ac;box-shadow:0 2px 0 #c6b99f,0 20px 45px -28px #51422e88;border:1px solid #cfc2a8}#game{position:absolute;inset:0}#game canvas{width:100%!important;height:100%!important;display:block}.stage-label{position:absolute;inset:18px 20px auto;display:flex;align-items:center;justify-content:space-between;pointer-events:none;font:800 10px "Courier New",monospace;letter-spacing:1.4px;color:#665e4f}.stage-label #phase{padding:6px 9px;border:1px solid #8075634a;border-radius:4px;background:#eee5d74d}.stage-label #clock{font-size:14px;padding:6px 9px;background:var(--ink);color:var(--paper);border-radius:4px}.desk-caption{position:absolute;right:20px;bottom:14px;pointer-events:none;font-size:8px;letter-spacing:1.2px;color:#877350}.loading{position:absolute;inset:0;display:grid;place-items:center;background:var(--paper);font-size:13px}.controls{padding:20px 0 0}.instruction{font-size:14px;font-weight:800;text-align:center;margin:0 0 15px;min-height:21px;letter-spacing:.04em}.button{min-height:56px;padding:15px 20px;border-radius:9px;display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:14px;font-weight:800;text-decoration:none;border:1px solid transparent;transition:background .15s,transform .12s,box-shadow .12s;touch-action:manipulation}.button:active{transform:translateY(2px);box-shadow:none}.primary{background:var(--red);color:#fff6e7;box-shadow:0 4px 0 var(--red-dark);border-color:var(--red)}.primary:hover{background:#a94635}.primary svg{width:22px;height:22px}.primary .arrow{margin-left:auto}.secondary{background:#f7efe1;color:var(--ink);border-color:#cfc4ad;box-shadow:0 2px 0 #dbcfb7}.secondary:hover{background:#fff6e6}.mode-picker{display:grid;grid-template-columns:1.2fr 1fr;gap:12px}.footnote{text-align:center;font-size:10px;color:var(--muted);margin:14px 0 0}.breath-meter{padding:0 6px;margin:0 0 20px}.meter-title{display:flex;justify-content:space-between;font-size:10px;margin-bottom:8px;color:var(--muted)}.meter-title strong{font-size:11px;color:var(--green)}.meter-track{position:relative;background:#d8d0bd;border:1px solid #c9c1ad;height:14px;border-radius:5px;overflow:visible}.good-range{position:absolute;left:32%;width:40%;height:100%;background:#9eb59d70;border-left:1px dashed #698166;border-right:1px dashed #698166}#meter-fill{position:absolute;left:0;top:0;width:var(--power);height:100%;background:#809f83;border-radius:4px;opacity:.65}#meter-needle{position:absolute;left:var(--power);height:22px;width:3px;border-radius:2px;top:-5px;background:#344f3d;transform:translateX(-50%)}.meter-scale{display:flex;justify-content:space-between;font-size:9px;color:#9a8d78;margin:6px 0 0}.action-row{display:flex;gap:12px}.action-row .button{flex:1;justify-content:center}.action-row .insert-button{background:#f7efe1;color:var(--ink);border-color:#bfb499;box-shadow:0 3px 0 #d2c5ad;justify-content:space-between}.action-row .insert-button:only-child{background:var(--red);color:#fff6e7;border-color:var(--red);box-shadow:0 4px 0 var(--red-dark)}.hold-button{user-select:none;touch-action:none}.hold-button.holding{background:#843c2f;transform:translateY(3px);box-shadow:inset 0 2px 5px #632b2355}.key{border:1px solid #fff5;font:10px monospace;padding:3px 5px;border-radius:4px;opacity:.7}.live-foot{display:flex;justify-content:space-between;align-items:start;margin:16px 2px 0;gap:15px}.text-button{border:0;background:none;color:#7a786a;padding:4px 0;text-decoration:underline;text-underline-offset:3px;font-size:10px}details{font-size:10px;color:#7a786a}summary{cursor:pointer;padding:4px 0}details label{display:flex;align-items:center;gap:8px;padding-top:8px}details input{max-width:120px;accent-color:var(--green)}.notice{font-size:11px;line-height:1.7;text-align:center;color:#a04d39;margin:10px 0 0;min-height:0}.notice:empty{display:none}.result{padding:0 0 8px}.result-heading{display:flex;justify-content:space-between;align-items:center;gap:16px}#result-title{font-weight:900;font-size:22px;letter-spacing:.04em}.score{color:var(--red);display:flex;align-items:baseline;gap:5px}.score strong{font:700 48px/1 "Courier New",monospace;letter-spacing:-3px}.score small{font-size:12px}.result p{font-size:11px;color:var(--muted);margin:9px 0 20px;line-height:1.8}.result>.button{width:100%}.share-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:13px}.share-row .button{font-size:12px;min-height:45px;padding:12px 16px}footer{display:flex;justify-content:space-between;font-size:8px;letter-spacing:1px;color:#9d927e;padding:26px 0 22px}dialog{background:#f8f0e3;border:1px solid #b8ad97;border-radius:14px;color:var(--ink);max-width:440px;width:calc(100% - 32px);padding:34px 26px;box-shadow:0 20px 80px #20191055}dialog::backdrop{background:#2f302a70;backdrop-filter:blur(4px)}dialog h2{font-size:20px;line-height:1.5;margin:0 0 20px}dialog p{font-size:13px;line-height:1.9}.small{font-size:10px!important;color:#88816e}.close{position:absolute;right:10px;top:8px;border:0;background:none;font-size:26px;color:#8b7d67;width:32px;height:32px}body[data-phase=booting] .playfield{box-shadow:0 2px 0 #c6b99f,0 20px 45px -28px #51422e88}body[data-phase=result] .heading{margin-bottom:18px}@media(min-width:700px){.app{max-width:640px}.heading{margin-top:25px}.heading .subtitle{position:absolute;right:0;bottom:5px}.playfield{aspect-ratio:900/680}.controls{padding-top:24px}}@media(max-width:420px){.app{width:calc(100% - 28px)}header{padding-top:16px}.heading{margin:16px 0 17px}h1{font-size:31px;letter-spacing:.03em}.subtitle{font-size:10px}.eyebrow{font-size:8px}.playfield{border-radius:14px}.stage-label{inset:12px 12px auto;font-size:8px}.desk-caption{right:12px;bottom:10px;font-size:7px}.mode-picker{grid-template-columns:1fr;gap:10px}.button{min-height:53px}.controls{padding-top:18px}.instruction{font-size:12px}.share-row .button{padding:12px 10px;font-size:11px}footer{letter-spacing:.4px;font-size:7px}.key{display:none}.action-row .button{padding:14px 12px;font-size:12px}.score strong{font-size:40px}#result-title{font-size:19px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(min-width:960px){.app{width:calc(100% - 64px);max-width:1090px;display:grid;grid-template-columns:minmax(0,1.65fr) minmax(260px,.9fr);column-gap:42px}header,.heading,footer{grid-column:1/-1}header{padding:20px 0 8px}.heading{margin:17px 0 24px}.playfield{grid-column:1;aspect-ratio:900/720}.controls{grid-column:2;align-self:center;padding:0}.mode-picker{grid-template-columns:1fr;gap:13px}.instruction{text-align:left;font-size:16px;line-height:1.8;margin-bottom:20px}.footnote{text-align:left;margin-top:17px}.result-heading{display:block}.score{margin-top:14px}.share-row{gap:8px}.share-row .button{padding:11px 9px;font-size:11px}.action-row{flex-direction:column}.meter-title{font-size:11px}.live-foot{flex-wrap:wrap;gap:7px}footer{padding-top:22px}}@media(min-width:700px) and (max-width:959px){header{padding-top:12px}.heading{margin-top:10px;margin-bottom:15px}.app{max-width:550px}h1{font-size:38px}.heading .subtitle{position:static}.controls{padding-top:18px}}

h1 span{white-space:nowrap}.result-heading{min-width:0}#result-title{min-width:0}.score{flex-shrink:0}
#result-detail{font-size:clamp(17px,1.7vw,20px);line-height:1.8;font-weight:650;color:var(--ink);margin:14px 0 10px;overflow-wrap:anywhere;text-wrap:balance}#result-stats{font-size:12px;line-height:1.7;font-weight:500;color:#6e6f61;margin:0 0 24px}
.header-tools{margin-left:auto}
.mg-result,.mg-dialog{--mg-paper:#f7efe1;--mg-ink:#383d35;--mg-accent:#b74c39;--mg-line:#cfc4ad;--mg-muted:#757367;--mg-body:"Yu Gothic UI",Meiryo,sans-serif;--mg-display:"Yu Mincho",serif;--mg-numbers:"Courier New",monospace}.result .mg-standing p{font-size:14px;margin:0;line-height:1.55;color:var(--ink)}.result .mg-standing .mg-muted{color:#757367}.mg-result .mg-primary{display:flex;justify-content:space-between;font-size:14px;min-height:56px;border-radius:9px;background:var(--red);box-shadow:0 4px 0 var(--red-dark);border-color:var(--red);color:#fff6e7}.mg-share-pair .mg-button{display:flex;justify-content:space-between;border-radius:9px;font-size:12px;min-height:45px;background:#f7efe1;color:var(--ink);box-shadow:0 2px 0 #dbcfb7}.mg-standing{margin:0 0 9px}.mg-register{margin-top:9px}.mg-register input,.mg-register button{border-radius:8px;font:600 14px/1.5 var(--mg-body)}.mg-ranking-link{margin-top:4px;min-height:42px;font-size:14px}.mg-board-content{min-height:0;display:grid;overflow:hidden}.mg-dialog .mg-own-record{background:#efe4ce;border-color:#cfc4ad;border-left-color:#b74c39}.mg-action-error{font-size:13px!important;color:#a03f31!important;margin:0!important;line-height:1.7!important}.mg-dialog .mg-close{padding:0}.mg-dialog .mg-dialog-header{padding:0}.mg-dialog .mg-table tbody td:last-child{color:#b74c39}.mg-dialog .mg-board-message{min-height:0}.mg-result .mg-rank-error button{min-height:30px}@media(min-width:960px){.playfield{align-self:start}.controls:has(.result:not([hidden])){align-self:start;padding-top:8px}}
