:root{--mtc-ink:#17231d;--mtc-muted:#66736c;--mtc-green:#14533f;--mtc-green2:#1d7255;--mtc-cream:#f5f0e5;--mtc-gold:#e2b653;--mtc-card:#fffdf8;--mtc-line:#ded8ca;--mtc-red:#ad3632;--mtc-blue:#2d6194;--mtc-shadow:0 18px 55px rgba(21,52,39,.15)}
*{box-sizing:border-box}.mtc-page{min-height:100vh;background:radial-gradient(circle at 12% 0,#dcede4 0,transparent 28%),var(--mtc-cream);color:var(--mtc-ink);font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif}.mtc-page button,.mtc-page select{font:inherit}.mtc-page a{color:inherit}.mtc-nav{width:min(1180px,calc(100% - 28px));margin:auto;padding:17px 4px;display:flex;align-items:center;justify-content:space-between;gap:20px}.mtc-brand{display:flex;align-items:center;gap:9px;text-decoration:none}.mtc-brand>span{display:grid;place-items:center;width:38px;height:43px;border-radius:7px;background:var(--mtc-card);border:1px solid #cfc7b6;box-shadow:0 4px 0 #b8ae9c;color:var(--mtc-red);font:800 23px Georgia}.mtc-brand b{letter-spacing:.04em}.mtc-brand small{display:block;color:var(--mtc-muted);font-size:9px;font-weight:600;letter-spacing:0}.mtc-nav>div{display:flex;gap:20px}.mtc-nav>div a{text-decoration:none;font-size:13px;font-weight:750;color:#40534a}.mtc-nav>div a:hover{color:var(--mtc-green2)}
.mtc-hero{width:min(1180px,calc(100% - 28px));margin:0 auto 18px;min-height:220px;padding:34px 42px;border-radius:28px;background:linear-gradient(125deg,#0e3c2f,#1d7255);color:#fff;display:flex;align-items:center;justify-content:space-between;gap:24px;overflow:hidden;box-shadow:var(--mtc-shadow)}.mtc-kicker{margin:0 0 8px;color:#edc96f;font-size:11px;font-weight:900;letter-spacing:.14em;text-transform:uppercase}.mtc-hero h1{margin:0 0 12px;font:800 clamp(38px,6vw,68px)/.95 Georgia,serif}.mtc-hero p:last-child{max-width:620px;margin:0;color:#d8ebe3;line-height:1.6}.mtc-hero-tiles{display:flex;align-items:center;padding-right:20px}.mtc-hero-tiles i{display:grid;place-items:center;width:86px;height:112px;margin-left:-18px;border-radius:12px;background:linear-gradient(145deg,#fff,#eee8db);border:1px solid #d3cbbd;box-shadow:0 8px 0 #b7ad98,0 18px 28px rgba(0,0,0,.22);color:var(--mtc-green);font:800 34px Georgia;font-style:normal;transform:rotate(-6deg)}.mtc-hero-tiles i:nth-child(2){color:var(--mtc-red);transform:translateY(-9px) rotate(3deg)}.mtc-hero-tiles i:nth-child(3){color:var(--mtc-blue);transform:rotate(8deg)}
.mtc-page main{width:min(1180px,calc(100% - 28px));margin:auto}.mtc-game{background:var(--mtc-card);border:1px solid var(--mtc-line);border-radius:26px;padding:20px;box-shadow:var(--mtc-shadow)}.mtc-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px}.mtc-level{display:flex;align-items:center;gap:9px}.mtc-level label{font-size:12px;font-weight:850;color:var(--mtc-muted);text-transform:uppercase;letter-spacing:.08em}.mtc-level select{border:1px solid #cfd9d3;border-radius:10px;background:#f4f8f5;color:var(--mtc-ink);padding:9px 11px;font-weight:700}.mtc-actions{display:flex;gap:7px}.mtc-actions button,.mtc-modal button{border:1px solid #cfdbd4;border-radius:10px;background:#edf4ef;color:var(--mtc-green);padding:9px 13px;font-weight:850;cursor:pointer}.mtc-actions button span{display:inline-grid;place-items:center;min-width:18px;height:18px;margin-left:3px;border-radius:99px;background:#fff;font-size:10px}.mtc-actions .primary,.mtc-modal .primary{border-color:var(--mtc-green);background:var(--mtc-green);color:#fff}.mtc-actions button:disabled{opacity:.45;cursor:not-allowed}
.mtc-status{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:16px 0 8px}.mtc-status>div{padding:10px 12px;border-radius:11px;background:#f3f6f4;border:1px solid #e1e8e3}.mtc-status small,.mtc-status strong{display:block}.mtc-status small{font-size:9px;color:var(--mtc-muted);text-transform:uppercase;letter-spacing:.08em}.mtc-status strong{margin-top:2px;font-size:19px}.mtc-time{text-align:right}.mtc-progress{height:6px;border-radius:99px;background:#e4e7e2;overflow:hidden}.mtc-progress span{display:block;width:100%;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--mtc-green2),#e5bd59);transition:width .5s linear,background .2s}.mtc-message{min-height:28px;padding:9px 0 5px;text-align:center;color:var(--mtc-muted);font-size:13px;font-weight:700}.mtc-message.good{color:var(--mtc-green2)}.mtc-message.bad{color:var(--mtc-red)}
.mtc-board-shell{padding:16px;border-radius:20px;background:radial-gradient(circle at 50% 42%,#34795e,#153f32 74%);box-shadow:inset 0 0 0 6px #72422f}.mtc-board-stage{position:relative;width:min(900px,100%);margin:auto;aspect-ratio:1.9;min-height:330px}.mtc-board{position:absolute;inset:4%;filter:drop-shadow(0 16px 18px rgba(0,0,0,.22))}.mtc-tile{position:absolute;width:var(--tile-w);height:var(--tile-h);left:var(--tile-x);top:var(--tile-y);z-index:var(--tile-z);border:1px solid #d3cbbd;border-radius:9px;background:linear-gradient(145deg,#fff,#eee7d9);box-shadow:4px 6px 0 #b8ad98,6px 9px 12px rgba(0,0,0,.28);display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;user-select:none;transition:transform .14s,box-shadow .14s,opacity .2s,filter .14s}.mtc-tile:hover:not(.blocked){transform:translateY(-3px)}.mtc-tile.blocked{cursor:not-allowed;filter:saturate(.72) brightness(.88)}.mtc-tile.blocked::after{content:"";position:absolute;inset:0;border-radius:inherit;background:rgba(20,45,35,.1)}.mtc-tile.selected{transform:translateY(-5px);outline:3px solid #f0c55d;box-shadow:4px 6px 0 #c28c27,0 0 0 7px rgba(240,197,93,.28)}.mtc-tile.clearing{transform:scale(.55) rotate(4deg);opacity:0}.mtc-tile.empty{visibility:hidden;pointer-events:none}.mtc-tile .face{font:800 clamp(13px,2.5vw,27px)/1 Georgia,serif;color:var(--mtc-green)}.mtc-tile.dot .face{color:var(--mtc-blue)}.mtc-tile.crak .face,.mtc-tile.dragon-red .face{color:var(--mtc-red)}.mtc-tile.flower .face{color:#80612d}.mtc-tile small{margin-top:4px;color:#68716c;font-size:clamp(5px,.82vw,8px);font-weight:900;text-transform:uppercase;white-space:nowrap}.mtc-tile.hint{animation:mtcHint .75s ease-in-out 2}.mtc-tile.wrong{animation:mtcShake .3s ease}.mtc-tile.matched{animation:mtcPop .3s ease}
@keyframes mtcHint{50%{transform:translateY(-7px);box-shadow:0 5px 0 #c28c27,0 0 0 8px rgba(240,197,93,.42)}}@keyframes mtcShake{25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}@keyframes mtcPop{50%{transform:scale(1.08)}}
.mtc-how{margin:20px 0;background:#183e31;color:#fff;border-radius:24px;padding:30px}.mtc-how header h2{margin:0;font:800 34px Georgia}.mtc-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:20px}.mtc-steps article{padding:18px;border:1px solid rgba(255,255,255,.15);border-radius:16px;background:rgba(255,255,255,.07)}.mtc-steps article>span{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--mtc-gold);color:#17231d;font-weight:900}.mtc-steps h3{margin:13px 0 6px}.mtc-steps p,.mtc-tip p{margin:0;color:#cfe0d8;line-height:1.55;font-size:13px}.mtc-tip{display:flex;align-items:center;gap:12px;margin-top:14px;padding:13px 16px;border-radius:13px;background:#fff6d9;color:#473d27}.mtc-tip p{color:#5d543b}.mtc-guide{margin:20px 0 40px;padding:30px;background:#fff;border:1px solid var(--mtc-line);border-radius:22px}.mtc-guide h2{margin-top:0;font:800 31px Georgia}.mtc-guide h3{margin-top:24px}.mtc-guide p{color:#56655d;line-height:1.75}.mtc-guide a{color:var(--mtc-green2);font-weight:800}.mtc-footer{display:flex;justify-content:space-between;gap:20px;padding:24px max(18px,calc((100% - 1180px)/2));background:#102d24;color:#c6d7d0;font-size:12px}.mtc-footer a{color:#fff;font-weight:800}
.mtc-modal[hidden]{display:none}.mtc-modal{position:fixed;z-index:99999;inset:0;display:grid;place-items:center;padding:18px;background:rgba(7,28,21,.74)}.mtc-modal-card{width:min(440px,100%);padding:32px;border-radius:24px;background:var(--mtc-card);text-align:center;box-shadow:0 30px 90px rgba(0,0,0,.38)}.mtc-modal-card h2{margin:0 0 14px;font:800 38px Georgia}.mtc-final-score{display:grid;place-items:center;width:130px;height:130px;margin:0 auto 14px;border-radius:50%;background:var(--mtc-green);color:#fff}.mtc-final-score small,.mtc-final-score strong{display:block}.mtc-final-score small{font-size:9px;text-transform:uppercase}.mtc-final-score strong{font-size:34px}.mtc-modal-card p{color:var(--mtc-muted)}.mtc-modal-card button{margin-top:8px;padding:12px 22px}
@media(max-width:760px){.mtc-nav{padding:12px 2px}.mtc-nav>div{gap:10px}.mtc-nav>div a{font-size:10px}.mtc-nav>div a:nth-child(2){display:none}.mtc-hero{min-height:0;padding:24px 20px;border-radius:18px}.mtc-hero h1{font-size:40px}.mtc-hero-tiles{display:none}.mtc-game{padding:11px;border-radius:17px}.mtc-toolbar{align-items:stretch;flex-direction:column}.mtc-level{justify-content:space-between}.mtc-level select{flex:1}.mtc-actions{display:grid;grid-template-columns:1.4fr 1fr 1fr 44px}.mtc-actions button{padding:8px 5px;font-size:11px}.mtc-status{margin-top:11px}.mtc-status>div{padding:8px}.mtc-status strong{font-size:16px}.mtc-board-shell{padding:7px;border-radius:14px;box-shadow:inset 0 0 0 4px #72422f;overflow:hidden}.mtc-board-stage{width:100%;max-width:none;min-height:220px;aspect-ratio:1.45}.mtc-tile{border-radius:6px;box-shadow:3px 4px 0 #b8ad98,4px 6px 8px rgba(0,0,0,.24)}.mtc-tile small{margin-top:2px}.mtc-how{padding:22px 16px;border-radius:18px}.mtc-how header h2{font-size:28px}.mtc-steps{grid-template-columns:1fr}.mtc-tip{align-items:flex-start}.mtc-guide{padding:22px 18px}.mtc-guide h2{font-size:27px}.mtc-footer{flex-direction:column}.mtc-modal-card{padding:26px 20px}}
@media(max-width:430px){.mtc-page main,.mtc-hero,.mtc-nav{width:min(100% - 12px,1180px)}.mtc-brand small{display:none}.mtc-nav>div a:nth-child(1){display:none}.mtc-hero{margin-bottom:8px}.mtc-hero h1{font-size:36px}.mtc-hero p:last-child{font-size:13px}.mtc-status{grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}.mtc-status small{font-size:7px}.mtc-status strong{font-size:14px}.mtc-message{font-size:11px}.mtc-tile .face{font-size:clamp(14px,5vw,22px)}.mtc-tile small{font-size:5px}}
@media(prefers-reduced-motion:reduce){.mtc-tile,.mtc-progress span{transition:none}.mtc-tile.hint,.mtc-tile.wrong,.mtc-tile.matched{animation:none}}
