/* Quiet geometric ornament, warm metal and clear typography. */
#modal:has(.pause-menu),#modal:has(.new-game){box-sizing:border-box;width:min(720px,94vw);max-width:94vw;padding:32px;background:linear-gradient(140deg,#222b2c,#101819);border:1px solid #b59861;border-radius:18px;box-shadow:0 24px 90px #000a;color:#f4ead7}
#modal:has(.pause-menu)::before,#modal:has(.pause-menu)::after,#modal:has(.new-game)::before,#modal:has(.new-game)::after{display:none}
#modal::backdrop{background:#061011b8;backdrop-filter:blur(6px)}
#modal .menu-eyebrow{display:block;font:600 11px/1.4 system-ui;letter-spacing:.24em;color:#c4a875;margin-bottom:12px}
#modal .pause-menu h2,#modal .new-game h2{font:600 30px/1.2 system-ui;color:#f6eddc;border:0;margin-bottom:24px;padding:0}
#modal .pause-menu .menu-list{display:grid;grid-template-columns:1fr 1fr;gap:12px}
#modal .pause-menu button,#modal .new-game button{background:#253234;color:#f5ecdc;border:1px solid #586365;border-radius:9px;box-shadow:none;padding:15px 18px;font:600 15px/1.3 system-ui}
#modal .pause-menu #menu-continue{grid-column:1/-1;background:#d1af71;color:#162123;border-color:#e8c88e;padding:20px}
#modal .pause-menu #menu-new{grid-column:1/-1}
#modal .pause-menu button:hover,#modal .new-game button:hover{background:#36474a;border-color:#d1af71}
#modal .pause-menu #menu-continue:hover,#modal .new-game #draft:hover{background:#e4c48b;color:#162123}
#modal .team-fields{display:grid;grid-template-columns:1fr 1fr;gap:20px}
#modal .team-fields input{display:block;box-sizing:border-box;width:100%;margin-top:7px;padding:10px;background:#111b1e;border-color:#596562;color:#fff3dc}
#modal .map-picker{display:grid;grid-template-columns:1fr 1fr;gap:14px;border:0;padding:0;margin:22px 0}
#modal .map-picker legend{color:#ead7b3;font:600 16px system-ui;margin-bottom:12px}
#modal .map-picker button{padding:0;overflow:hidden;text-align:left;border:2px solid transparent;background:#182426}
#modal .map-picker img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}
#modal .map-picker span{display:block;padding:12px 14px}
#modal .map-picker button[aria-pressed="true"]{border-color:#e1bb72;box-shadow:0 0 0 2px #e1bb7225;color:#ffdda0}
#modal .new-game-actions{display:flex;gap:12px}
#modal .new-game #draft{background:#d1af71;color:#162123;border-color:#e8c88e}
body main header #menu{display:flex;align-items:center;justify-content:center;gap:12px;width:auto!important;min-width:118px;height:48px!important;padding:0 20px!important;background:#162225ed!important;border:1px solid #b89b64!important;border-radius:9px!important;color:#f4e8d1!important;font:600 17px system-ui!important;box-shadow:0 4px 18px #0005!important;clip-path:none!important}
body main header #menu span{color:#d1af71;font-size:20px}
@media(max-height:720px){#modal:has(.new-game),#modal:has(.pause-menu){padding:20px}#modal .map-picker img{max-height:120px}#modal .new-game h2{margin-bottom:14px}#modal .map-picker{margin:12px 0}}

#modal .stone-setting{display:flex;align-items:center;justify-content:center;gap:18px}#modal #stone-count{padding:6px 16px}#modal .stone-hint{font-size:12px;margin:8px 0;color:#b6c0bd}
#modal:has(.fusion-scene){width:min(760px,94vw);box-sizing:border-box;padding:24px;background:radial-gradient(ellipse at 50% 48%,#404936,#141e20 68%);border:1px solid #c8a966;border-radius:18px;text-align:center;overflow:hidden}
#modal:has(.fusion-scene)::before,#modal:has(.fusion-scene)::after{display:none}
#modal .fusion-destiny{font:500 clamp(18px,3vw,28px)/1.3 Georgia,serif;color:#f8dfaa;margin:0 0 12px}
.fusion-stage{position:relative;height:min(45vh,350px);isolation:isolate;perspective:900px}
.fusion-source,.fusion-result{position:absolute;left:50%;top:50%;width:min(21vh,162px);aspect-ratio:2/3;transform:translate(-50%,-50%)}
.fusion-stage .card{width:100%!important;height:100%!important;transform:none!important;margin:0!important}
.fusion-source{--side:-1;animation:fusion-join 2.4s ease-in-out both;z-index:2}
.fusion-source.source-1{--side:1}
.fusion-result{z-index:4;animation:fusion-reveal 1.1s 2s cubic-bezier(.18,.8,.25,1) both;filter:drop-shadow(0 0 18px #e2bc6666)}
.fusion-ring{position:absolute;left:50%;top:50%;width:min(38vh,300px);aspect-ratio:1;border:2px solid #d7b46d;border-radius:50%;animation:fusion-orbit 3s ease-in-out both;box-shadow:0 0 28px #e8be5744,inset 0 0 28px #e8be5722}
.fusion-ring.second{width:min(32vh,250px);border-style:dashed;animation-direction:reverse;opacity:.5}
.fusion-glow{position:absolute;inset:0;z-index:3;background:radial-gradient(circle,#fff1bd,transparent 55%);opacity:0;animation:fusion-bloom 1.1s 1.7s ease-out both;pointer-events:none}
.fusion-spark{position:absolute;left:50%;top:50%;width:5px;height:5px;background:#f7d180;box-shadow:0 0 10px #ffe7a6;border-radius:50%;animation:fusion-spark 1.6s 2s ease-out both;z-index:5;pointer-events:none}
#modal .fusion-caption{animation:fusion-caption .7s 2.5s both}
#modal .fusion-caption h2{border:0;padding:0;margin:8px 0;color:#f4d899}
#modal .fusion-caption p{margin:6px 0 14px}
#modal #fusion-continue{background:#cfad6b;color:#152124;border-color:#e7cd94}
@keyframes fusion-join{0%,25%{opacity:1;transform:translate(calc(-50% + var(--side)*140px),-50%) rotate(calc(var(--side)*-9deg))}70%{opacity:1;filter:brightness(1.3)}100%{opacity:0;transform:translate(-50%,-50%) scale(.35);filter:brightness(2)}}
@keyframes fusion-reveal{from{opacity:0;transform:translate(-50%,-50%) scale(.45) rotateY(75deg)}to{opacity:1;transform:translate(-50%,-50%) scale(1) rotateY(0)}}
@keyframes fusion-orbit{0%{opacity:0;transform:translate(-50%,-50%) rotate(0) scale(.5)}35%{opacity:.8}100%{opacity:.25;transform:translate(-50%,-50%) rotate(180deg) scale(1)}}
@keyframes fusion-bloom{0%,100%{opacity:0}35%{opacity:.85}}
@keyframes fusion-spark{from{opacity:0;transform:rotate(var(--angle)) translateX(10px)}20%{opacity:1}to{opacity:0;transform:rotate(var(--angle)) translateX(var(--travel))}}
@keyframes fusion-caption{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.fusion-scene *{animation:none!important}.fusion-source,.fusion-glow,.fusion-ring,.fusion-spark{display:none}.fusion-result,.fusion-caption{opacity:1}}

#modal .catalog-return{position:sticky;top:0;z-index:20;display:block;margin:0 0 16px;background:#203234;color:#f2d79d;border-color:#bca16a;box-shadow:0 3px 12px #0008}#modal .catalog-return::before{content:'← ';}

#modal .map-picker{grid-template-columns:repeat(3,1fr)}

#modal .map-picker{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:600px){#modal .map-picker{grid-template-columns:repeat(2,minmax(0,1fr))}}
