@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--bg:#090e16;--surface:#101925;--surface2:#142130;--line:#293744;--text:#ecf5f3;--muted:#91a5af;--mint:#95f5c4;--blue:#8cbfff;--violet:#ab9aff;--max:1160px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.6 'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;min-width:320px}
body:before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 60% 34% at 90% 5%,rgba(59,115,128,.17),transparent 70%),radial-gradient(ellipse 55% 45% at 0 48%,rgba(47,62,95,.13),transparent 72%)}
::selection{background:rgba(149,245,196,.35);color:#fff}
a{color:inherit;text-decoration:none}
button,input{font:inherit}
button{cursor:pointer}
button:disabled{cursor:not-allowed;opacity:.5}
a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid var(--mint);outline-offset:4px}
.container{width:min(var(--max),calc(100% - 48px));margin-inline:auto}
.site-header{position:sticky;top:0;z-index:30;background:rgba(9,14,22,.83);backdrop-filter:blur(16px);border-bottom:1px solid rgba(120,154,164,.12)}
.nav-row{min-height:79px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:inline-flex;align-items:center;gap:13px;font-family:'Space Grotesk',sans-serif;font-size:16px;font-weight:700;letter-spacing:.06em;white-space:nowrap}
.brand-mark{display:grid;place-items:center;border:1px solid rgba(149,245,196,.55);background:rgba(149,245,196,.08);border-radius:10px;width:39px;height:39px;color:var(--mint);font-weight:700;letter-spacing:-.1em;padding-right:3px}
.brand-dot{color:var(--mint)}
.nav-links{display:flex;align-items:center;gap:30px;font-size:13px;font-weight:700;color:#9fb0ba}
.nav-links a:hover,.nav-links a[aria-current=page]{color:var(--mint)}
.nav-pill{font-size:12px;border:1px solid var(--line);background:#101a24;padding:9px 13px;border-radius:99px;white-space:nowrap;color:#b6c8cf}
.nav-pill .status-dot,.eyebrow-dot{display:inline-block;width:7px;height:7px;background:var(--mint);border-radius:50%;box-shadow:0 0 12px var(--mint);margin-right:8px}
.kicker{font-family:'Space Grotesk',sans-serif;font-size:11px;letter-spacing:.22em;font-weight:700;text-transform:uppercase;color:var(--mint)}
.hero{display:grid;grid-template-columns:1.04fr .96fr;align-items:center;gap:45px;min-height:660px;padding:75px 0 98px}
.hero h1,.page-heading h1{font-family:'Space Grotesk',sans-serif;font-weight:600;letter-spacing:-.064em;line-height:1.075;margin:21px 0 24px;font-size:clamp(48px,6vw,84px)}
.hero h1 em,.page-heading h1 em{font-style:normal;color:var(--mint)}
.lead{max-width:530px;font-size:17px;line-height:1.85;color:var(--muted);margin:0 0 31px}
.hero-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:11px;min-height:48px;padding:12px 21px;border-radius:10px;font-size:13px;font-weight:700;letter-spacing:.015em;border:1px solid transparent;transition:transform .16s,background .16s,border-color .16s}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:var(--mint);color:#091b17;border-color:var(--mint)}
.btn-primary:hover{background:#c5ffe3}
.btn-secondary{background:rgba(21,36,49,.76);color:#dbe9ed;border-color:var(--line)}
.btn-secondary:hover{border-color:#617785}
.tiny-note{color:#79919b;font-size:12px;margin-top:26px}
.hero-console{position:relative;min-height:445px;border-radius:22px;background:linear-gradient(145deg,#192637,#0c1522 75%);border:1px solid #344656;box-shadow:0 32px 95px rgba(0,0,0,.35),0 0 80px rgba(77,180,158,.05);overflow:hidden}
.hero-console:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 96%,rgba(139,181,185,.045) 98%);background-size:100% 7px;pointer-events:none}
.console-head{height:52px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #2c4150;padding:0 20px;font:11px 'Space Grotesk',sans-serif;letter-spacing:.1em;color:#8198a6}
.window-lights{display:flex;gap:7px}.window-lights span{height:8px;width:8px;border-radius:50%;background:#4a5b68}.window-lights span:first-child{background:#f29e90}.window-lights span:nth-child(2){background:#edc779}.window-lights span:nth-child(3){background:#92ddbb}
.console-body{position:relative;display:grid;place-items:center;height:346px;background-image:linear-gradient(rgba(117,176,176,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(117,176,176,.06) 1px,transparent 1px);background-size:37px 37px}
.orbit{height:226px;width:226px;display:grid;place-items:center;position:relative}
.orbit:before,.orbit:after{content:"";position:absolute;inset:0;border:1px solid rgba(147,231,194,.36);border-radius:50%;box-shadow:0 0 35px rgba(149,245,196,.055)}
.orbit:after{inset:26px;border-style:dashed;border-color:rgba(140,191,255,.25);animation:spin 40s linear infinite}
.orbit-core{position:relative;z-index:2;width:108px;height:108px;border-radius:25px;display:grid;place-items:center;transform:rotate(-12deg);background:linear-gradient(145deg,#b4ffdb,#6cc8c1);box-shadow:0 0 80px rgba(149,245,196,.3),0 20px 36px rgba(0,0,0,.4);color:#10322d;font:700 38px 'Space Grotesk',sans-serif}
.orbit:before{animation:pulse 5s ease-in-out infinite}
.orbit-node{position:absolute;z-index:3;border:1px solid #4c7e87;background:#1b3e49;border-radius:8px;padding:5px 9px;color:#a5f4d6;font:10px 'Space Grotesk',sans-serif;letter-spacing:.08em}
.node-a{top:11px;right:-24px}.node-b{left:-35px;bottom:35px;color:#a5cafa}
.console-foot{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #2a3d4e;padding:16px 20px;color:#88a0ad;font:10px 'Space Grotesk',sans-serif;letter-spacing:.13em}
.console-foot strong{color:var(--mint);font-weight:600}
.section{padding:40px 0 105px}
.section-heading{display:flex;justify-content:space-between;gap:28px;align-items:end;margin-bottom:26px}
.section h2{font:600 clamp(31px,4vw,48px)/1.13 'Space Grotesk',sans-serif;letter-spacing:-.05em;margin:10px 0 0}
.section-subtitle{font-size:14px;color:var(--muted);max-width:330px;margin:0}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.feature-card{position:relative;display:flex;flex-direction:column;min-height:290px;border:1px solid var(--line);border-radius:16px;padding:27px;background:linear-gradient(153deg,#162333,#0f1925);overflow:hidden;transition:transform .2s,border-color .2s}
.feature-card:hover{transform:translateY(-5px);border-color:#5c8290}
.feature-card .index{font:12px 'Space Grotesk',sans-serif;color:#718998;letter-spacing:.12em}
.card-symbol{display:grid;place-items:center;height:67px;width:67px;margin:22px 0 22px;border-radius:17px;background:rgba(149,245,196,.09);border:1px solid rgba(149,245,196,.17);font-size:29px;color:var(--mint)}
.card-symbol.blue{background:rgba(140,191,255,.08);border-color:rgba(140,191,255,.17);color:var(--blue)}
.card-symbol.violet{background:rgba(171,154,255,.08);border-color:rgba(171,154,255,.17);color:var(--violet)}
.feature-card h3{font:600 24px 'Space Grotesk',sans-serif;letter-spacing:-.04em;margin:0 0 7px}
.feature-card p{font-size:13px;line-height:1.65;color:var(--muted);margin:0 0 20px}
.card-bottom{margin-top:auto;font-size:12px;font-weight:700;color:var(--mint);letter-spacing:.02em}
.feature-card:after{content:"";height:120px;width:120px;position:absolute;top:-65px;right:-55px;border-radius:50%;background:rgba(149,245,196,.06);filter:blur(5px)}
.note-strip{margin:0 0 98px;border:1px solid #2c4451;border-radius:16px;padding:26px 30px;display:flex;justify-content:space-between;align-items:center;gap:30px;background:linear-gradient(90deg,#12242c,#111a27)}
.note-strip h3{font:600 23px 'Space Grotesk',sans-serif;letter-spacing:-.04em;margin:6px 0}
.note-strip p{font-size:13px;color:var(--muted);margin:0}
.site-footer{border-top:1px solid rgba(120,154,164,.2);padding:27px 0 34px}
.footer-row{display:flex;align-items:center;justify-content:space-between;gap:20px;color:#8197a2;font-size:12px}
.footer-row a:hover{color:var(--mint)}
.page-heading{padding:82px 0 42px}
.page-heading h1{font-size:clamp(45px,5.7vw,70px)}
.page-heading .lead{max-width:680px}
.back-link{display:inline-flex;gap:10px;align-items:center;color:#b4c8cf;font-size:13px}
.back-link:hover{color:var(--mint)}
.app-shell{border:1px solid #2d4150;background:linear-gradient(150deg,#152230,#0e1722);border-radius:22px;padding:25px;margin:7px 0 100px;box-shadow:0 30px 80px rgba(0,0,0,.2)}
.app-topbar{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:24px}
.app-topbar h2{font:600 20px 'Space Grotesk',sans-serif;margin:0}
.app-topbar p{font-size:12px;color:var(--muted);margin:4px 0 0}
.small-tag{font-size:10px;letter-spacing:.12em;color:var(--mint);border:1px solid #3b655e;padding:6px 9px;border-radius:99px;white-space:nowrap}
.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:16px}
.stat{border:1px solid #2c4350;background:#0b1520;border-radius:12px;padding:15px 19px}
.stat span{display:block;color:#879caa;font-size:11px;text-transform:uppercase;letter-spacing:.12em}
.stat strong{font:600 30px 'Space Grotesk',sans-serif}
.game-arena{height:370px;position:relative;overflow:hidden;border:1px solid #355363;border-radius:16px;background:radial-gradient(circle at 50% 50%,#193348,#0b1724 66%);background-image:linear-gradient(rgba(145,196,202,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(145,196,202,.055) 1px,transparent 1px),radial-gradient(circle at 50% 50%,#193348,#0b1724 66%);background-size:32px 32px,32px 32px,100% 100%;display:grid;place-items:center}
.game-message{text-align:center;padding:25px;max-width:380px;pointer-events:none}
.game-message h3{font:600 29px 'Space Grotesk',sans-serif;margin:0 0 10px}
.game-message p{font-size:13px;color:#a1b5c1;margin:0}
.target{position:absolute;z-index:3;top:50%;left:50%;width:67px;height:67px;border-radius:50%;border:0;background:radial-gradient(circle at 34% 30%,#fff,#a4ffe0 35%,#46bfbd 75%);box-shadow:0 0 0 8px rgba(149,245,196,.08),0 0 38px rgba(149,245,196,.55);transition:left .13s,top .13s,transform .12s}
.target:active{transform:scale(.86)}
.target[hidden],.game-message[hidden],.preview-image[hidden]{display:none!important}
.game-controls{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;margin-top:19px}
.helper{font-size:12px;color:#8da4af}
.editor-layout{display:grid;grid-template-columns:275px 1fr;gap:23px}
.editor-sidebar{display:flex;flex-direction:column;gap:16px}
.control-group{border:1px solid #2b3e4c;background:#0d1722;padding:18px;border-radius:13px}
.control-group label{display:flex;justify-content:space-between;font-size:12px;color:#c0d0d7;margin-bottom:10px;font-weight:700}
.control-group output{color:var(--mint)}
.control-group input[type=range]{width:100%;accent-color:#95f5c4}
.file-picker{position:relative;display:flex;align-items:center;justify-content:center;min-height:52px;padding:10px 15px;text-align:center;border:1px dashed #6a9f95;border-radius:11px;color:#b7f7dd;background:rgba(149,245,196,.06);font-size:13px;font-weight:700;cursor:pointer}
.file-picker input{position:absolute;opacity:0;width:100%;height:100%;inset:0;cursor:pointer}
.editor-preview{min-height:405px;display:grid;place-items:center;position:relative;padding:22px;overflow:hidden;border:1px solid #304959;border-radius:15px;background-color:#0b1420;background-image:linear-gradient(45deg,#14202d 25%,transparent 25%),linear-gradient(-45deg,#14202d 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#14202d 75%),linear-gradient(-45deg,transparent 75%,#14202d 75%);background-size:24px 24px;background-position:0 0,0 12px,12px -12px,-12px 0}
.editor-preview img{max-width:100%;max-height:490px;object-fit:contain;box-shadow:0 18px 45px rgba(0,0,0,.4)}
.editor-placeholder{text-align:center;color:#748e9c;font-size:13px;max-width:275px}
.editor-placeholder span{display:block;font-size:41px;margin-bottom:12px;color:#9af1c6}
.editor-actions{display:flex;flex-wrap:wrap;gap:9px}
.editor-actions .btn{flex:1;white-space:nowrap;padding:11px 13px}
.notice{font-size:12px;color:#93abb6;border:1px solid #2b4453;background:#0d1c27;border-radius:11px;padding:13px 17px;margin-top:17px}
.works-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:10px 0 30px}
.work-panel{border:1px solid #2d4450;border-radius:16px;background:#111c29;min-height:240px;padding:25px;display:flex;flex-direction:column}
.work-panel .work-art{height:65px;display:flex;align-items:center;font:600 45px 'Space Grotesk',sans-serif;letter-spacing:-.1em;color:#466c72}
.work-panel h2{font:600 20px 'Space Grotesk',sans-serif;margin:17px 0 6px}
.work-panel p{font-size:13px;color:#92a8b2;margin:0}
.work-panel .small-tag{margin-top:auto;align-self:flex-start}
.empty-note{border:1px dashed #415b65;border-radius:13px;padding:27px;color:#91a5b0;font-size:14px;margin-bottom:90px}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{50%{transform:scale(1.06);opacity:.6}}
@media(max-width:1000px){.hero{gap:22px}.nav-pill{display:none}.hero-console{min-height:390px}.console-body{height:295px}}
@media(max-width:760px){.container{width:calc(100% - 34px)}.nav-row{min-height:72px;flex-wrap:wrap;padding:12px 0}.nav-links{gap:16px;font-size:12px;overflow-x:auto;max-width:100%}.hero{grid-template-columns:1fr;padding:70px 0 50px;min-height:0}.hero-console{max-width:540px;width:100%;margin:0 auto}.section{padding:35px 0 65px}.section-heading{align-items:start;flex-direction:column;gap:12px}.cards,.works-grid{grid-template-columns:1fr}.feature-card{min-height:235px}.note-strip{flex-direction:column;align-items:start;margin-bottom:55px}.footer-row{align-items:start;flex-direction:column}.page-heading{padding:53px 0 25px}.editor-layout{grid-template-columns:1fr}.editor-preview{min-height:290px}.app-shell{padding:17px;margin-bottom:60px}}
@media(max-width:440px){.brand{font-size:14px}.nav-links{width:100%;justify-content:space-between}.hero h1{font-size:48px}.hero-console{min-height:355px}.console-body{height:265px}.orbit{transform:scale(.8)}.stat{padding:12px}.stat strong{font-size:24px}.game-arena{height:315px}.editor-actions{flex-direction:column}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.001ms!important;transition-duration:.001ms!important}}

/* MINESWEEPER / LAB EDITION */
.mine-heading{padding:71px 0 40px}
.mine-title-row{display:flex;align-items:center;justify-content:space-between;gap:32px}
.mine-heading h1{font:600 clamp(52px,7.4vw,95px)/1.03 'Space Grotesk',sans-serif;letter-spacing:-.07em;margin:15px 0 19px}
.mine-heading h1 em{color:var(--mint);font-style:normal}
.mine-heading p{max-width:630px;margin:0;color:#9badb9;font-size:16px;line-height:1.85}
.mine-heading-mark{width:136px;height:136px;border:1px solid #345064;border-radius:29px;background:radial-gradient(circle at 50% 40%,#1e4047,#101a29 72%);display:grid;place-content:center;justify-items:center;flex:none;transform:rotate(7deg);box-shadow:0 25px 60px #0004}
.mine-heading-mark span{font-size:61px;color:var(--mint);height:75px;line-height:1;text-shadow:0 0 25px #95f5c47c}
.mine-heading-mark small{font:600 10px 'Space Grotesk',sans-serif;letter-spacing:.17em;color:#a0c9c5}
.mine-shell{border:1px solid #334959;border-radius:20px;background:linear-gradient(145deg,#162433 0%,#0f1a26 45%,#0d1722 100%);box-shadow:0 24px 95px #0004;overflow:hidden;margin-bottom:45px}
.mine-toolbar{display:flex;gap:15px;align-items:center;justify-content:space-between;padding:20px 25px;border-bottom:1px solid #304452;background:rgba(8,19,29,.56);flex-wrap:wrap}
.mine-brand{display:flex;align-items:center;gap:13px}
.mine-brand strong{display:block;font:700 14px 'Space Grotesk',sans-serif;letter-spacing:.14em}
.mine-brand small{display:block;color:#8ca3b1;font-size:10px;letter-spacing:.15em;margin-top:2px}
.mine-status-led{width:11px;height:11px;background:#a0f6c9;border-radius:50%;box-shadow:0 0 0 5px #95f5c414,0 0 16px #95f5c459}
.mine-levels{display:flex;background:#0a1420;border:1px solid #334554;border-radius:11px;padding:4px;gap:2px}
.mine-level{background:none;border:0;border-radius:8px;padding:10px 14px;color:#9fb2bd;font-size:12px;font-weight:700;min-width:78px}
.mine-level span{font-size:10px;color:#66818f;display:block;font-weight:600;letter-spacing:.045em;margin-top:1px}
.mine-level:hover{color:#effff8;background:#1a2c3b}
.mine-level.is-active{background:#23483f;color:#abffcf;box-shadow:inset 0 0 0 1px #3a7664}
.mine-level.is-active span{color:#89d8b5}
.mine-reset{background:#1a2e3d;color:#e7f6f1;border:1px solid #3a5261;border-radius:11px;padding:11px 17px;white-space:nowrap;font-size:13px;font-weight:700;transition:.16s}
.mine-reset:hover{border-color:#98edc2;transform:translateY(-1px)}
.mine-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:#2c4353;border-bottom:1px solid #304452}
.mine-stat{background:#101e2b;text-align:center;padding:16px 10px}
.mine-stat-time{background:#152938}
.mine-stat-label{display:block;font-size:10px;letter-spacing:.18em;color:#91aabb;font-weight:700}
.mine-stat>div{display:flex;align-items:baseline;justify-content:center;gap:9px;margin-top:1px}
.mine-stat strong{font:600 clamp(27px,4vw,43px)/1.3 'Space Grotesk',sans-serif;letter-spacing:-.035em;font-variant-numeric:tabular-nums;color:#f2f9f5}
.mine-stat-time strong{color:#a3fbd3}
.mine-stat small{font-size:11px;color:#6e8b9a;font-weight:800}
.mine-mini-icon{color:#80c5ad;font-size:23px}
.mine-trophy{color:#e8c784}
.mine-play-layout{display:grid;grid-template-columns:minmax(0,1fr) 250px;min-width:0}
.mine-play-area{padding:22px 24px 24px;min-width:0}
.mine-board-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:13px}
.mine-board-status{display:flex;align-items:center;gap:8px;font-size:12px;color:#c8dcd7;font-weight:600}
.mine-pulse{width:7px;height:7px;border-radius:50%;background:#91edc2;box-shadow:0 0 8px #76edb98c}
.mine-board-coordinate{font:600 10px 'Space Grotesk',sans-serif;color:#718d9a;letter-spacing:.08em;white-space:nowrap}
.mine-board-scroll{background:radial-gradient(ellipse at 50% 25%,#213a4b 0%,#0b1928 65%);border:1px solid #345061;border-radius:13px;min-width:0;min-height:420px;overflow-x:auto;overflow-y:hidden;scrollbar-color:#527c81 #0b1823;scrollbar-width:thin;overscroll-behavior-x:contain}
.mine-board-scroll:focus-visible{outline:2px solid var(--mint);outline-offset:3px}
.mine-grid{--mine-size:39px;display:grid;grid-template-columns:repeat(var(--mine-cols,9),var(--mine-size,39px));gap:3px;padding:17px;width:max-content;margin:0 auto;user-select:none;-webkit-user-select:none;touch-action:pan-x pan-y}
.mine-grid[data-level="medium"]{--mine-size:29px}
.mine-grid[data-level="hard"]{--mine-size:27px;gap:2px}
.mine-cell{position:relative;appearance:none;width:var(--mine-size);height:var(--mine-size);border-radius:7px;border:1px solid #476174;background:linear-gradient(145deg,#31516a,#1c3347 85%);box-shadow:inset 0 1px 0 #69889a40,0 2px 0 #0a1721;color:#d5f5e5;display:grid;place-items:center;padding:0;font:700 calc(var(--mine-size)*.58)/1 'Space Grotesk',sans-serif;font-variant-numeric:tabular-nums;transition:background .12s,border-color .12s,transform .1s;touch-action:manipulation}
.mine-cell:hover:not(.is-open):not(.is-flagged){background:#416d7a;border-color:#95f5c4;transform:translateY(-1px)}
.mine-cell:active:not(.is-open){transform:translateY(1px)}
.mine-cell:focus-visible{outline:2px solid #b4ffd4;outline-offset:0;z-index:2}
.mine-cell.is-open{background:#10232f;border-color:#234052;box-shadow:inset 0 1px 4px #030e1866;animation:mine-cell-in .14s ease-out}
.mine-cell.is-open[data-number="1"]{color:#85caff}
.mine-cell.is-open[data-number="2"]{color:#9af0be}
.mine-cell.is-open[data-number="3"]{color:#ffb98a}
.mine-cell.is-open[data-number="4"]{color:#b9a8ff}
.mine-cell.is-open[data-number="5"]{color:#ffc57b}
.mine-cell.is-open[data-number="6"]{color:#8bebf2}
.mine-cell.is-open[data-number="7"]{color:#edb5d8}
.mine-cell.is-open[data-number="8"]{color:#e9f3f3}
.mine-cell.is-flagged{color:#f9d98e;font-size:calc(var(--mine-size)*.72);background:linear-gradient(145deg,#46503c,#263943)}
.mine-cell.is-correct{background:#245844;color:#baffd4;border-color:#4d9575}
.mine-cell.is-mine{background:#49333a;border-color:#804655;color:#ffc5ab;font-size:calc(var(--mine-size)*.76)}
.mine-cell.is-exploded{background:#db6156;color:#1c1315;border-color:#ffc19c;box-shadow:0 0 24px #fb6c5366}
.mine-cell.is-wrong{color:#fc978f;background:#42313b}
.mine-grid[data-phase="won"] .mine-cell.is-open{border-color:#346655}
.mine-action-row{display:flex;gap:10px;align-items:center;margin-top:15px}
.mine-action{border:1px solid #385162;background:#0c1925;color:#aabfcc;padding:11px 15px;border-radius:10px;min-width:112px;font-size:12px;font-weight:700}
.mine-action span{font-size:17px;vertical-align:middle;margin-right:5px}
.mine-action.is-selected{border-color:#71dbaa;background:#173f39;color:#b7ffdb}
.mine-action-flag.is-selected{border-color:#e3bd6e;background:#524227;color:#ffe0a4}
.mine-action-hint{margin-left:auto;font-size:11px;color:#849fad;text-align:right;max-width:210px}
.mine-result{display:flex;align-items:center;gap:16px;padding:16px 18px;border:1px solid #345261;background:#132735;border-radius:12px;margin-top:16px;min-height:91px}
.mine-result[data-tone="won"]{background:linear-gradient(95deg,#1c473b,#1c3541);border-color:#5eae86}
.mine-result[data-tone="lost"]{background:linear-gradient(95deg,#4c2a32,#1b2a39);border-color:#875362}
.mine-result-symbol{flex:0 0 48px;height:48px;border-radius:11px;display:grid;place-items:center;background:#234b48;color:#b2fcd1;font-size:28px}
.mine-result[data-tone="won"] .mine-result-symbol{background:#397651;color:#e5ffd4}
.mine-result[data-tone="lost"] .mine-result-symbol{background:#8a3e42;color:#ffe6c6}
.mine-result strong{font:600 17px 'Space Grotesk',sans-serif;letter-spacing:-.02em}
.mine-result p{color:#9fb9c3;font-size:12px;line-height:1.6;margin:4px 0 0}
.mine-side{background:#0e1b28;border-left:1px solid #2f4553;padding:24px 19px;display:flex;flex-direction:column;gap:0}
.mine-side-head{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #2d4351;padding:0 0 17px;color:#91daba;font:600 10px 'Space Grotesk',sans-serif;letter-spacing:.15em}
.mine-side-head span+span{color:#618493}
.mine-guide-step{display:flex;gap:10px;border-bottom:1px solid #273c49;padding:19px 0}
.mine-guide-num{flex:none;color:#5b9b89;font:600 12px 'Space Grotesk',sans-serif;padding-top:2px}
.mine-guide-step strong{font-size:13px;color:#e1f3eb}
.mine-guide-step p{color:#88a1ad;font-size:12px;line-height:1.65;margin:7px 0 0}
.mine-shortcuts{padding-top:20px;display:grid;gap:9px}
.mine-shortcuts>span{font-size:10px;letter-spacing:.17em;color:#7c9ba8;font-weight:700;margin-bottom:3px}
.mine-shortcuts>div{display:flex;gap:3px;align-items:center}
.mine-shortcuts kbd{border:1px solid #435767;background:#1e3342;min-width:25px;padding:3px 5px;border-radius:5px;text-align:center;color:#dae9ed;font:600 11px 'Space Grotesk',sans-serif}
.mine-shortcuts small{color:#8ca6b1;font-size:11px;margin-left:auto}
.mine-side-foot{margin-top:auto;padding-top:30px;color:#78939d;font-size:10px;line-height:1.6}
.mine-side-dot{display:inline-block;width:5px;height:5px;background:#93ecc0;border-radius:50%;margin-right:7px}
.mine-other{display:flex;align-items:center;justify-content:space-between;gap:25px;border:1px solid #2e4856;background:#101e2c;border-radius:15px;padding:30px 33px;margin-bottom:90px}
.mine-other h2{font:600 24px 'Space Grotesk',sans-serif;letter-spacing:-.035em;margin:9px 0 6px}
.mine-other p{font-size:13px;color:#90a9b6;margin:0}
.mine-other .btn{flex:none}
@keyframes mine-cell-in{from{transform:scale(.88);opacity:.68}to{transform:scale(1);opacity:1}}
@media(max-width:900px){
 .mine-play-layout{grid-template-columns:minmax(0,1fr)}
 .mine-side{border-left:0;border-top:1px solid #304756;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 19px;padding:18px 24px}
 .mine-side-head,.mine-shortcuts,.mine-side-foot{grid-column:1/-1}
 .mine-guide-step{border-bottom:0}
 .mine-shortcuts{grid-template-columns:repeat(4,max-content);gap:9px 16px;align-items:center}
 .mine-shortcuts>span{grid-column:1/-1}
 .mine-shortcuts small{margin-left:4px}
 .mine-side-foot{padding-top:18px}
 .mine-board-scroll{min-height:385px}
}
@media(max-width:650px){
 .mine-heading{padding:44px 0 25px}
 .mine-heading h1{font-size:clamp(48px,12vw,68px);margin:13px 0}
 .mine-heading p{font-size:14px}
 .mine-heading-mark{display:none}
 .mine-shell{border-radius:14px;margin-inline:-4px}
 .mine-toolbar{padding:15px;gap:12px}
 .mine-brand{width:100%}
 .mine-levels{flex:1;justify-content:space-around}
 .mine-level{min-width:0;flex:1;padding:9px 6px;font-size:11px}
 .mine-reset{padding:11px 9px}
 .mine-reset span{display:none}
 .mine-stats{grid-template-columns:repeat(3,minmax(0,1fr))}
 .mine-stat{padding:13px 5px}
 .mine-stat-label{font-size:8px;letter-spacing:.08em}
 .mine-stat strong{font-size:27px}
 .mine-mini-icon{font-size:15px}
 .mine-stat>div{gap:4px}
 .mine-play-area{padding:14px 11px 18px}
 .mine-board-scroll{min-height:354px}
 .mine-grid{--mine-size:34px;gap:2px;padding:11px}
 .mine-grid[data-level="medium"]{--mine-size:29px}
 .mine-grid[data-level="hard"]{--mine-size:27px}
 .mine-cell{border-radius:5px}
 .mine-action{min-width:0;flex:1;padding:10px 8px}
 .mine-action-hint{display:none}
 .mine-result{padding:14px 11px;gap:10px}
 .mine-result-symbol{flex-basis:38px;height:38px;font-size:22px}
 .mine-result strong{font-size:15px}
 .mine-result p{font-size:11px}
 .mine-side{grid-template-columns:1fr;gap:0;padding:16px}
 .mine-guide-step{border-bottom:1px solid #273c49;padding:13px 0}
 .mine-shortcuts{grid-template-columns:repeat(2,max-content);gap:9px 16px}
 .mine-other{flex-direction:column;align-items:flex-start;padding:22px;margin-bottom:60px}
 .mine-other .btn{width:100%}
}
@media(prefers-reduced-motion:reduce){.mine-cell{transition:none;animation:none!important}}

.mine-dialog{width:calc(100% - 32px);max-width:440px;max-height:calc(100dvh - 32px);box-sizing:border-box;overflow:auto;padding:24px;border:1px solid #527c81;border-radius:16px;background:#132735;color:var(--text);box-shadow:0 24px 80px #0006}
.mine-dialog::backdrop{background:rgba(4,12,20,.65)}
.mine-dialog h2{font:600 23px 'Space Grotesk',sans-serif;margin:0 0 14px;color:#e1f3eb}
.mine-dialog p{font-size:14px;color:#9fb9c3;line-height:1.7}
.mine-dialog-time strong{color:var(--mint);font-variant-numeric:tabular-nums}
.mine-dialog-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.mine-dialog-actions .btn{flex:1;min-height:44px}
.mine-dialog .btn:focus-visible{outline:2px solid var(--mint);outline-offset:3px}
