/* 5.0.1 — world backdrop, readable achievement cabinet and illustrated realms. */
html{background:#1d2b49}
body{background:#1d2b49;isolation:isolate}
body::before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;background:linear-gradient(180deg,#1a27472e,#16234166),url('/rpg/starlight-world.webp') center center/cover no-repeat}
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 0% 80%,#88afcc30,transparent 40%),radial-gradient(ellipse at 100% 12%,#b998df24,transparent 35%)}
.login-shell::before{display:none}
.login-hero{padding:28px;border-radius:28px;background:#fdfaf0ed;border:1px solid #eee2bf;box-shadow:0 20px 70px #101c3b33}
#appView{min-height:100dvh}
.dashboard{position:relative}
.topbar{background:#fffdf5f5;border-bottom:1px solid #c8c0d7;box-shadow:0 5px 28px #18234024}
.sky-deco span{color:#ffe6ae;opacity:.45;z-index:-1}
/* This container must not inherit the old square-cell/absolute-caption layout. */
.badge-card{padding:24px;overflow:visible;background:linear-gradient(150deg,#fffdf5,#f4effa);border:1px solid #dcd0e8;box-shadow:0 10px 30px #1b274322}
.badge-card .section-heading{margin-bottom:18px}
.badge-card #badges{display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,1fr));gap:14px 12px;margin-top:0;align-items:stretch;min-width:0}
.badge-card #badges>.badge{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:10px;aspect-ratio:auto;min-width:0;height:auto;min-height:156px;padding:14px 8px 13px;border:1px solid #dfdae8;border-radius:19px;background:#efedf4;opacity:1;filter:none;box-shadow:0 3px 0 #dfd9e8;overflow:visible}
.badge-card #badges>.badge.unlocked{background:linear-gradient(150deg,#fff9df,#f9efd3);border-color:#dfc080;box-shadow:0 3px 0 #ddc38e,0 7px 18px #b8965518}
.badge-card #badges>.badge>.achievement-emblem{position:static;display:block;flex:0 0 auto;width:72px;height:78px;margin:0;line-height:0;filter:grayscale(1);opacity:.48}
.badge-card #badges>.badge.unlocked>.achievement-emblem{filter:none;opacity:1}
.achievement-emblem img{display:block;width:100%;height:100%;object-fit:contain}
.badge-card #badges>.badge>small{position:static;inset:auto;display:block;width:100%;margin:0;font-size:13px;font-weight:700;line-height:1.4;color:#6c6b7e;text-align:center;white-space:normal;overflow-wrap:normal;word-break:normal;hyphens:none}
.badge-card #badges>.badge.unlocked>small{color:#71572e}
.badge-card #badges>.badge.unlocked:hover{transform:translateY(-2px);box-shadow:0 5px 0 #ddc38e,0 9px 24px #b8965525}
.adventure-achievements .achievement-grid article>.achievement-emblem{width:86px;height:94px;display:block;margin:0 auto;filter:grayscale(1);opacity:.48}
.adventure-achievements .achievement-grid article.earned>.achievement-emblem{filter:none;opacity:1}
/* Content-driven realm rows: dedicated icon column, flexible labels, no clipping. */
.synonym-realm{grid-template-columns:64px minmax(0,1fr) 15px;gap:13px;padding:12px;border-radius:19px;border:1px solid #e4ddec;background:#fffdf8;box-shadow:0 3px 0 #e5deee;color:#55556f;min-height:92px;align-items:center}
.synonym-realm>span{display:block;width:64px;height:64px;padding:0;background:transparent;border:0;box-shadow:none;border-radius:0;font-size:0;line-height:0}
.synonym-realm>span img{display:block;width:64px;height:64px;object-fit:contain;filter:drop-shadow(0 4px 3px #5743711c)}
.synonym-realm>div{min-width:0}
.synonym-realm b{font-size:16px;line-height:1.3;white-space:normal;overflow-wrap:normal;word-break:normal;color:inherit}
.synonym-realm small{font-size:12px;line-height:1.45;margin-top:5px;opacity:1;color:#77738b;font-weight:600;white-space:normal}
.synonym-realm i{font-size:23px;color:#9e8dbc}
.synonym-realm:hover{transform:translateY(-2px);border-color:#bba5d4;background:#faf6ff;box-shadow:0 5px 0 #d4c7e4}
.synonym-realm.active{background:linear-gradient(115deg,#6552ad,#8970cc);border-color:#ad91de;color:#fff;box-shadow:0 4px 0 #4f3c86,0 10px 22px #5d42982b}
.synonym-realm.active>span{background:transparent;box-shadow:none}
.synonym-realm.active small{color:#f0e8ff}
.synonym-realm.active i{color:#f0dbab}
.synonym-realm-list{gap:12px;padding:6px 2px 10px}
.synonym-realm.all{margin-bottom:12px}
@media(min-width:1600px){body::before{background-position:center 48%}.dashboard{padding-top:34px}}
@media(max-width:900px){.synonym-realm{grid-template-columns:58px minmax(0,1fr) 14px;gap:10px}.synonym-realm>span,.synonym-realm>span img{width:58px;height:58px}.badge-card #badges{grid-template-columns:repeat(auto-fit,minmax(105px,1fr))}}
@media(max-width:640px){body::before{background-image:linear-gradient(180deg,#1a274733,#16234177),url('/rpg/starlight-world-small.webp');background-position:64% center}.login-hero{padding:23px 20px}.badge-card{padding:22px 18px}.badge-card #badges{grid-template-columns:repeat(auto-fit,minmax(96px,1fr));gap:14px 11px}.badge-card #badges>.badge{min-height:156px;padding:14px 7px}.badge-card #badges>.badge>small{font-size:13px}.synonym-realm{grid-template-columns:58px minmax(0,1fr) 13px;gap:11px;padding:11px;min-height:90px}.synonym-realm b{font-size:16px}.synonym-realm small{font-size:12px}}
@media(prefers-reduced-motion:reduce){.badge-card #badges>.badge.unlocked:hover,.synonym-realm:hover{transform:none}}