:root{--mh-ink:#244d34;--mh-cream:#fff9e9;--mh-wood:#b98950;--mh-green:#208858;--mh-line:#b2c1a0}
body[data-dm-site-theme="game"]{margin:0;background:#edf4dd url('./images/background.webp?v=3') center top/cover fixed;color:var(--mh-ink)}
.mh-main{max-width:1180px;margin:auto;padding:16px 26px 24px;font-family:"Hiragino Maru Gothic ProN","Yu Gothic",Meiryo,sans-serif;font-weight:500;line-height:1.65}
.mh-main [hidden],.mh-dialog [hidden]{display:none!important}.mh-main *,.mh-dialog *{box-sizing:border-box}
.mh-title{text-align:center;margin:0 auto 20px;padding:5px 12px 12px;max-width:900px;border:3px solid #c79656;border-radius:28px;background:linear-gradient(5deg,#eed5a5,#fff6d7 48%,#ecd2a0);box-shadow:0 5px 0 #a77b48,0 8px 24px #6851211a}
.mh-title p{margin:0;color:#71512d;font-size:13px;letter-spacing:.14em}.mh-title h1{margin:0;font-size:clamp(24px,3.8vw,43px);font-weight:900;letter-spacing:.02em;line-height:1.5;color:#814414;text-shadow:0 2px #fff9e9}.mh-title h1 span{color:#176c39}
.mh-main button,.mh-dialog button{appearance:none;min-height:44px;border:1px solid #abbd9b;border-radius:12px;background:#fffdf2;color:var(--mh-ink);font:inherit;font-weight:700;padding:9px 16px;cursor:pointer;box-shadow:0 2px 0 #a8b09030;touch-action:manipulation}
.mh-main button:hover,.mh-dialog button:hover{filter:brightness(.97)}.mh-main button:disabled{cursor:default;opacity:.52}.mh-main button:focus-visible,.mh-main a:focus-visible,.mh-main input:focus-visible,.mh-dialog button:focus-visible,.mh-main summary:focus-visible{outline:3px solid #874b08;outline-offset:3px}
.mh-main .mh-primary,.mh-dialog .mh-primary{color:#fff;background:linear-gradient(#33a568,#198352);border:2px solid #147147;box-shadow:0 4px 0 #115b36;font-weight:800}
.mh-paper{background:#fffcf0f5;border:1px solid #d4bb8f;border-radius:22px;box-shadow:0 5px 0 #98734318}
.mh-tag{display:inline-block;color:#78471e;font-size:14px;letter-spacing:.04em;font-weight:700;background:#f2e0b9;padding:4px 16px;border-radius:8px}
.mh-speed{border:0;padding:0;margin:20px 0 12px;min-width:0;text-align:left}.mh-speed legend{padding:0;margin-bottom:8px;font-size:16px;font-weight:800}.mh-speed-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.mh-speed-option{display:flex;align-items:center;gap:8px;min-height:76px;padding:10px 8px;border:2px solid #c4cfaf;border-radius:12px;background:#fffdf2;cursor:pointer;touch-action:manipulation}.mh-speed-option:has(input:checked){border-color:#288155;background:#e6f0d6;box-shadow:0 2px 0 #28815533}.mh-speed-option input{appearance:auto;flex:0 0 18px;width:18px;height:18px;margin:0;accent-color:#207c4e}.mh-speed-option span{min-width:0}.mh-speed-option strong,.mh-speed-option small{display:block}.mh-speed-option strong{font-size:17px}.mh-speed-option small{font-size:12px;line-height:1.5}.mh-intro .mh-speed p{font-size:12px;margin:7px 0 0}.mh-result-actions{flex-wrap:wrap}
.mh-intro{display:grid;grid-template-columns:1.5fr 1fr;align-items:center;max-width:900px;margin:30px auto;padding:38px 34px}.mh-intro h2{font-size:25px;line-height:1.6;margin:16px 0}.mh-intro p{margin:12px 0}.mh-intro #start{min-width:210px;font-size:21px;margin-top:8px}.mh-example{padding:14px;background:#f0f1d9;border-radius:12px;font-size:21px}.mh-example strong{font-size:30px}.mh-example span:first-child{color:#985007}.mh-example span:nth-child(2){color:#0a7470}
.mh-hero{position:relative;width:100%;aspect-ratio:1}.mh-hero>img,.mh-mole>img,.mh-mole-group>img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.mh-hole-front{z-index:3}.mh-mole-clip{position:absolute;inset:0;clip-path:inset(0 0 39.5% 0);z-index:2}.mh-mole-group{position:absolute;width:66%;left:17%;top:-1.8%;aspect-ratio:1;transform:translateY(var(--mh-rise,0%))}
.mh-held-answer{position:absolute;left:50%;top:36.6%;width:max(94%,36px);aspect-ratio:2.1;transform:translate(-50%,-100%);z-index:0}
.mh-held-answer>.mh-answer-board{position:absolute;left:0;top:50%;width:100%;height:auto;transform:translateY(-50%)}
.mh-mole-pose{z-index:2}.mh-board-answer{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#104d2a;font-weight:900;font-size:var(--mh-board-font,20px);font-variant-numeric:tabular-nums;line-height:1;text-shadow:0 1px #fff9e9}
.mh-workspace{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:16px 24px;align-items:start;max-width:1020px;margin:auto;scroll-margin-top:8px}
.mh-toolbar{grid-column:1/-1;display:flex;align-items:center;gap:18px;padding:5px 8px 5px 18px;border-radius:14px;background:#fffff0e8;border:1px solid #c7d1ae;font-variant-numeric:tabular-nums}.mh-toolbar strong{font-size:25px}.mh-toolbar small{font-size:15px}.mh-toolbar #timer{margin-left:auto;font-size:14px}.mh-toolbar button{padding:6px 13px}
.mh-board-column{min-width:0}.mh-wood{padding:12px;border:3px solid #bd9059;border-radius:18px;background:repeating-linear-gradient(4deg,#ebd09e,#eedbb4 6px,#eedbb4 10px,#e4c796 12px);box-shadow:0 6px #99723f,inset 0 2px #fff0c9}
.mh-board-area{position:relative;border:2px solid #9aaf85;border-radius:6px;background:var(--mh-cream)}
.mh-grid{width:100%;aspect-ratio:1;border-collapse:collapse;table-layout:fixed;font-size:clamp(12px,1.8vw,23px);text-align:center;line-height:1;font-variant-numeric:tabular-nums;margin:0;color:#583a24;background:#fffcf1}
.mh-grid th,.mh-grid td{height:auto;width:calc(100% / 11);border:1px solid var(--mh-line);padding:0;position:relative;text-align:center;vertical-align:middle}.mh-grid th{background:#dfebcb;color:#205033;font-weight:800}.mh-grid th span{display:grid;place-items:center;width:100%;height:100%;min-height:100%;position:absolute;inset:0}.mh-grid th.mh-row-head span{transform:scale(1.08);z-index:4;background:#ffe4a0;outline:2px solid #d88c10;border-radius:6px;color:#75430d;box-shadow:0 0 13px #fcbf3380}.mh-grid th.mh-col-head span{transform:scale(1.08);z-index:4;background:#b8eee0;outline:2px solid #219c88;border-radius:6px;color:#084e43;box-shadow:0 0 13px #30ba9c60}
.mh-grid td.mh-row{background:#fff0c4}.mh-grid td.mh-col{background:#dcf2e5}.mh-grid td.mh-active{background:#e4eec1;outline:2px solid #4e8551;outline-offset:-3px}.mh-grid td.mh-solved{font-weight:650}.mh-grid td span{position:relative;z-index:5}
.mh-grid th span{position:relative;inset:auto;aspect-ratio:1;height:auto;min-height:0}
.mh-mole{position:absolute;aspect-ratio:1;width:calc(100% / 11 * 1.6);transform:translate(-50%,-55%);pointer-events:none;z-index:3;--mh-board-font:clamp(9px,1.1vw,15px)}
/* Center both hole layers with a 2px inset from one cell.
   The mole and answer board keep their readable size in the larger overlay. */
.mh-mole>img{inset:calc(23.75% + 2px) auto auto calc(18.75% + 2px);width:calc(62.5% - 4px);height:calc(62.5% - 4px)}
/* Keep the enlarged answer above grid labels while preserving the soil mask. */
.mh-mole{z-index:6;--mh-board-font:clamp(14px,1.75vw,22px)}
.mh-mole .mh-mole-clip{clip-path:inset(-80px -24px 39.5% -24px)}
.mh-mole[data-col="10"] .mh-held-answer{left:auto;right:2.7%;transform:translateY(-100%)}
.mh-controls{padding:20px 17px;text-align:center}.mh-operation{font-size:18px;min-width:130px;margin-bottom:12px}.mh-formula{display:flex;justify-content:center;align-items:baseline;gap:7px;font-size:clamp(29px,3vw,39px);font-weight:900;font-variant-numeric:tabular-nums;line-height:1.55;white-space:nowrap}.mh-formula b{font-size:.72em;color:#684328}.mh-formula #upper-value{color:#0b8075}.mh-formula #left-value{color:#a45909}.mh-formula #formula-answer{min-width:1.6em;color:#206636}.mh-feedback{font-weight:700;font-size:16px;min-height:28px;margin:9px 0;color:#3c6740}.mh-feedback[data-kind="correct"]{color:#aa500b}.mh-feedback[data-kind="wrong"]{color:#7c592f}.mh-answer-label{display:block;text-align:left;font-size:12px;line-height:1.4}.mh-main .mh-answer{display:block;width:100%;height:65px;border:2px solid #97b17a;border-radius:12px;background:#fffef3;box-shadow:inset 0 0 0 5px #edf0d5;text-align:center;font:900 37px/1.3 inherit;font-family:inherit;font-size:37px;font-weight:900;color:#165936;margin-bottom:12px;caret-color:transparent}
.mh-keypad{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.mh-keypad button{height:57px;min-width:0;font-size:27px;padding:2px;border:1px solid #c89967;background:linear-gradient(#fff1d4,#f7dbb4);box-shadow:0 3px #c4966580;color:#613b24}.mh-keypad .mh-erase{font-size:13px;background:linear-gradient(#f0f0e8,#dadccf);border-color:#adb3a2;color:#48503f}.mh-keypad #submit{font-size:21px}.mh-key-help{font-size:11px;margin:16px 0 0;color:#6f765f}
.mh-result{max-width:640px;padding:30px;margin:30px auto;text-align:center}.mh-result h2{font-size:31px;margin:14px 0}.mh-result-total{font-size:53px;font-weight:900;margin:0;color:#258250}.mh-result-total small{font-size:19px}.mh-result dl{margin:20px 0;background:#edf1de;border-radius:12px;padding:15px}.mh-result dl div{display:flex;justify-content:space-between;gap:10px;padding:6px}.mh-result dd{margin:0;font-weight:800}.mh-result-actions{display:flex;justify-content:center;align-items:center;gap:20px;margin:20px 0}.mh-save-notice{max-width:700px;background:#fff8dc;padding:12px 18px;margin:20px auto;border-radius:12px}.mh-save-notice p{margin:0 0 8px}
.mh-help{max-width:1020px;margin:28px auto 12px;padding:14px 20px;font-size:14px}.mh-help summary{cursor:pointer;font-weight:700}.mh-help p{margin:10px 0}.mh-footer{display:flex;justify-content:center;gap:25px;font-size:14px}.mh-main a{color:#28563e;text-underline-offset:4px}.mh-dialog{max-width:min(440px,calc(100% - 28px));border:2px solid #b38f5b;background:#fff9e8;border-radius:22px;padding:25px;color:var(--mh-ink);text-align:center;font-family:inherit}.mh-dialog::backdrop{background:#263a296b}.mh-dialog button{display:block;width:100%;margin-top:15px}.mh-dialog p{line-height:1.8}.mh-sr{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.mh-sr:focus{position:static;width:auto;height:auto;clip:auto}
@media(max-width:760px){body[data-dm-site-theme="game"]{background-image:url('./images/background-mobile.webp?v=3');background-attachment:scroll}.mh-main{padding:10px 10px 18px}.mh-title{margin-bottom:14px;border-radius:18px;padding:5px 7px}.mh-title h1{font-size:clamp(20px,4.5vw,31px);letter-spacing:0}.mh-title p{font-size:11px}.mh-intro{margin:20px auto;padding:22px;display:block;text-align:center}.mh-intro h2{font-size:22px}.mh-intro p{font-size:14px}.mh-intro .mh-example{font-size:19px}.mh-hero{width:170px;margin:-15px auto -45px}.mh-workspace{grid-template-columns:minmax(0,1fr);gap:10px;max-width:450px}.mh-toolbar{gap:8px;padding:3px 5px 3px 12px}.mh-toolbar strong{font-size:20px}.mh-toolbar small{font-size:12px}.mh-toolbar #timer{font-size:12px}.mh-toolbar button{font-size:12px;min-height:40px}.mh-wood{padding:7px;border-width:2px;border-radius:12px;box-shadow:0 4px #99723f}.mh-grid{font-size:clamp(12px,3.3vw,17px)}.mh-mole{--mh-board-font:clamp(14px,3.6vw,16px)}.mh-controls{padding:8px 12px 12px;border-radius:14px;display:grid;grid-template-columns:1fr 1fr;column-gap:10px;align-items:center}.mh-operation,.mh-key-help,.mh-answer-label{display:none}.mh-formula{font-size:27px;gap:3px;grid-column:1;grid-row:1}.mh-main .mh-answer{grid-column:2;grid-row:1;width:100%;height:43px;font-size:28px;margin:0}.mh-feedback{grid-column:1/-1;grid-row:2;font-size:14px;line-height:1.5;min-height:21px;margin:4px 0 6px}.mh-keypad{grid-column:1/-1;gap:6px}.mh-keypad button{height:44px;min-height:44px;font-size:24px;border-radius:9px}.mh-keypad #submit{font-size:19px}.mh-result{margin:20px auto;padding:22px 14px}.mh-result h2{font-size:27px}.mh-result dl{padding:10px;font-size:14px}.mh-help{margin-top:20px;font-size:13px;padding:12px}.mh-footer{font-size:13px}.mh-result-actions{gap:15px}}
@media(max-width:400px){.mh-main{padding-left:7px;padding-right:7px}.mh-workspace{max-width:340px}.mh-title p{display:none}.mh-title h1{font-size:clamp(20px,5.5vw,24px)}.mh-title{padding:5px}.mh-controls{padding:6px 10px 10px}.mh-formula{font-size:24px}}
@media(max-height:740px) and (max-width:760px) and (orientation:portrait){.mh-board-column{width:min(100%,calc(100svh - 340px));min-width:224px;justify-self:center}.mh-workspace{gap:6px}.mh-toolbar button{min-height:36px}.mh-toolbar{min-height:40px;padding-top:1px;padding-bottom:1px}.mh-controls{padding:4px 10px 8px}.mh-main .mh-answer{height:38px}.mh-feedback{margin:2px 0}.mh-keypad{gap:4px}}
@media(max-height:540px) and (orientation:landscape){.mh-title{max-width:730px;margin-bottom:10px}.mh-title p{display:none}.mh-title h1{font-size:24px}.mh-workspace{grid-template-columns:minmax(0,1fr) 290px;max-width:690px;gap:8px 16px}.mh-toolbar{padding:2px 8px;min-height:42px}.mh-toolbar button{min-height:36px}.mh-board-column{width:min(100%,calc(100svh - 70px));justify-self:center}.mh-grid{font-size:14px}.mh-controls{padding:8px 12px}.mh-operation,.mh-key-help,.mh-answer-label{display:none}.mh-formula{font-size:28px}.mh-main .mh-answer{height:44px;margin:0 0 6px;font-size:27px}.mh-feedback{margin:3px 0;font-size:14px;min-height:22px}.mh-keypad{gap:6px}.mh-keypad button{height:44px;min-height:44px;font-size:23px}.mh-keypad .mh-erase{font-size:12px}.mh-keypad #submit{font-size:18px}}
@media(prefers-reduced-motion:reduce){.mh-grid th.mh-row-head span,.mh-grid th.mh-col-head span{transform:none}.mh-main *{scroll-behavior:auto!important}}
[data-sound-toggle]{white-space:nowrap}
.mh-board-hint{font-size:13px;font-weight:700;margin:0 0 6px;padding:4px 8px;background:#fffdf0e8;border-radius:8px;text-align:center}
.mh-workspace[data-mode="division"] td.mh-solved::after{content:"✓";position:absolute;left:1px;top:0;font-size:.55em;color:#205033}

@media(max-width:400px){.mh-formula{font-size:22px}.mh-board-hint{font-size:11px;padding:2px 5px}.mh-workspace[data-mode="division"] .mh-grid{font-size:12px}}
.mh-main [data-sound-toggle][aria-pressed="true"],.mh-dialog [data-sound-toggle][aria-pressed="true"]{background:#e6f0d6;border-color:#288155}
@media(max-width:760px){.mh-toolbar{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:0 8px}.mh-toolbar strong{grid-column:1;grid-row:1;line-height:1.3}.mh-toolbar #timer{grid-column:1;grid-row:2;margin-left:0;font-size:11px}.mh-toolbar button{grid-row:1/3;min-height:44px;padding:6px 10px}.mh-toolbar [data-sound-toggle]{grid-column:2}.mh-toolbar #pause{grid-column:3}}

/* Each division group keeps the dividend above its answer, as on a worksheet. */
.mh-workspace[data-mode="division"] .mh-board-scroll{aspect-ratio:1;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:#a88752 #eee1bd;scroll-behavior:auto;border-radius:6px}
.mh-workspace[data-mode="division"] .mh-grid{aspect-ratio:auto}
.mh-workspace[data-mode="division"] .mh-dividend-row th{background:#e2efe3}
.mh-workspace[data-mode="division"] tbody+tbody .mh-dividend-row th{border-top:6px solid #d5b87e}
.mh-workspace[data-mode="division"] .mh-grid td{background:#fffdf2}
.mh-workspace[data-mode="division"] .mh-grid td.mh-row{background:#fff0c4}
.mh-workspace[data-mode="division"] .mh-grid td.mh-active{background:#e4eec1}
.mh-board-scroll:focus-visible{outline:3px solid #874b08;outline-offset:3px}

/* Keep all exit controls visible without crowding the mobile timer. */
.mh-toolbar{display:flex;flex-wrap:wrap;gap:8px 16px;padding:6px 10px}.mh-play-stats{display:flex;align-items:center;justify-content:space-between;gap:12px;flex:1}.mh-play-actions{display:flex;gap:8px}.mh-toolbar button{min-height:44px;white-space:nowrap}
@media(max-width:760px){.mh-play-stats{flex-basis:100%;line-height:1.3}.mh-play-actions{width:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.mh-toolbar .mh-play-actions button{grid-column:auto;grid-row:auto;padding:6px 4px;font-size:12px}.mh-toolbar #timer{margin-left:auto;font-size:12px}}