:root{--bg1:#1e1238;--bg2:#0a0d1c;--panel:rgba(7,6,15,.72);--line:rgba(255,255,255,.08);--text:#f0ecfa;--muted:#aaa5be;--gold:#f1c40f;--gold2:#e0b23a;--red:#e74c3c;--blue:#3498db;--green:#2ecc71;--violet:#9b59b6}
*{box-sizing:border-box}html{color-scheme:dark}body{margin:0;font:15px/1.5 "DejaVu Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--text);background:linear-gradient(180deg,var(--bg1),var(--bg2)) fixed;min-height:100vh}
a{color:var(--gold);text-decoration:none}a:hover{text-decoration:underline}
.wrap{max-width:1080px;margin:0 auto;padding:20px 16px 60px}
header.top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0 22px;border-bottom:1px solid var(--line);margin-bottom:22px}
.brand{font-weight:700;font-size:20px;letter-spacing:.5px}.brand span{color:var(--gold)}
nav a{margin-left:16px;color:var(--text);opacity:.85}nav a.active,nav a:hover{color:var(--gold);opacity:1;text-decoration:none}
.btn{display:inline-block;padding:10px 18px;border-radius:10px;background:var(--gold);color:#1a1224;font-weight:700;text-decoration:none!important;border:0;cursor:pointer}
.btn.discord{background:#5865F2;color:#fff}.btn.ghost{background:transparent;border:1px solid var(--line);color:var(--text)}
.hero{text-align:center;padding:60px 10px 40px}.hero h1{font-size:44px;margin:0 0 10px}.hero h1 span{color:var(--gold)}.hero p{color:var(--muted);max-width:640px;margin:0 auto 26px;font-size:17px}
.grid{display:grid;gap:16px}.grid.c2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}.grid.c3{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}.grid.c4{grid-template-columns:repeat(auto-fit,minmax(160px,1fr))}
/* the four gear sets of the profile (27.09.): two columns from 616px content up (2 × 2, none alone in a row), one on a phone – c2 alone made 3 + 1 on a desktop */
.grid.sets{grid-template-columns:repeat(auto-fit,minmax(max(300px,calc(50% - 8px)),1fr))}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:18px}.panel h2,.panel h3{margin:0 0 12px;font-size:16px;letter-spacing:.3px;color:var(--gold)}
.stat{display:flex;flex-direction:column;gap:2px}.stat b{font-size:22px}.stat small{color:var(--muted)}
.profile{display:flex;align-items:center;gap:18px;flex-wrap:wrap}.avatar{width:72px;height:72px;border-radius:50%;background:linear-gradient(135deg,var(--violet),var(--blue));display:flex;align-items:center;justify-content:center;font-size:28px;font-weight:700;overflow:hidden}.avatar img{width:100%;height:100%;object-fit:cover}
.profile h1{margin:0;font-size:28px}.profile .sub{color:var(--muted)}.title{display:inline-block;padding:2px 10px;border-radius:999px;background:rgba(241,196,15,.12);color:var(--gold);font-size:13px;margin:4px 6px 0 0}
.bar{height:10px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden}.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--gold2),var(--gold))}
.items{display:flex;flex-direction:column;gap:8px}.item{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;background:rgba(255,255,255,.03);border-left:4px solid var(--c,#666)}.item .slot{width:26px;text-align:center;font-size:18px}.item b{color:var(--c,#fff)}.item small{color:var(--muted);display:block}.item.empty{opacity:.5;border-left-color:#444}
/* Eternal (27.09., Nightblaze): a light name reads on the card, the black edge with a thin silver line and a dark glow keep it Eternal */
.item.r-eternal{border-left-color:#030305;box-shadow:inset 2px 0 0 #b9bccb;background:linear-gradient(90deg,rgba(0,0,0,.55),rgba(255,255,255,.03) 70%)}.item.r-eternal b{text-shadow:0 0 6px #000,0 0 2px #000}
.set-bonus{margin-top:10px;font-size:13px;color:var(--gold)}
table.board{width:100%;border-collapse:collapse;font-size:14px}table.board td,table.board th{padding:8px 6px;border-bottom:1px solid var(--line);text-align:left}table.board th{color:var(--muted);font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.5px}table.board tr.me td{background:rgba(241,196,15,.08)}table.board td.r{text-align:right;white-space:nowrap}
.tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}.tabs a{padding:6px 12px;border-radius:999px;border:1px solid var(--line);color:var(--text);font-size:13px}.tabs a.active{background:var(--gold);color:#1a1224;border-color:var(--gold);text-decoration:none}
.ach{display:flex;flex-wrap:wrap;gap:8px}.ach span{padding:6px 10px;border-radius:10px;background:rgba(255,255,255,.04);border:1px solid var(--line);font-size:13px}.ach span.locked{opacity:.35}
.notice{padding:14px 16px;border-radius:12px;background:rgba(52,152,219,.12);border:1px solid rgba(52,152,219,.3)}
.stars{color:var(--gold)}footer{margin-top:40px;color:var(--muted);font-size:13px;text-align:center}
.quests li{margin:4px 0}.muted{color:var(--muted)}.ok{color:var(--green)}
@media (max-width:640px){.hero h1{font-size:32px}header.top{flex-wrap:wrap;gap:6px 12px;padding:8px 0 12px;margin-bottom:12px}.brand{font-size:17px}nav{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:13px}nav a{margin:0}.wrap{padding-top:10px}}
.whisper{margin:0 0 10px;font-family:"DejaVu Sans Mono",ui-monospace,monospace;font-size:12px;color:#6f6a86;letter-spacing:.01em}.whisper b{color:var(--gold2);font-weight:600}
.panel.game{margin:16px 0}.panel.game canvas{display:block;width:100%;max-width:640px;height:auto;margin:6px auto;border-radius:10px;background:#0b0a17;border:1px solid var(--line);touch-action:none;image-rendering:pixelated;outline:none}.panel.game .muted{text-align:center;font-size:12px;margin-top:6px}
.riftrun-board{max-width:640px;margin:0 auto 14px;font-size:13px}.riftrun-board td,.riftrun-board th{padding:5px 6px}
/* ---- Rift in the browser (19.09.) ---- */
.rift{max-width:760px;margin:0 auto}
.rift-head{height:250px;box-sizing:border-box;overflow:hidden}.rift-top{display:flex;align-items:center;gap:20px;height:96px;margin-bottom:12px}
.rift-floor{display:flex;flex-direction:column;align-items:center;flex:0 0 130px;height:96px;justify-content:center;overflow:hidden;padding:6px 10px;border-radius:12px;background:rgba(255,255,255,.04)}.rift-floor b{font-size:40px;line-height:1;color:var(--gold)}.rift-floor small{color:var(--muted);font-size:12px;text-align:center}
.rift-wallet{display:flex;gap:14px;flex-wrap:wrap;font-weight:600;flex:1;height:96px;align-content:center;overflow:hidden}.rift-wallet .muted{font-weight:400;font-size:13px}
.rift-status{font-size:14px;color:var(--muted);line-height:1.5;height:105px;overflow:hidden}.rift-status b{color:var(--text)}
.rift-buttons{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:16px 0}
.rift-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:22px 10px;font-size:22px;border-radius:16px;user-select:none;-webkit-user-select:none;touch-action:manipulation}
.rift-btn small{font-size:11px;opacity:.6;font-weight:500}.rift-btn.descend{background:linear-gradient(135deg,#8e44ad,#5b2c8f);color:#fff}.rift-btn.farm{background:linear-gradient(135deg,#f1c40f,#d4a017);color:#1a1224}
.rift-btn:disabled{opacity:.45;cursor:not-allowed;filter:grayscale(.4)}.rift-btn:active:not(:disabled){transform:scale(.97)}
.rift.busy .rift-btn{opacity:.7}
.rift-log{height:230px;overflow:hidden;padding:12px 14px;margin-top:12px}.rift-log .run{display:flex;gap:10px;padding:2px 0;font-size:14px;line-height:1.5;animation:riftin .2s ease-out}
.rift-log .run{border-bottom:0}
.rift-log .run .n{display:none}.rift-log .run.win{border-left:3px solid var(--green);padding-left:8px}.rift-log .run.loss{border-left:3px solid var(--red);padding-left:8px}
.rift-log small.sub{color:var(--muted);font-size:12px}
/* the run as lines (27.09., Dylan): result and loot on top, rift.js takes lines off the bottom while the box overflows and ends the last one with " …" (span.rl-more) – no scrolling, nothing moves */
.rift-log .run>div{flex:1;min-width:0}.rift-log .rl{overflow-wrap:anywhere}.rift-log .rl-crit,.rift-log .rl-head,.rift-log .rl-log,.rift-log .rl-more{color:var(--muted)}.rift-log .rl-head b,.rift-log .rl-log b{color:var(--text)}.rift-log .run.still{animation:none}
.rift-notes{margin:14px 0 0;background:rgba(241,196,15,.07);border-color:rgba(241,196,15,.25)}.rift-notes .btn.small{margin-top:8px;padding:6px 12px;font-size:13px}
.rift-check[hidden],.rift-notes[hidden]{display:none!important}
.rift-check{position:fixed;inset:0;background:rgba(5,4,12,.82);display:flex;align-items:center;justify-content:center;z-index:50;padding:16px}.rift-check .panel{max-width:420px;text-align:center}.rift-check h3{font-size:20px}
.rift-check-opts{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:10px}.rift-check-opts .btn{font-size:22px;padding:14px 22px;min-width:74px}
.rift-foot{font-size:12px;text-align:center;margin-top:14px}
.chan{color:var(--blue)}code{background:rgba(255,255,255,.08);padding:1px 5px;border-radius:5px;font-size:.92em}
@keyframes riftin{from{opacity:.3}to{opacity:1}}
@media (max-width:640px){.rift-head{height:240px;padding:12px 14px}.rift-top{height:60px;gap:12px;margin-bottom:8px}.rift-floor{flex:0 0 118px;height:60px;padding:4px 6px}.rift-floor b{font-size:26px}.rift-floor small{font-size:11px;white-space:nowrap}.rift-wallet{height:60px;flex-direction:column;gap:2px;align-items:flex-start;justify-content:center;font-size:14px;flex-wrap:nowrap}.rift-wallet .shards{display:none}.rift-status{height:146px;font-size:13px;line-height:1.4}.rift-btn{padding:16px 8px;font-size:18px}.rift-log{height:max(170px,calc(100dvh - 454px));font-size:13px;line-height:1.45;padding:10px 12px}.rift-log .run{font-size:13px}.rift-buttons{margin:12px 0}}
.install-hint{margin:12px 0 0;font-size:13px;color:var(--muted)}
/* ---- Build planner (19.09.) ---- */
.plan-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:16px;align-items:start}
.plan-global{display:flex;flex-wrap:wrap;gap:10px 16px;margin-bottom:12px}.plan-global label,.plan-item label{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--muted)}
.plan-form input[type=number]{width:74px;padding:6px 8px;border-radius:8px;border:1px solid var(--line);background:rgba(255,255,255,.06);color:var(--text);font:inherit}
.plan-form select{padding:6px 8px;border-radius:8px;border:1px solid var(--line);background:rgba(255,255,255,.06);color:var(--text);font:inherit;max-width:230px}
.plan-form .pct{color:var(--muted)}
.plan-tabs{margin:6px 0 12px}
.plan-item{padding:10px 12px;border-radius:10px;background:rgba(255,255,255,.03);margin-bottom:8px}.plan-item-head{margin-bottom:6px}.plan-item-row{display:flex;flex-wrap:wrap;gap:8px 14px;margin-top:6px}
.plan-actions{margin-top:10px}
.plan-results.busy{opacity:.6}.plan-table td.r b{color:var(--text)}.dp{color:var(--green);font-size:12px}.dm{color:var(--red);font-size:12px}.d0{color:var(--muted);font-size:12px}
.small{font-size:12px}
@media (max-width:860px){.plan-grid{grid-template-columns:1fr}}
/* ---- Guild pages (19.09.) ---- */
.guild-card{display:block;position:relative;color:var(--text);text-decoration:none!important}.guild-card:hover{border-color:rgba(241,196,15,.4)}.guild-rank{position:absolute;top:12px;right:14px;color:var(--muted);font-size:12px}
.guild-about{margin:8px 0 0;font-size:13px;color:var(--muted)}.guild-about-full{margin:10px 0 0;color:var(--text)}
.guild-about-form{margin-top:12px;display:flex;flex-direction:column;gap:8px;max-width:560px}.guild-about-form textarea{padding:8px 10px;border-radius:8px;border:1px solid var(--line);background:rgba(255,255,255,.06);color:var(--text);font:inherit;resize:vertical}
.guild-app{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--line)}
.bar.boss i{background:linear-gradient(90deg,#c0392b,var(--red))}