.save-slots { display:grid; grid-template-columns:repeat(3,minmax(150px,190px)); gap:10px; margin:14px 20px 0; }
.save-slot { min-height:64px; padding:9px 11px; border:2px solid #4b4058; background:#0b0811; color:#d7cce0; text-align:left; cursor:pointer; font:7px/1.65 "Press Start 2P",monospace; }
.save-slot:hover,.save-slot.selected { border-color:#f9f871; color:#fff; }
.save-slot.selected { box-shadow:0 0 0 2px #766b20 inset; }
.save-slot strong { display:block; color:#f9f871; font-size:8px; }
.save-slot span { display:block; color:#9d91a8; }
.save-slot.empty span { color:#665e6d; }
.save-notice { position:absolute; z-index:20; right:22px; top:20px; padding:9px 12px; border:2px solid #f9f871; background:#050508; color:#f9f871; font:7px "Press Start 2P",monospace; opacity:0; transform:translateY(-8px); pointer-events:none; transition:.25s; }
.save-notice.visible { opacity:1; transform:none; }
@media (max-width:720px) { .save-slots { grid-template-columns:1fr; width:min(330px,90vw); gap:5px; } .save-slot { min-height:44px; } }
.unlock-btn { margin-left:8px; padding:9px 11px; border:1px solid #f9f871; background:#15101d; color:#f9f871; font:7px "Press Start 2P",monospace; cursor:pointer; }
.unlock-btn:hover { background:#f9f871; color:#15101d; }
.unlock-panel { z-index:30; }
.unlock-card { width:min(620px,88vw); padding:30px; border:4px solid #fff; background:#050508; color:#fff; font:9px/1.8 "Press Start 2P",monospace; }
.unlock-card h2 { color:#f9f871; font-size:18px; }
.unlock-card .map-route { margin:22px 0; padding:20px; border:2px solid #6d5b8d; color:#cdb9ff; }
.unlock-card ul { text-align:left; }
.pack-columns { display:grid; grid-template-columns:1fr 1fr; gap:22px; margin:20px 0; }
.pack-columns>div { padding:16px; border:2px solid #6d5b8d; background:#100b17; }
.pack-columns h3 { margin-top:0; color:#cdb9ff; font-size:9px; }
.pack-columns .map-route { margin:12px 0; line-height:2.2; }
.pack-columns .map-route b { color:#f9f871; }
.shop-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin:22px 0; }
.shop-grid button { min-height:86px; border:3px solid #c589e8; background:#1b1025; color:#f4ead2; font:8px/1.7 "Press Start 2P",monospace; cursor:pointer; }
.shop-grid button:hover:not(:disabled) { border-color:#f9f871; color:#f9f871; transform:translateY(-2px); }
.shop-grid button:disabled { border-color:#4d4752; color:#625d68; cursor:not-allowed; }
.shop-grid small { color:#f6c95f; font-size:6px; }
.equipment-list { display:grid; gap:10px; margin:18px 0 24px; }
.equip-row { display:grid; grid-template-columns:1fr auto; gap:14px; align-items:center; padding:14px; border:2px solid #6d5b8d; background:#100b17; text-align:left; }
.equip-row b,.equip-row small { display:block; }
.equip-row b { color:#f4ead2; }
.equip-row small { margin-top:5px; color:#aaa0b3; font-size:6px; }
.equip-row button { min-width:110px; padding:10px; border:2px solid #f9f871; background:#21172a; color:#f9f871; font:7px "Press Start 2P",monospace; cursor:pointer; }
.equip-row button:hover { background:#f9f871; color:#15101d; }
.equip-row.locked { border-color:#3e3843; opacity:.55; }
.equip-row>span { color:#77717d; font-size:7px; }
.loaf-card blockquote { margin:20px 0; padding:18px; border:2px solid #d7a64d; background:#21150d; color:#f6d884; }
.loaf-card .primary-btn { margin-right:12px; }
@media (max-width:720px) { .pack-columns { grid-template-columns:1fr; max-height:58vh; overflow:auto; } }
.practice-launch { position:relative; display:grid; gap:8px; width:min(480px,86vw); margin:28px 0 10px; padding:18px 52px; border:4px solid #ead89a; background:linear-gradient(#24152f,#120b1a); color:#fff; box-shadow:0 0 0 3px #604173,0 7px 0 #08040d,0 0 24px #a66ad044; font-family:"Press Start 2P",monospace; cursor:pointer; image-rendering:pixelated; }
.practice-launch::before,.practice-launch::after { content:'✦'; position:absolute; top:50%; color:#f3ce68; font-size:18px; transform:translateY(-50%); text-shadow:2px 2px #563355; }
.practice-launch::before { left:18px; }
.practice-launch::after { right:18px; }
.practice-launch strong { font-size:14px; line-height:1.4; color:#f3ce68; text-shadow:2px 2px #4e263e; }
.practice-launch span { font-size:7px; line-height:1.5; letter-spacing:.08em; }
.practice-launch:hover,.practice-launch:focus-visible { transform:translateY(-3px); background:linear-gradient(#352043,#191022); border-color:#fff1b8; outline:none; box-shadow:0 0 0 3px #89639b,0 10px 0 #08040d,0 0 34px #c58cf077; }
.practice-picker { position:absolute; inset:0; z-index:50; display:grid; place-items:center; padding:20px; background:#020106ed; }
.practice-picker-card { width:min(760px,92vw); max-height:90vh; overflow-y:auto; padding:22px; border:4px solid #e7d49a; background:linear-gradient(135deg,#140c1d,#08060c); box-shadow:0 0 0 5px #563b68,0 0 0 9px #08050d,0 0 40px #000; text-align:center; }
.practice-picker-card h2 { margin:8px 0 22px; color:#f4ead2; font:16px/1.5 "Press Start 2P",monospace; text-shadow:3px 3px #513054; }
.practice-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:9px; }
.practice-grid button { position:relative; min-height:58px; padding:10px 12px 10px 58px; border:3px solid #8b789b; background:linear-gradient(90deg,#24152f,#120c19); color:#f4ead2; box-shadow:inset 0 0 0 2px #120c19,0 4px 0 #050308; font:7px/1.45 "Press Start 2P",monospace; text-align:left; cursor:pointer; }
.practice-grid button::before { position:absolute; left:14px; top:50%; width:34px; color:#f3ce68; font:22px/1 "Press Start 2P",monospace; text-align:center; transform:translateY(-50%); filter:drop-shadow(2px 2px #442641); }
.practice-grid button[data-practice="candlecap"]::before { content:'♠'; color:#e6b75d; }
.practice-grid button[data-practice="bramble"]::before { content:'♣'; color:#88bf78; }
.practice-grid button[data-practice="storybook"]::before { content:'▣'; color:#c58cf0; }
.practice-grid button[data-practice="banditknife"]::before { content:'†'; color:#d4d0db; }
.practice-grid button[data-practice="banditarcher"]::before { content:'➶'; color:#d99b67; }
.practice-grid button[data-practice="cinderimp"]::before { content:'♨'; color:#ff6a2a; }
.practice-grid button[data-practice="magmaslug"]::before { content:'●'; color:#ffb52e; }
.practice-grid button[data-practice="emberbat"]::before { content:'⌁'; color:#ff4b42; }
.practice-grid button[data-practice="demon_guard"]::before { content:'♆'; color:#c24cff; }
.practice-grid button[data-practice="king"]::before { content:'♛'; color:#f3ce68; }
.practice-grid button[data-practice="bronze_baker"]::before { content:'◉'; color:#d7954b; }
.practice-grid button:hover,.practice-grid button:focus-visible { transform:translateY(-2px); border-color:#f3ce68; background:linear-gradient(90deg,#382248,#1b1025); color:#f3ce68; outline:none; box-shadow:inset 0 0 0 2px #281431,0 7px 0 #050308; }
.practice-grid button[data-practice="king"],.practice-grid button[data-practice="bronze_baker"] { border-color:#a97070; background:linear-gradient(90deg,#3c1725,#190b12); color:#f7dfb0; }
.practice-grid button[data-practice="king"]:hover,.practice-grid button[data-practice="bronze_baker"]:hover { background:linear-gradient(90deg,#572237,#241019); border-color:#f3ce68; }
.practice-note { margin:20px 0 14px; color:#aaa0b3; font:7px "Press Start 2P",monospace; }
.practice-back { padding:12px 24px; border:3px solid #8b789b; background:#120c19; color:#d8cadf; box-shadow:0 4px 0 #050308; font:8px "Press Start 2P",monospace; cursor:pointer; }
.practice-back:hover { border-color:#f3ce68; color:#f3ce68; }
@media (max-width:720px) { .practice-launch { margin-top:14px; padding:13px 16px; } .practice-launch strong { font-size:10px; } .practice-picker-card { padding:14px; } .practice-picker-card h2 { font-size:11px; } .practice-grid { gap:8px; } .practice-grid button { min-height:52px; padding:8px 5px; font-size:6px; } }