:root {
  --bg1:#a6e2e8;
  --bg2:#8dd6e4;
  --card:rgba(213,240,247,.92);
  --border:rgba(241,226,232,.95);
  --text:#137ba5;
  --text-soft:#3494bc;
  --progress:#1395c7;
  --blacktab:rgba(0,0,0,.74);
  --tile:rgba(194,233,242,.82);
  --tile-border:rgba(255,255,255,.45);
  --shadow-purple:#7d4dcc;
}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;background:linear-gradient(135deg,var(--bg1),var(--bg2));color:var(--text);font-family:Arial,Helvetica,sans-serif}
button,input{font:inherit}
.hidden{display:none!important}
.app-shell{max-width:760px;min-height:100vh;margin:0 auto;padding:20px 10px 110px}
.topbar{display:flex;justify-content:space-between;align-items:flex-start;padding:12px 12px 18px}
.top-title{font-size:26px;font-weight:800;letter-spacing:.3px}
.top-subtitle,.top-count,.auth-status,.auth-message,.auth-note{color:var(--text-soft);font-weight:700}
.top-right{display:flex;gap:10px;align-items:center}
.auth-toggle,.logout-btn,.auth-form button{border:none;border-radius:999px;background:rgba(255,255,255,.45);color:var(--text);padding:10px 14px;font-weight:700}
.auth-drawer{margin:0 12px 12px;padding:14px;background:rgba(218,242,247,.85);border-radius:20px;border:2px solid rgba(255,255,255,.5)}
.auth-note{margin-top:6px;font-size:13px;line-height:1.35}
.guest-toast{position:fixed;left:50%;bottom:92px;transform:translateX(-50%);width:min(calc(100% - 24px),520px);padding:12px 16px;border-radius:16px;background:rgba(19,123,165,.96);color:#fff;font-size:14px;font-weight:800;line-height:1.35;box-shadow:0 12px 28px rgba(13,86,115,.28);pointer-events:none;z-index:40}
.auth-form{display:grid;grid-template-columns:1fr 1fr auto;gap:8px;margin-top:10px}
.register-form{grid-template-columns:1fr 1fr 1fr auto}
.auth-form input{border-radius:12px;border:1px solid rgba(255,255,255,.5);background:rgba(255,255,255,.8);padding:10px 12px}
#region-view.hidden,#regions-view.hidden{display:none}
.region-card{width:100%;display:grid;grid-template-columns:1fr 1.25fr;gap:10px;margin:12px 0;padding:12px 14px;border-radius:30px;border:8px solid var(--border);background:var(--card);box-shadow:inset 0 0 0 2px rgba(255,255,255,.38);color:inherit;text-align:left}
.region-copy{padding:10px 6px 8px 8px}
.region-name{font-size:33px;font-weight:800;line-height:1;margin-bottom:6px}
.region-status{font-size:17px;font-weight:700}
.region-count{font-size:19px;font-weight:800;margin-top:4px}
.region-progress{width:92%;height:14px;border-radius:999px;background:rgba(255,255,255,.78);margin-top:14px;overflow:hidden}
.region-progress.hidden{visibility:hidden}
.region-progress span{display:block;height:100%;border-radius:999px;background:var(--progress)}
.region-art{position:relative;min-height:145px;border-radius:24px;overflow:hidden}
.banner{position:absolute;inset:0;background: linear-gradient(129deg, transparent 0 22%, rgba(0,201,255,.92) 22% 26%, transparent 26% 30%, rgba(0,201,255,.88) 30% 34%, transparent 34%), radial-gradient(circle at 30% 30%, rgba(255,255,255,.22) 0 2px, transparent 2px 100%), linear-gradient(0deg, rgba(47,214,255,.12), rgba(47,214,255,.12)), linear-gradient(90deg, rgba(0,185,238,.88), rgba(41,204,255,.9));background-size:auto,12px 12px,auto,auto}
.starters{position:absolute;inset:0;display:flex;flex-direction:row-reverse;align-items:flex-end;justify-content:flex-start;gap:6px;padding:8px 8px 0 0}
.starters img{width:31%;max-width:118px;object-fit:contain;filter:drop-shadow(0 3px 4px rgba(255,255,255,.65))}
.region-summary{margin:6px 12px 14px;background:rgba(219,242,247,.86);border-radius:24px;border:2px solid rgba(255,255,255,.45);padding:16px 18px 18px}
.region-toolbar{padding:0 12px 14px}
.regions-toolbar{padding-top:6px}
.region-search{width:100%;border:none;border-radius:999px;background:rgba(255,255,255,.82);color:var(--text);padding:12px 16px;font-weight:700;box-shadow:inset 0 0 0 2px rgba(255,255,255,.45)}
.region-search::placeholder{color:var(--text-soft)}
.global-search-summary{padding:0 12px 12px;color:var(--text-soft);font-weight:700}
.grid-empty{grid-column:1/-1;text-align:center;padding:22px 14px;border-radius:18px;background:rgba(255,255,255,.45);color:var(--text-soft);font-weight:700}
.region-summary-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.region-summary-name{font-size:22px;font-weight:800}
.region-summary-count{min-width:150px;text-align:center;padding:8px 14px;border-radius:999px;background:var(--progress);color:white;font-size:22px;font-weight:800}
.region-summary-actions{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.summary-action{border:none;border-radius:999px;background:rgba(255,255,255,.82);color:var(--text);padding:9px 14px;font-size:12px;font-weight:800;letter-spacing:.2px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.45)}
.summary-action:disabled{opacity:.45;cursor:not-allowed}
.region-summary-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;text-align:center}
.region-summary-stats strong{display:block;font-size:18px}
.region-summary-stats span{font-size:11px;font-weight:800;letter-spacing:.3px}
.pokemon-grid,.forms-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;padding:0 12px}
.pokemon-card,.form-card{position:relative;min-height:166px;border-radius:18px;border:2px solid var(--tile-border);background:var(--tile);color:inherit;padding:10px 6px 12px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start}
.form-card{min-height:180px}
.pokemon-card.unavailable,.form-card.unavailable{opacity:.35}
.pokemon-card.owned,.form-card.owned{box-shadow:inset 0 0 0 2px rgba(255,255,255,.55)}
.pokemon-card.shadow-owned,.form-card.shadow-owned{box-shadow:inset 0 0 0 2px rgba(125,77,204,.7)}
.pokemon-sprite-wrap,.form-sprite-wrap{height:92px;display:flex;align-items:center;justify-content:center}
.pokemon-sprite,.form-sprite{max-width:78px;max-height:78px;object-fit:contain}
.pokemon-dex{font-size:17px;font-weight:700;letter-spacing:.8px;color:#4b9abb}
.pokemon-name,.form-name{text-align:center;font-size:13px;font-weight:700;color:#2a85ab;min-height:32px;display:flex;align-items:center;justify-content:center}
.pokemon-card.show-region{min-height:186px}
.pokemon-region{margin-top:4px;padding:3px 8px;border-radius:999px;background:rgba(255,255,255,.64);font-size:10px;font-weight:800;letter-spacing:.35px;text-transform:uppercase;color:var(--text-soft)}
.pokemon-release{margin-top:4px;min-height:40px;font-size:11px;font-weight:800;line-height:1.2;color:#4b9abb;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:2px}
.pokemon-release-date{display:block}
.pokemon-release-source{display:block;font-size:10px;font-weight:700;color:var(--text-soft)}
.form-state{margin-top:auto;font-size:12px;font-weight:800;color:#2a85ab;text-align:center}
.owned-mark{position:absolute;top:8px;right:8px;width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.8);font-size:15px;font-weight:800}
.forms-pill{position:absolute;left:8px;top:8px;padding:4px 8px;border-radius:999px;background:rgba(255,255,255,.82);font-size:11px;font-weight:800;color:var(--text)}
.bottom-bar{position:fixed;left:50%;bottom:0;transform:translateX(-50%);width:min(760px,100%);display:grid;grid-template-columns:repeat(4,1fr);gap:12px;padding:10px 12px 18px;background:linear-gradient(to top, rgba(0,0,0,.18), rgba(0,0,0,0))}
.mode-btn{border:none;min-height:62px;background:var(--blacktab);color:rgba(255,255,255,.6);font-weight:800;letter-spacing:.6px}
.mode-btn.active{background:#000;color:#fff}
.regions-btn{border-radius:18px;background:rgba(255,255,255,.75);color:var(--text)}
.modal{position:fixed;inset:0;z-index:30}
.modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.35)}
.modal-panel{position:relative;max-width:760px;margin:8vh auto 0;background:rgba(222,245,249,.97);border-radius:28px;border:2px solid rgba(255,255,255,.65);padding:16px 0 18px;max-height:78vh;overflow:auto}
.modal-header{display:flex;justify-content:space-between;align-items:flex-start;padding:0 16px 10px}
.modal-title{font-size:26px;font-weight:800}.modal-subtitle{color:var(--text-soft);font-weight:700}.modal-close{border:none;border-radius:50%;width:40px;height:40px;background:rgba(255,255,255,.75);font-size:28px;line-height:1;color:var(--text)}
.modal-summary{padding:0 16px 14px;color:var(--text-soft);font-weight:700}
@media (max-width:560px){.topbar{padding-inline:8px}.top-title{font-size:23px}.region-card{grid-template-columns:1fr 1.15fr}.region-name{font-size:27px}.region-art{min-height:132px}.region-summary-top{align-items:flex-start;flex-direction:column}.region-summary-count{min-width:0;width:100%}.region-summary-actions{justify-content:stretch;flex-direction:column}.summary-action{width:100%}.pokemon-grid,.forms-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.pokemon-card,.form-card{min-height:148px}.pokemon-sprite-wrap,.form-sprite-wrap{height:80px}.pokemon-sprite,.form-sprite{max-width:68px;max-height:68px}.auth-form,.register-form{grid-template-columns:1fr}.guest-toast{bottom:84px;font-size:13px}.modal-panel{margin-top:4vh;border-radius:22px}}
