:root{--ink:#f5f0de;--muted:#a8b7ac;--jade:#55d6aa;--jade2:#1f9f7e;--gold:#edc878;--danger:#e87870;--bg:#041212;--panel:rgba(13,38,36,.78);--line:rgba(173,231,208,.14);--shadow:0 24px 70px rgba(0,0,0,.42);--radius:22px}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}body{overflow-x:hidden;background:radial-gradient(circle at 50% -20%,#1b5a4e 0,transparent 43%),linear-gradient(160deg,#071d1c,#030b0d 72%)}button,input{font:inherit}.ambient{position:fixed;inset:0;overflow:hidden;pointer-events:none;opacity:.48}.ambient:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(70,174,144,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(70,174,144,.035) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(to bottom,black,transparent 85%)}.ambient i{position:absolute;border:1px solid rgba(102,212,177,.14);border-radius:50%;width:34vw;aspect-ratio:1;filter:blur(.2px);animation:drift 15s ease-in-out infinite}.ambient i:nth-child(1){left:-15vw;top:10vh}.ambient i:nth-child(2){right:-18vw;top:35vh;animation-delay:-5s}.ambient i:nth-child(3){width:20vw;left:42vw;bottom:-12vw;animation-delay:-9s}@keyframes drift{50%{transform:translateY(-22px) rotate(8deg)}}.app{position:relative;min-height:100vh;max-width:1500px;margin:auto;padding:24px clamp(18px,4vw,62px) 32px}.topbar{height:62px;display:flex;align-items:center;justify-content:space-between}.brand{border:0;background:none;color:var(--ink);display:flex;align-items:center;gap:12px;cursor:pointer;text-align:left;padding:0}.brand-mark{display:grid;place-items:center;width:43px;height:43px;border:1px solid rgba(96,220,180,.35);border-radius:12px;background:linear-gradient(145deg,rgba(79,210,169,.19),rgba(6,29,27,.65));color:var(--jade);font-family:Georgia,serif;font-size:24px;box-shadow:inset 0 1px rgba(255,255,255,.08)}.brand strong,.brand small{display:block;letter-spacing:.16em}.brand strong{font:700 14px/1.2 Georgia,serif}.brand small{font-size:8px;color:var(--muted);margin-top:3px}.top-actions{display:flex;gap:8px}.icon-button,.back-button{width:42px;height:42px;border:1px solid var(--line);border-radius:13px;background:rgba(7,28,27,.72);color:var(--muted);cursor:pointer;transition:.2s}.icon-button:hover,.back-button:hover{color:var(--jade);border-color:rgba(85,214,170,.42);transform:translateY(-1px)}.screen{display:none}.screen.active{display:grid}.panel{border:1px solid var(--line);background:linear-gradient(145deg,rgba(18,53,49,.74),rgba(6,23,23,.82));box-shadow:var(--shadow);backdrop-filter:blur(15px)}#menuScreen{min-height:calc(100vh - 90px);grid-template-columns:minmax(0,1.4fr) minmax(270px,.6fr);grid-template-rows:1fr auto;gap:22px;align-items:center;padding:34px 0 0}.hero-panel{padding:clamp(30px,6vw,78px);border-radius:32px;position:relative;overflow:hidden}.hero-panel:after{content:"玉";position:absolute;right:-2%;bottom:-19%;font:clamp(220px,33vw,480px)/1 Georgia,serif;color:rgba(88,205,169,.035);transform:rotate(-8deg)}.eyebrow{color:var(--jade);letter-spacing:.2em;text-transform:uppercase;font-size:11px;font-weight:800}.hero-panel h1{font:500 clamp(42px,6vw,88px)/.96 Georgia,serif;letter-spacing:-.045em;margin:20px 0 25px;max-width:820px}.hero-panel h1 em{color:var(--gold);font-weight:400}.hero-panel>p{color:var(--muted);font-size:clamp(15px,1.5vw,19px);line-height:1.7;max-width:650px}.menu-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:38px;position:relative;z-index:1}.primary-button,.secondary-button,.daily-button{border:0;border-radius:14px;cursor:pointer;transition:.2s}.primary-button{background:linear-gradient(135deg,var(--jade),#31ae89);color:#04201b;padding:15px 22px;font-weight:850;box-shadow:0 8px 25px rgba(54,197,154,.18)}.primary-button:hover{filter:brightness(1.08);transform:translateY(-2px)}.primary-button span,.primary-button small{display:block}.primary-button small{font-size:10px;margin-top:3px;opacity:.7}.secondary-button{border:1px solid var(--line);background:rgba(4,17,17,.6);color:var(--ink);padding:15px 22px}.daily-button{flex-basis:100%;max-width:430px;padding:14px 16px;display:flex;align-items:center;gap:12px;text-align:left;border:1px solid rgba(237,200,120,.22);background:rgba(65,52,21,.23);color:var(--ink)}.daily-button .daily-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:11px;background:rgba(237,200,120,.15);color:var(--gold)}.daily-button strong,.daily-button small{display:block}.daily-button small{font-size:10px;color:var(--muted);margin-top:3px}.daily-button b{margin-left:auto;color:var(--gold)}.menu-side{display:grid;gap:15px}.stat-card,.relic-card,.leader-card{border-radius:var(--radius);padding:24px}.stat-card span,.relic-card>span,.leader-card span{text-transform:uppercase;letter-spacing:.14em;font-size:9px;color:var(--muted)}.stat-card strong{display:block;font:44px/1 Georgia,serif;color:var(--gold);margin:12px 0 6px}.stat-card small,.leader-card small{color:var(--muted)}.relic-card{position:relative}.relic-card strong{display:block;font:30px Georgia,serif;margin:10px 0 16px}.relic-card strong b{color:var(--jade)}.relic-glow{position:absolute;right:24px;top:22px;width:50px;height:50px;display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle,rgba(237,200,120,.25),transparent 65%);color:var(--gold);font-size:25px}.relic-track{display:grid;grid-template-columns:repeat(12,1fr);gap:4px}.relic-track i{height:5px;border-radius:3px;background:rgba(255,255,255,.08)}.relic-track i.found{background:var(--gold);box-shadow:0 0 8px rgba(237,200,120,.5)}.leader-card{display:block;text-align:left;color:var(--ink);cursor:pointer;width:100%}.leader-card strong,.leader-card small{display:block}.leader-card strong{font:22px Georgia,serif;margin:8px 0}.menu-footer{grid-column:1/-1;color:#6f837b;text-align:center;font-size:10px;letter-spacing:.08em;padding:8px}.game-hud{margin-top:22px;border-radius:18px;display:grid;grid-template-columns:auto 1fr repeat(3,minmax(80px,auto));align-items:center;padding:13px 18px;gap:18px}.back-button{font-size:28px}.level-copy span,.hud-stat span{display:block;color:var(--jade);font-size:8px;font-weight:800;letter-spacing:.15em;text-transform:uppercase}.level-copy strong{font:19px Georgia,serif}.hud-stat{padding-left:20px;border-left:1px solid var(--line);text-align:right}.hud-stat strong{font:22px Georgia,serif;color:var(--ink)}.combo-stat strong{color:var(--gold)}.mission-row{display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-size:11px;padding:14px 5px 6px}.mission-row>div:first-child{display:flex;align-items:center;gap:10px}.progress{width:120px;height:4px;background:rgba(255,255,255,.08);border-radius:4px;overflow:hidden}.progress i{display:block;width:0;height:100%;background:var(--jade);transition:width .3s}.objective{letter-spacing:.08em;text-transform:uppercase}.board-wrap{position:relative;min-height:clamp(390px,62vh,680px);display:grid;place-items:center;padding:12px}.board{position:relative;width:min(100%,1050px);height:clamp(370px,58vh,630px);perspective:1200px;user-select:none}.tile{--tw:74px;--th:92px;position:absolute;width:var(--tw);height:var(--th);transform:translate(calc(var(--x) * (var(--tw) * .61) + var(--z) * 5px),calc(var(--y) * (var(--th) * .55) - var(--z) * 6px));border:0;background:transparent;padding:0;cursor:pointer;transition:transform .17s ease,filter .17s,opacity .25s}.tile-face{position:absolute;inset:0;border:1px solid #d6d4bd;border-radius:10px;background:linear-gradient(145deg,#fffdf0,#d9d7bf);box-shadow:2px 5px 0 #6d7865,5px 9px 13px rgba(0,0,0,.4),inset 0 1px white;display:grid;place-items:center;color:#193c35;overflow:hidden}.tile-face:before{content:"";position:absolute;inset:6px;border:1px solid rgba(20,70,58,.13);border-radius:6px}.tile-symbol{position:relative;font:700 30px Georgia,"Times New Roman",serif;text-shadow:0 1px white}.tile-index{position:absolute;left:9px;top:8px;font:700 10px Georgia,serif;color:#628176}.tile[data-group="dragon"] .tile-symbol{color:#b53e38}.tile[data-group="bamboo"] .tile-symbol{color:#258763}.tile[data-group="dot"] .tile-symbol{color:#2c657a}.tile[data-group="flower"] .tile-symbol,.tile[data-group="season"] .tile-symbol{color:#a16e1f}.tile.blocked{cursor:not-allowed;filter:brightness(.52) saturate(.65)}.tile.free:hover{z-index:99!important;transform:translate(calc(var(--x) * (var(--tw) * .61) + var(--z) * 5px),calc(var(--y) * (var(--th) * .55) - var(--z) * 6px - 5px))}.tile.selected .tile-face{outline:3px solid var(--gold);box-shadow:0 0 24px rgba(237,200,120,.6),2px 5px 0 #6d7865}.tile.hint .tile-face{animation:hint 1s ease 2}@keyframes hint{50%{box-shadow:0 0 32px rgba(85,214,170,.9),2px 5px 0 #6d7865;outline:3px solid var(--jade)}}.tile.removing{pointer-events:none;opacity:0;transform:translate(calc(var(--x) * (var(--tw) * .61) + var(--z) * 5px),calc(var(--y) * (var(--th) * .55) - var(--z) * 6px - 28px)) scale(.8) rotate(3deg)}.toast{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.85);padding:10px 18px;border-radius:30px;background:rgba(4,20,18,.9);border:1px solid var(--line);color:var(--gold);font:700 20px Georgia,serif;opacity:0;pointer-events:none;transition:.25s;z-index:200}.toast.show{opacity:1;transform:translate(-50%,-50%) scale(1)}.power-dock{margin:0 auto;border-radius:18px;width:min(540px,100%);display:grid;grid-template-columns:repeat(4,1fr);padding:8px}.power{position:relative;border:0;border-right:1px solid var(--line);background:none;color:var(--muted);padding:7px;cursor:pointer}.power:last-child{border-right:0}.power span,.power strong{display:block}.power span{font-size:21px;color:var(--jade)}.power strong{font-size:9px;text-transform:uppercase;letter-spacing:.08em;margin-top:2px}.power small{position:absolute;right:9px;top:5px;background:#193e36;color:var(--jade);width:18px;height:18px;display:grid;place-items:center;border-radius:50%;font-weight:800}.power:disabled{opacity:.3;cursor:not-allowed}.modal{width:min(720px,calc(100% - 28px));border:1px solid var(--line);border-radius:26px;background:linear-gradient(150deg,#153d38,#071a1a 70%);color:var(--ink);box-shadow:0 40px 100px #000;padding:clamp(25px,5vw,50px);text-align:center}.modal::backdrop{background:rgba(0,8,8,.78);backdrop-filter:blur(5px)}.modal-close{position:absolute;right:15px;top:13px;border:0;background:none;color:var(--muted);font-size:28px;cursor:pointer}.modal-symbol{font:35px Georgia,serif;color:var(--jade)}.modal h2{font:40px Georgia,serif;margin:8px 0 30px}.modal-action{margin-top:26px;min-width:180px}.help-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;text-align:left}.help-grid article{border:1px solid var(--line);border-radius:15px;padding:18px;background:rgba(2,15,14,.28)}.help-grid article b{color:var(--jade)}.help-grid h3{font:18px Georgia,serif;margin:10px 0 7px}.help-grid p,.tip{color:var(--muted);font-size:12px;line-height:1.55}.tip{margin-top:18px}.compact{max-width:500px}.setting-row{display:flex;justify-content:space-between;align-items:center;text-align:left;padding:15px 0;border-bottom:1px solid var(--line)}.setting-row small{display:block;color:var(--muted);margin-top:3px}.setting-row input{width:44px;height:24px;accent-color:var(--jade)}.text-button{border:0;background:none;color:var(--muted);cursor:pointer;padding:12px}.danger{color:var(--danger);margin-top:22px}.leader-list{list-style:none;padding:0;margin:0;text-align:left}.leader-list li{display:grid;grid-template-columns:35px 1fr auto;gap:12px;padding:12px;border-bottom:1px solid var(--line);align-items:center}.leader-list li b{color:var(--gold);font:20px Georgia,serif}.leader-list li span{color:var(--muted)}.leader-empty{text-align:center!important;display:block!important;color:var(--muted);padding:30px!important}.result-modal{max-width:560px}.result-burst{font-size:56px;color:var(--gold);filter:drop-shadow(0 0 15px rgba(237,200,120,.5))}.result-score span,.result-score strong{display:block}.result-score span{color:var(--muted);text-transform:uppercase;font-size:9px;letter-spacing:.16em}.result-score strong{font:56px Georgia,serif;color:var(--gold)}.result-breakdown{display:flex;justify-content:center;gap:20px;margin:20px 0}.result-breakdown span{font-size:11px;color:var(--muted)}.result-breakdown b{display:block;color:var(--jade);font-size:16px}.name-entry{display:block;max-width:260px;margin:auto;text-align:left}.name-entry span{font-size:9px;text-transform:uppercase;color:var(--muted);letter-spacing:.12em}.name-entry input{width:100%;margin-top:6px;padding:11px 13px;border-radius:10px;border:1px solid var(--line);background:rgba(0,0,0,.25);color:var(--ink);outline:none}.high-contrast .tile-face{border:3px solid #fff;background:#fffde8;color:#002f27}.reduced-motion *,.reduced-motion *:before,.reduced-motion *:after{animation-duration:.01ms!important;transition-duration:.01ms!important}
@media(max-width:850px){#menuScreen{grid-template-columns:1fr;align-items:start}.hero-panel{margin-top:24px}.menu-side{grid-template-columns:1fr 1fr}.leader-card{grid-column:1/-1}.game-hud{grid-template-columns:auto 1fr repeat(2,auto);gap:10px}.combo-stat{display:none}.tile{--tw:62px;--th:78px}.board{transform-origin:top left}.help-grid{grid-template-columns:1fr}.modal{max-height:90vh;overflow:auto}}
@media(max-width:540px){.app{padding:12px 10px 20px}.topbar{height:52px}.brand-mark{width:38px;height:38px}.brand strong{font-size:12px}.top-actions{gap:4px}.icon-button{width:37px;height:37px}.hero-panel{padding:28px 22px}.hero-panel h1{font-size:43px}.hero-panel>p{font-size:14px}.menu-actions>*{width:100%;max-width:none}.menu-side{grid-template-columns:1fr 1fr;gap:9px}.stat-card,.relic-card,.leader-card{padding:17px}.stat-card strong{font-size:34px}.relic-card strong{font-size:24px}.game-hud{margin-top:10px;padding:9px;grid-template-columns:auto 1fr auto}.game-hud .hud-stat:nth-of-type(2){display:none}.level-copy strong{font-size:15px}.hud-stat{padding-left:10px}.hud-stat strong{font-size:18px}.mission-row{padding:12px 3px}.objective{display:none}.board-wrap{min-height:455px;padding:0;overflow:hidden}.board{height:455px;width:100%}.tile{--tw:52px;--th:66px}.tile-symbol{font-size:23px}.tile-index{font-size:8px;left:7px;top:6px}.tile-face{border-radius:7px;box-shadow:2px 4px 0 #6d7865,3px 7px 9px rgba(0,0,0,.4)}.power-dock{position:sticky;bottom:5px}.result-breakdown{gap:10px}.result-score strong{font-size:47px}}
@media(max-height:690px) and (min-width:700px){.board-wrap{min-height:420px}.board{height:400px}.tile{--tw:60px;--th:75px}.game-hud{margin-top:8px}.mission-row{padding-top:8px}.power-dock{margin-top:-12px}}