@charset "utf-8";
/* Marble Temple — Web Edition. GENERATED by build.py; do not edit.
   Part 1: 146 rules from the Plaza arena-css (00-critical.css .. 18-iphone-safari.css) whose selectors can match the
   classes marbleTemple.js uses, plus keyframes drift, fadein, marbleBarGlow, marbleRelicPulse. Part 2: src/host.css. */
:root{--bg:#0d0a05; --bg-deep:#080603; --raised:#161009; --raised2:#1d150b; --line:#2a2113; --line2:#41321c; --ink:#f0e8d6; --soft:#c4b696; --mute:#8a7c60; --gold:#d4af37; --gold2:#f0c468; --pro:#5aa2ff; --con:#ff6b5e; --serif:Georgia,'Times New Roman',serif; --sans:-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif; --mono:Consolas,Menlo,monospace;}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;background:linear-gradient(180deg,#0d0a05,#080603 70%)}
body{margin:0;background:transparent;color:var(--ink);font:16px/1.6 var(--sans)}
body::before{content:'';position:fixed;inset:-22%;z-index:-2;pointer-events:none;background: radial-gradient(42% 34% at 18% 8%, rgba(212,175,55,.13), transparent 60%), radial-gradient(36% 30% at 84% 90%, rgba(212,175,55,.09), transparent 60%), radial-gradient(30% 26% at 8% 92%, rgba(90,162,255,.05), transparent 60%), radial-gradient(30% 26% at 94% 6%, rgba(255,107,94,.05), transparent 60%); animation:drift 26s ease-in-out infinite alternate}
@media (prefers-reduced-motion: reduce){
body::before{animation:none}
}
a{color:var(--gold2);text-decoration:none}
.wrap{max-width:920px;margin:0 auto;padding:0 16px 80px}
h2{font-family:var(--serif);font-weight:400;font-size:24px;margin:26px 0 10px}
.btn{display:inline-block;border:0;border-radius:6px;padding:9px 16px;font-weight:600;font-size:14px;cursor:pointer;background:linear-gradient(135deg,#f0c468,#d4af37 55%,#bb911f);color:#171105;box-shadow:0 2px 10px rgba(212,175,55,.22);transition:transform .12s ease, box-shadow .2s ease, filter .2s ease}
.btn:hover{filter:brightness(1.08);box-shadow:0 4px 20px rgba(212,175,55,.42);transform:translateY(-1px)}
.btn:active{transform:translateY(0) scale(.98)}
.btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--line2);box-shadow:none}
.btn.ghost:hover{border-color:var(--gold);color:var(--gold2);box-shadow:0 0 14px rgba(212,175,55,.15)}
.btn[disabled]{opacity:.45;cursor:not-allowed}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.muted{color:var(--mute);font-size:13px}
.btn{transition:transform .08s ease, box-shadow .2s ease, background .2s ease}
.btn:active:not(:disabled){transform:scale(.95)}
@media (prefers-reduced-motion: reduce){
.btn:active:not(:disabled){transform:none}
}
.toast{position:fixed;right:14px;bottom:14px;max-width:320px;display:grid;gap:8px;z-index:50}
.toast div{background:var(--raised2);border:1px solid var(--line2);border-left:3px solid var(--gold);border-radius:8px;padding:10px 12px;font-size:13.5px;color:var(--soft);animation:fadein .2s}
.tabs{display:flex;gap:8px;margin:8px 0}
@media(max-width:480px){
h2{font-size:20px}
}
.btn.gold{background:linear-gradient(135deg,#f0c468,#c9992f);color:#231600;border-color:#c9992f;font-weight:700}
.enter{max-width:600px;margin:0 auto;text-align:center;padding:30px 16px 64px}
.marblewrap{position:relative;margin-top:4px;border-radius:18px;overflow:hidden;background:radial-gradient(120% 120% at 50% 28%,#334155,#0b1120 72%);border:1px solid color-mix(in srgb,var(--marble-accent,#8bd5ff) 50%,transparent);box-shadow:inset 0 0 90px rgba(0,0,0,.4),0 18px 55px rgba(2,6,18,.34);isolation:isolate}
.marblewrap>.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.marblecanvas{display:block;width:100%;touch-action:none;cursor:crosshair}
.marblehud{position:absolute;top:8px;left:50%;width:min(94%,900px);transform:translateX(-50%);display:flex;gap:6px;align-items:center;justify-content:center;flex-wrap:wrap;pointer-events:none;font-family:Consolas,monospace;filter:drop-shadow(0 4px 7px rgba(0,0,0,.38))}
.marblehud .mstat{background:linear-gradient(180deg,rgba(16,27,46,.92),rgba(5,11,23,.9));border:1px solid rgba(180,210,232,.38);color:#edf7ff;padding:4px 9px;border-radius:10px;font-size:12px;box-shadow:inset 0 1px rgba(255,255,255,.06)}
.marblehud .mnext{display:flex;align-items:center;gap:6px}
.marblehud .mdot{display:inline-block;width:14px;height:14px;border-radius:50%;box-shadow:inset 0 0 5px rgba(0,0,0,.5),0 0 4px rgba(255,255,255,.35)}
.marblehud .mbar{position:relative;min-width:112px;overflow:hidden;color:#ffe9a8;text-align:center}
.marblehud .mbar .mbarfill{position:absolute;left:0;top:0;bottom:0;width:0;background:linear-gradient(90deg,rgba(232,193,90,.26),rgba(253,224,138,.5));transition:width .3s}
.marblehud .mbar .mbartext{position:relative;font:800 11px Georgia,serif;letter-spacing:.12em}
.marblehud .mbar.full{border-color:#fde68a;box-shadow:0 0 14px rgba(253,224,138,.35)}
.marblehud .mbar.full .mbarfill{background:linear-gradient(90deg,rgba(232,193,90,.5),rgba(253,224,138,.75));animation:marbleBarGlow 1.6s ease-in-out infinite}
.marblehud .marblerelic{pointer-events:auto;border:1px solid rgba(253,224,138,.65);background:linear-gradient(135deg,rgba(74,48,18,.94),rgba(21,27,49,.94));color:#fff0bd;padding:4px 9px;border-radius:9px;font:800 12px Georgia,serif;box-shadow:0 0 16px rgba(250,204,21,.12);cursor:pointer}
.marblehud .marblerelic:disabled{opacity:.48;cursor:default;filter:saturate(.4)}
.marblehud .marblerelic.ready{animation:marbleRelicPulse 2.4s ease-in-out infinite}
.marblehud .mmute{pointer-events:auto;border:1px solid rgba(180,210,232,.4);background:linear-gradient(180deg,rgba(16,27,46,.92),rgba(5,11,23,.9));color:#cfe6ff;padding:4px 9px;border-radius:9px;font:800 12px Georgia,serif;cursor:pointer}
.marblehud .mmute.off{opacity:.55}
.marblehud .mmute.locked{border-color:#fbbf24;color:#fff0bd;box-shadow:0 0 0 2px rgba(251,191,36,.2)}
.mswapbtn{position:absolute;right:14px;bottom:16px;z-index:5;width:54px;height:54px;border-radius:50%;border:1px solid rgba(253,224,138,.5);background:radial-gradient(120% 120% at 30% 25%,rgba(74,58,25,.95),rgba(15,20,38,.95));color:#ffe9a8;font:900 22px Georgia,serif;cursor:pointer;box-shadow:0 8px 22px rgba(0,0,0,.4)}
.mswapbtn:active{transform:scale(.93)}
.mswapbtn:hover,.mswapbtn:focus-visible{border-color:#fde68a;filter:brightness(1.12)}
.marbleovl{position:absolute;inset:0;z-index:8;display:flex;align-items:flex-start;justify-content:center;background:rgba(3,7,18,.76);backdrop-filter:blur(5px);padding:14px;overflow:auto}
.marbleovlcard{margin:auto 0;background:linear-gradient(160deg,#1e293b,#0f172a);border:1px solid color-mix(in srgb,var(--marble-accent,#8bd5ff) 48%,transparent);border-radius:14px;padding:20px 24px;text-align:center;max-width:920px;width:min(92%,920px);box-shadow:0 22px 70px rgba(0,0,0,.42)}
.marbleovlcard .movt{font-family:Georgia,serif;font-size:22px;color:#d9efff;margin-bottom:6px}
.marbleatlas{display:grid;grid-template-columns:repeat(4,minmax(145px,1fr));gap:10px;margin:16px 0 6px;text-align:left}
.marbleshrine{position:relative;min-height:118px;padding:12px;border-radius:12px;border:1px solid rgba(160,194,220,.28);background:rgba(7,14,27,.72);color:#dcecf8;cursor:pointer;text-align:left;font:inherit}
.marbleshrine:hover:not(:disabled),.marbleshrine:focus-visible{border-color:var(--shrine-accent,#8bd5ff);transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,.32)}
.marbleshrine:disabled{cursor:not-allowed;filter:saturate(.2);opacity:.48}
.marbleshrine .msicon{font-size:24px}
.marbleshrine .msname{display:block;font:700 15px Georgia,serif;margin:5px 0 3px}
.marbleshrine .msgoal{display:block;font-size:11px;color:#a9bfd1;line-height:1.35}
.marbleshrine .msstars{display:block;margin-top:7px;color:#ffd66d;letter-spacing:2px}
.marbleshrine .msbest{position:absolute;right:9px;top:9px;font:11px Consolas,monospace;color:#9fc4dd}
.marblemastery{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin:10px 0}
.marblemastery span{border:1px solid rgba(160,194,220,.24);border-radius:999px;padding:4px 8px;color:#b9cede;font-size:12px}
.marblemastery .won{border-color:#ffd66d;color:#ffe69a;background:rgba(255,214,109,.08)}
@media(max-width:720px){
.marbleatlas{grid-template-columns:repeat(2,minmax(125px,1fr))}
.marblewrap{margin-top:0;border-radius:10px}
.marbleovl{align-items:flex-start}
.marbleovlcard{margin:auto 0;padding:16px 12px}
.marbleshrine{min-height:104px}
.marblehud{top:7px;left:8px;right:8px;width:auto;transform:none;gap:4px;justify-content:flex-start}
.marblehud .mstat{font-size:9.5px;padding:3px 5px}
.marblehud .mbar{min-width:72px}
.marblehud .marblerelic{font-size:9.5px;padding:4px 5px}
.marblehud .mmute{font-size:9.5px;padding:4px 6px}
.mswapbtn{right:10px;bottom:14px}
}
.marblemodes{margin-top:14px;display:flex;flex-direction:column;gap:8px}
.marblemode{display:flex;align-items:center;gap:11px;width:100%;padding:11px 13px;border-radius:14px;border:1px solid rgba(251,191,36,.45);background:linear-gradient(120deg,rgba(120,84,12,.32),rgba(15,23,42,.72));color:#e7f4ff;cursor:pointer;text-align:left}
.marblemode:hover{border-color:rgba(251,191,36,.9);background:linear-gradient(120deg,rgba(146,102,14,.42),rgba(15,23,42,.8))}
.marblemode .mmicon{flex:0 0 auto;font-size:26px;line-height:1}
.marblemode .mmbody{display:flex;flex-direction:column;gap:3px;min-width:0}
.marblemode .mmname{font-weight:900;font-size:13.5px;color:#ffe9a8}
.marblemode .mmline{font-size:11.5px;line-height:1.4;color:#c6d4e4}
@media(max-width:720px){
.marblemode .mmline{font-size:11px}
}
.marblewrap .bastbuildtoggle{position:absolute;left:14px;bottom:14px;z-index:6;width:auto;min-width:46px;height:46px;padding:0 15px;border-radius:999px;font-weight:800;letter-spacing:.01em;white-space:nowrap;border:1px solid rgba(251,191,36,.55);background:rgba(15,23,42,.85);font-size:20px;cursor:pointer;box-shadow:0 4px 14px rgba(2,6,18,.5)}
.marblewrap .bastbuildtoggle.armed{background:rgba(120,84,12,.9);border-color:#fbbf24;box-shadow:0 0 0 3px rgba(251,191,36,.3),0 4px 14px rgba(2,6,18,.5)}
.marblewrap .basthorn,.marblewrap .baststand{position:absolute;z-index:6;padding:8px 14px;border-radius:999px;border:1px solid rgba(251,191,36,.6);background:rgba(15,23,42,.9);color:#ffe9a8;font-weight:700;font-size:13px;cursor:pointer;box-shadow:0 4px 14px rgba(2,6,18,.5);white-space:nowrap}
.marblewrap .basthorn{left:50%;transform:translateX(-50%);top:84px}
.marblewrap .baststand{right:14px;bottom:80px;border-color:rgba(148,163,184,.5);color:#cbd5e1;background:rgba(15,23,42,.82)}
.marblehud .maether{color:#bae6fd;border-color:rgba(125,211,252,.45)}
@media(max-width:720px){
.marblewrap .basthorn{top:70px;font-size:11.5px;padding:6px 10px}
.marblewrap .baststand{right:10px;bottom:76px;font-size:11.5px;padding:6px 10px}
.marblewrap .bastbuildtoggle{left:10px;bottom:10px;height:42px;font-size:17px;padding:0 12px}
}
.bastmenu{position:absolute;z-index:8;display:flex;flex-direction:column;gap:6px;width:220px;padding:10px;border-radius:14px;border:1px solid rgba(148,163,184,.4);background:rgba(10,15,28,.94);box-shadow:0 12px 34px rgba(2,6,18,.6)}
.bastmenu .bmtitle{font-weight:900;color:#ffe9a8;font-size:13.5px}
.bastmenu .bmlore{color:#9fb2c8;font-size:11px;line-height:1.35}
.bastmenubtn{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:7px 9px;border-radius:10px;border:1px solid rgba(148,163,184,.35);background:rgba(30,41,59,.85);color:#e7f4ff;cursor:pointer;text-align:left}
.bastmenubtn:hover{border-color:rgba(251,191,36,.6)}
.bastmenubtn.off{opacity:.45;cursor:default}
.bastmenubtn.ghost{align-items:center;background:transparent}
.bastmenubtn .bmlabel{font-weight:800;font-size:12.5px}
.bastmenubtn .bmsub{font-size:10.5px;color:#9fb2c8;line-height:1.3}
@media(max-width:720px){
.marblewrap .marblehud{right:max(62px,calc(env(safe-area-inset-right) + 58px))}
}
.marblewrap.marblesheet .bastmenu.open{position:fixed;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:min-content;gap:7px;left:50%!important;right:auto!important;top:50%!important;bottom:auto!important;transform:translate(-50%,-50%);width:min(560px,calc(100vw - env(safe-area-inset-left) - env(safe-area-inset-right) - 24px));max-height:calc(100vh - 32px);max-height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 24px);box-sizing:border-box;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;touch-action:pan-y;padding:12px;z-index:19;box-shadow:0 18px 48px rgba(0,0,0,.72)}
.marblewrap.marblesheet .bastmenu .bmtitle,.marblewrap.marblesheet .bastmenu .bmlore,.marblewrap.marblesheet .bastmenu .bastmenubtn.ghost{grid-column:1/-1}
.marblewrap.marblesheet .bastmenubtn{min-height:58px;padding:9px 11px;touch-action:manipulation}
.marblewrap.marblesheet .bastmenubtn .bmlabel{font-size:14px}
.marblewrap.marblesheet .bastmenubtn .bmsub{font-size:11.5px;line-height:1.25}
.marblewrap.marblesheet .bastmenu .bastmenubtn.ghost{position:sticky;bottom:-4px;min-height:46px;background:rgba(10,15,28,.98);border-color:rgba(253,224,138,.42)}
.marblewrap.marblesheet.marblenarrow .bastmenu.open{grid-template-columns:1fr;width:calc(100vw - env(safe-area-inset-left) - env(safe-area-inset-right) - 16px);padding:10px;gap:6px}
.marblewrap.marblesheet.marblenarrow .bastmenubtn{min-height:52px}
@media(max-width:720px){
.bastmenu{width:200px}
}
@media(max-width:480px){
.marbleatlas{grid-template-columns:1fr}
.marbleshrine{min-height:0}
}
@media(prefers-reduced-motion:reduce){
.marblehud .marblerelic.ready,.marblehud .mbar.full .mbarfill{animation:none}
.mswapbtn:active{transform:none}
}
body.plazamode{overflow:hidden}
body.plazamode .wrap{padding-top:0;padding-bottom:0}
body.gamemode{background:linear-gradient(180deg,#221809,#0d0a05) fixed}
body.gamemode .wrap{max-width:none;padding:0}
body.gamemode #view{padding:46px 8px 8px}
body.gamemode #view>h2{display:none}
body.gamemode #view>a{position:fixed;top:calc(9px + env(safe-area-inset-top,0px));left:calc(10px + env(safe-area-inset-left,0px));z-index:2600;background:rgba(10,7,4,.62);border:1px solid rgba(255,222,150,.28);border-radius:999px;padding:7px 13px;font-size:13px;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);box-shadow:0 2px 8px rgba(0,0,0,.55)}
@media(max-width:560px){
body.gamemode #view>a{max-width:44vw;min-height:44px;box-sizing:border-box;display:inline-flex;align-items:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.gamemode .gmhelp{width:44px;height:44px}
}
@media(pointer:coarse) and (orientation:landscape) and (max-height:520px){
body.gamemode #view>a{max-width:42vw;min-height:44px;box-sizing:border-box;display:inline-flex;align-items:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.gamemode .gmhelp{width:44px;height:44px}
}
@media(max-width:340px){
body.gamemode #view>a{max-width:30vw}
}
body.gamemode #view>div.muted{display:none}
.gmhelp{position:fixed;top:calc(9px + env(safe-area-inset-top,0px));left:auto;right:auto;z-index:2600;background:rgba(10,7,4,.62);border:1px solid rgba(255,222,150,.28);border-radius:999px;width:32px;height:32px;color:var(--ink);font-weight:800;cursor:pointer;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
body.gamemode{--game-back-width:min(156px,calc(100vw - 242px - env(safe-area-inset-left,0px) - env(safe-area-inset-right,0px)))}
body.gamemode #view>a{display:block;box-sizing:border-box;width:var(--game-back-width);max-width:var(--game-back-width);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.gamemode .gmhelp{left:calc(18px + env(safe-area-inset-left,0px) + var(--game-back-width))!important}
@media(max-width:760px){
body.gamemode{--game-gold-width:clamp(64px,calc(100vw - 334px - env(safe-area-inset-left,0px) - env(safe-area-inset-right,0px)),160px)}
body.gamemode .gmhelp{width:44px;height:44px}
body.gamemode #view>a{height:44px;line-height:42px;padding:0 8px}
}
:root{--mgparch:#f0e3c4; --mgparch2:#e6d5ac; --mgink:#3a2d18; --mgink2:#6b5836; --mgblue:#2b4a8c; --mgblue2:#1e3564; --mggold:#d9a13b; --mggold2:#b07f22; --mggold3:#f3cf7e;}
.btn{position:relative;min-height:38px;padding:9px 16px;border:1px solid rgba(220,177,91,.72);border-radius:7px;background:linear-gradient(180deg,#d8ad59,#b77b2f);color:#17120b;font-family:system-ui,-apple-system,'Segoe UI',sans-serif;font-size:13px;font-weight:820;letter-spacing:.02em;text-shadow:none;box-shadow:0 5px 16px rgba(0,0,0,.28),inset 0 1px rgba(255,238,191,.34);transition:transform .12s ease,border-color .15s ease,background .15s ease,box-shadow .15s ease}
.btn:not(:disabled):hover{filter:none;border-color:#f0d28a;background:linear-gradient(180deg,#e3bd6e,#c58a3b);box-shadow:0 8px 22px rgba(0,0,0,.34),0 0 0 1px rgba(241,208,133,.12)}
.btn:focus-visible{outline:2px solid #efd18a;outline-offset:3px}
.btn:not(:disabled):active{transform:translateY(1px);box-shadow:0 3px 9px rgba(0,0,0,.32),inset 0 1px 3px rgba(67,42,13,.28)}
.btn.ghost{background:rgba(14,17,20,.82);color:#e8dfcc;border:1px solid rgba(207,177,115,.38);text-shadow:none;box-shadow:0 5px 15px rgba(0,0,0,.25),inset 0 1px rgba(255,255,255,.045)}
.btn.ghost:not(:disabled):hover{border-color:rgba(235,202,132,.72);background:#202326;color:#fff2d6}
.btn.gold{background:linear-gradient(180deg,#dcb463,#b77b2f);color:#17120b;border:1px solid rgba(239,205,134,.84)}
#view>h2{font-family:Georgia,'Times New Roman',serif;letter-spacing:.6px;color:#f0c468;text-shadow:0 2px 0 rgba(90,60,10,.55),0 4px 10px rgba(0,0,0,.5)}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
@media (pointer:coarse){
:where(button,.btn,a,canvas,[role=button]){-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}
:where(button,.btn,canvas,[role=button]){-webkit-user-select:none;user-select:none}
:where(button,.btn,a,[role=button]){touch-action:manipulation}
}
@keyframes drift{from{transform:translate3d(-1.5%,-1%,0) scale(1)}to{transform:translate3d(1.5%,1.5%,0) scale(1.06)}}
@keyframes fadein{from{opacity:0;transform:translateY(4px)}to{opacity:1}}
@keyframes marbleBarGlow{50%{filter:brightness(1.3)}}
@keyframes marbleRelicPulse{50%{box-shadow:0 0 22px rgba(250,204,21,.38);border-color:#fde68a}}
/* ── Web Edition host chrome (hand-written; everything above is extracted from the Plaza) ── */
.mt-loading{margin:0;padding:84px 16px;text-align:center;color:var(--soft);font-size:15px}
body.gamemode #view>.mt-loading{padding-top:38px}

/* The one off-site link. It sits in the top strip's empty right end (where the Plaza keeps
   its header chips), so the page never scrolls under the fixed back pill. Absent in portal mode. */
.mt-foot{position:fixed;top:calc(9px + env(safe-area-inset-top,0px));right:calc(12px + env(safe-area-inset-right,0px));z-index:2600;height:32px;display:flex;align-items:center;font-size:12.5px;line-height:1.2;white-space:nowrap}
.mt-foot a{color:var(--mute);padding:6px 2px}
.mt-foot a:hover,.mt-foot a:focus-visible{color:var(--gold2)}
@media(max-width:760px){.mt-foot{height:44px}}
@media(max-width:560px){.mt-foot .mt-long{display:none}}
body.mt-portal .mt-foot{display:none}

/* Portal mode: "‹ Menu" returns to the atlas, so it is pointless ON the atlas or beside
   the result card's own "Temple atlas" button (host.js sets these two classes). */
body.mt-portal .mt-menu-card .mt-exit,
body.mt-portal.mt-atlas-open #view>a.mt-exit{display:none}
body.gamemode.mt-portal.mt-atlas-open .gmhelp{left:calc(10px + env(safe-area-inset-left,0px))!important}

/* First-visit rules sheet: Play first, two rules, the rest folded. */
.mt-modal{position:fixed;inset:0;z-index:6000;display:flex;align-items:center;justify-content:center;padding:14px;background:rgba(10,7,3,.62)}
.mt-card{box-sizing:border-box;width:100%;max-width:520px;max-height:calc(100vh - 28px);max-height:calc(100dvh - 28px);overflow:auto;padding:14px 16px 16px;border-radius:14px;border:1px solid rgba(226,180,90,.35);background:linear-gradient(180deg,#241a10,#1a1209);box-shadow:0 24px 60px rgba(0,0,0,.55)}
.mt-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.mt-head h3{margin:0;font:400 21px/1.25 var(--serif);color:var(--ink)}
.mt-x{flex:0 0 auto;min-width:40px;min-height:40px;padding:0 10px;font-size:16px}
.mt-play{display:block;width:100%;margin:12px 0 12px;padding:14px 18px;font-size:19px;letter-spacing:.02em}
.mt-rules p,.mt-more p{margin:0 0 9px;font-size:14px;line-height:1.5;color:var(--soft)}
.mt-more{margin-top:2px}
.mt-more summary{cursor:pointer;color:var(--gold2);font-size:14px;font-weight:600;padding:6px 0}
.mt-more[open] summary{margin-bottom:6px}
@media(max-width:480px){.mt-card{padding:12px 13px 13px}.mt-head h3{font-size:19px}.mt-play{padding:13px 16px;font-size:18px}}

/* Toasts sit above the game's corner controls on a phone. */
@media(max-width:560px){.toast{left:14px;right:14px;bottom:calc(84px + env(safe-area-inset-bottom,0px));max-width:none}}

/* The run-end support line: quiet, below the card's buttons (web edition only). */
.mt-support{margin:14px 0 0;font:13px/1.4 Georgia,serif;opacity:.86}
.mt-support a{color:#e8c15a;text-decoration:underline;text-underline-offset:3px}

/* ── Web build only: build.py appends this after host.css. The portal build has none of it. ── */

/* A few lines about the game, for search engines, link previews and anyone who scrolls.
   They sit below the game and start below the first screen: the game still fills the
   window when the page opens. The top padding keeps the few pixels under the game empty. */
.mt-about{max-width:680px;margin:0 auto;padding:40px 18px 48px;color:var(--soft);font-size:16px;line-height:1.6}
.mt-about h1{margin:0 0 10px;font:400 24px/1.25 var(--serif);color:var(--gold2)}
.mt-about p{margin:0 0 10px}
.mt-about p:last-child{margin-bottom:0}

/* The page can scroll now, and the game was built for one that could not. host.js keeps
   the wheel, the keys and resizes in line; touch is here.
   A drag that starts on a game control must not move the page. The game's buttons allow
   panning (touch-action: manipulation), and only its canvas did not. The fixed top
   controls let a downward drag bring the page back to the top (pan-up); a browser without
   pan-up keeps none. */
.marblewrap>button,.marblehud,.mt-modal{touch-action:none}
.gmhelp,#view>a,.mt-foot a{touch-action:none;touch-action:pan-up}
/* A rules sheet scrolled to its end stops there instead of carrying on into the page. So
   does a shrine list on a touch screen; with a mouse, the wheel may carry on into the page
   from the menu, pause and result screens, so the words stay in reach. */
.mt-card{overscroll-behavior:contain}
@media (pointer:coarse){.marbleovl{overscroll-behavior:contain}}
