:root{--bg:#0c0a09;--surface:#1c1917;--surface-raised:#292524;--accent:#f59e0b;--accent-bright:#fbbf24;--accent-deep:#b45309;--text:#fafaf9;--text-muted:#a8a29e;--border:#292524}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background-color:var(--bg);min-height:100vh;color:var(--text);margin:0;font-family:system-ui,-apple-system,Segoe UI,sans-serif;line-height:1.6}a{color:var(--accent-bright);text-decoration:none}a:hover{text-decoration:underline}.container{max-width:1100px;margin:0 auto;padding:0 1.5rem}.site-header{z-index:10;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--border);background-color:#0c0a09e6;position:sticky;top:0}.site-header .container{justify-content:space-between;align-items:center;gap:1rem;padding-top:.9rem;padding-bottom:.9rem;display:flex}.logo{letter-spacing:.04em;color:var(--text);font-size:1.3rem;font-weight:800}.logo span{color:var(--accent)}.nav{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:.5rem 1.4rem;font-size:.95rem;display:flex}.nav a{color:var(--text-muted)}.nav a:hover{color:var(--text);text-decoration:none}.btn{white-space:nowrap;border-radius:.6rem;padding:.7rem 1.4rem;font-weight:700;display:inline-block}.btn-primary{background:linear-gradient(135deg, var(--accent), var(--accent-deep));color:#1c1006;box-shadow:0 0 24px #f59e0b59}.btn-primary:hover{text-decoration:none;box-shadow:0 0 36px #f59e0b8c}.btn-secondary{border:1px solid var(--border);color:var(--text);background-color:var(--surface)}.btn-secondary:hover{border-color:var(--accent);text-decoration:none}.hero{text-align:center;background:radial-gradient(70% 50% at 50% 0,#f59e0b1f,#0000);padding:6rem 0 4rem}.hero h1{margin:0;font-size:clamp(2.2rem,6vw,3.6rem);line-height:1.15}.hero .subhead{color:var(--accent);margin:.4rem 0 1.2rem;font-size:clamp(1.3rem,3.5vw,2rem);font-weight:700}.hero p{max-width:42rem;color:var(--text-muted);margin:0 auto 2rem;font-size:1.1rem}.hero-actions{flex-wrap:wrap;justify-content:center;gap:1rem;display:flex}.stamp{color:var(--text-muted);letter-spacing:.06em;text-transform:uppercase;margin-top:1.6rem;font-size:.9rem}.section{padding:4rem 0}.section-alt{background-color:#1c191780}.section h2{text-align:center;margin:0 0 .6rem;font-size:clamp(1.6rem,4vw,2.3rem)}.section .lede{text-align:center;color:var(--text-muted);max-width:44rem;margin:0 auto 2.5rem}.cards-3{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.2rem;display:grid}.card{background-color:var(--surface);border:1px solid var(--border);border-radius:.9rem;padding:1.4rem}.card h3{margin:0 0 .5rem;font-size:1.1rem}.card p{color:var(--text-muted);margin:0;font-size:.95rem}.card .step{text-align:center;width:2rem;height:2rem;color:var(--accent);background-color:#f59e0b26;border-radius:50%;margin-bottom:.8rem;font-weight:800;line-height:2rem;display:inline-block}.chip-grid{flex-wrap:wrap;justify-content:center;gap:.6rem;display:flex}.chip{background-color:var(--surface);border:1px solid var(--border);color:var(--text);border-radius:999px;padding:.45rem 1rem;font-size:.9rem}.ladder{flex-direction:column;gap:1rem;display:flex}.tier-card{background-color:var(--surface);border:1px solid var(--border);border-left:4px solid var(--tier-color,var(--accent));border-radius:.9rem;grid-template-columns:auto 1fr;gap:1.2rem;padding:1.3rem 1.5rem;display:grid}.tier-badge{flex-direction:column;justify-content:center;align-items:center;gap:.2rem;min-width:5.5rem;display:flex}.tier-badge .gem{background:var(--tier-color,var(--accent));width:2.6rem;height:2.6rem;box-shadow:0 0 18px color-mix(in srgb, var(--tier-color,var(--accent)) 55%, transparent);border-radius:.6rem;margin-bottom:.6rem;transform:rotate(45deg)}.tier-badge .name{color:var(--tier-color,var(--accent));font-weight:800}.tier-badge .level{color:var(--text-muted);font-size:.75rem}.tier-body h3{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin:0 0 .3rem;font-size:1rem;font-weight:600}.tier-body ul{color:var(--text);margin:0 0 .8rem;padding-left:1.1rem;font-size:.95rem}.tier-body .xp-note{color:var(--text-muted);font-size:.85rem}.pack-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem;display:grid}.pack-card{background-color:var(--surface);border:1px solid var(--border);text-align:center;border-radius:.9rem;padding:1.3rem}.pack-card .xp{font-size:1.4rem;font-weight:800}.pack-card .price{color:var(--accent);margin:.3rem 0;font-size:1.2rem;font-weight:700}.pack-card .per{color:var(--text-muted);font-size:.8rem}.pack-card .btn{box-sizing:border-box;width:100%;padding:.55rem .8rem;font-size:.95rem;display:block}.honesty{max-width:46rem;color:var(--text-muted);background-color:#f59e0b12;border:1px solid #f59e0b40;border-radius:.9rem;margin:2.5rem auto 0;padding:1.2rem 1.5rem;font-size:.95rem}.site-footer{border-top:1px solid var(--border);color:var(--text-muted);padding:2.5rem 0;font-size:.9rem}.site-footer .container{text-align:center;flex-direction:column;align-items:center;gap:1rem;display:flex}.footer-links{flex-wrap:wrap;justify-content:center;gap:1.4rem;display:flex}.footer-links a{color:var(--text-muted)}.prose{max-width:46rem;margin:0 auto;padding:3.5rem 1.5rem}.prose h1{font-size:2rem}.prose h2{margin-top:2rem;font-size:1.25rem}.prose p,.prose li{color:var(--text-muted)}.prose strong{color:var(--text)}.compare-table{border-collapse:collapse;width:100%;font-size:.92rem}.compare-table th,.compare-table td{border:1px solid var(--border);text-align:left;vertical-align:top;padding:.7rem .9rem}.compare-table th{background-color:var(--surface)}.compare-table td.yes{color:#50c878}.compare-table td.no{color:#ef6b6b}.picker-grid{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:1rem;display:grid}.guild-card{background-color:var(--surface);border:1px solid var(--border);color:var(--text);border-radius:.9rem;align-items:center;gap:.9rem;padding:1rem 1.1rem;display:flex}.guild-card:hover{border-color:var(--accent);text-decoration:none}.guild-card img,.guild-card .icon-fallback{background-color:var(--surface-raised);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:44px;height:44px;font-weight:700;display:flex}.dash-layout{grid-template-columns:220px 1fr;gap:2rem;padding:2rem 0 4rem;display:grid}@media (max-width:800px){.dash-layout{grid-template-columns:1fr}}.dash-sidebar{flex-direction:column;align-self:start;gap:.2rem;display:flex;position:sticky;top:5rem}.dash-sidebar a{color:var(--text-muted);border-radius:.5rem;padding:.5rem .8rem;font-size:.95rem}.dash-sidebar a:hover{color:var(--text);background-color:var(--surface);text-decoration:none}.dash-sidebar .group-label{text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);margin:.9rem 0 .2rem;padding:0 .8rem;font-size:.75rem}.dash-sidebar a.active{color:var(--text);background-color:var(--surface)}.dash-sidebar .nav-group summary{cursor:pointer;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);-webkit-user-select:none;user-select:none;border-radius:.5rem;margin-top:.35rem;padding:.45rem .8rem;font-size:.78rem;font-weight:700;list-style:none}.dash-sidebar .nav-group summary::-webkit-details-marker{display:none}.dash-sidebar .nav-group summary:before{content:"▸";width:1.05rem;transition:transform .15s;display:inline-block}.dash-sidebar .nav-group[open] summary:before{transform:rotate(90deg)}.dash-sidebar .nav-group[open]{margin-bottom:.55rem}.dash-sidebar .nav-group summary:hover{color:var(--text);background-color:var(--surface)}.dash-sidebar .nav-group a{border-left:2px solid var(--border);border-radius:0 .5rem .5rem 0;margin:0 0 .15rem 1.15rem;padding:.4rem .7rem;font-size:.92rem;display:block}.dash-sidebar .nav-group a:hover{border-left-color:var(--text-muted)}.dash-sidebar .nav-group a.active{border-left-color:var(--accent)}.widget{background-color:var(--surface);border:1px solid var(--border);border-radius:.9rem;margin-bottom:1.5rem;padding:1.5rem}.widget h2{margin:0 0 1rem;font-size:1.2rem}.progress-track{background-color:var(--bg);border-radius:999px;height:14px;margin:.6rem 0;overflow:hidden}.progress-fill{background:linear-gradient(90deg, var(--accent-deep), var(--accent));border-radius:999px;min-width:4px;height:100%}.stat-row{color:var(--text-muted);flex-wrap:wrap;gap:2rem;font-size:.95rem;display:flex}.stat-row strong{color:var(--text);font-size:1.2rem;display:block}.locked-card{opacity:.9;border-style:dashed}.locked-card .lock-line{color:var(--text-muted);margin:.5rem 0 0;font-size:.9rem}.form-grid{flex-direction:column;gap:1.2rem;max-width:40rem;display:flex}.field label{margin-bottom:.3rem;font-weight:600;display:block}.field .help{color:var(--text-muted);margin-top:.25rem;font-size:.85rem}.input,.select,textarea.input{background-color:var(--bg);border:1px solid var(--border);width:100%;color:var(--text);border-radius:.5rem;padding:.55rem .7rem;font-family:inherit;font-size:.95rem}.input:focus,.select:focus{outline:2px solid var(--accent-deep)}.toggle-row{align-items:center;gap:.7rem;display:flex}.checklist{border:1px solid var(--border);background-color:var(--bg);border-radius:.5rem;flex-direction:column;gap:.35rem;max-height:14rem;padding:.7rem;display:flex;overflow-y:auto}.checklist label{color:var(--text);align-items:center;gap:.5rem;font-size:.92rem;font-weight:400;display:flex}.save-badge{background-color:var(--surface-raised);border:1px solid var(--border);z-index:20;border-radius:999px;padding:.5rem 1.1rem;font-size:.9rem;position:fixed;bottom:1.5rem;right:1.5rem}.save-badge.saved{color:#50c878;border-color:#50c878}.save-badge.error{color:#ef6b6b;border-color:#ef6b6b}.rule-card{border:1px solid var(--border);background-color:var(--surface);border-radius:.7rem;flex-direction:column;gap:.8rem;padding:1rem 1.2rem;display:flex}.reward-row{align-items:center;gap:.6rem;display:flex}.btn-small{border:1px solid var(--border);background-color:var(--surface-raised);color:var(--text);cursor:pointer;border-radius:.4rem;padding:.35rem .8rem;font-size:.85rem}.btn-small:hover{border-color:var(--accent)}.table-scroll{overflow-x:auto}.table-scroll .compare-table{min-width:640px}.reward-row{flex-wrap:wrap}@media (max-width:700px){.nav a:not(.btn){display:none}.hero{padding:4rem 0 3rem}.section{padding:2.5rem 0}.prose{padding:2rem 1.2rem}}@media (max-width:540px){.tier-card{grid-template-columns:1fr;gap:.8rem}.tier-badge{flex-direction:row;justify-content:flex-start;gap:.7rem;min-width:0}.tier-badge .gem{width:1.5rem;height:1.5rem;margin-bottom:0}}@media (max-width:800px){.dash-sidebar{flex-flow:wrap;align-items:center;gap:.4rem;position:static}.dash-sidebar .group-label{width:100%;margin:.5rem 0 0}.dash-sidebar .nav-group{width:100%}.dash-sidebar .nav-group summary{margin:.5rem 0 .3rem;padding:.35rem .7rem}.dash-sidebar .nav-group a{border-left:none;border:1px solid var(--border);border-radius:.5rem;margin:0 .35rem .35rem 0;padding:.35rem .7rem;display:inline-block}.dash-sidebar .nav-group[open]{margin-bottom:.2rem}.dash-sidebar .guild-card{width:100%}.dash-sidebar a{border:1px solid var(--border);padding:.35rem .7rem;font-size:.85rem}}.toast-stack{z-index:100;flex-direction:column;gap:.5rem;max-width:min(360px,100vw - 2.4rem);display:flex;position:fixed;bottom:1.2rem;right:1.2rem}.toast{background-color:var(--surface-raised);border:1px solid var(--border);cursor:pointer;border-left:3px solid #50c878;border-radius:.6rem;padding:.7rem 1rem;font-size:.92rem;animation:.18s toast-in;box-shadow:0 8px 24px #00000059}.toast.error{border-left-color:#ef6b6b}@keyframes toast-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.error-card{flex-direction:column;align-items:flex-start;gap:.8rem;max-width:520px;display:flex}.card-variant-grid{flex-direction:column;gap:.9rem;display:flex}.card-variant{background-color:var(--surface-raised);border:2px solid var(--border);cursor:pointer;text-align:left;color:inherit;font:inherit;border-radius:.9rem;flex-direction:column;gap:.35rem;padding:.8rem;display:flex}.card-variant img{border-radius:.6rem;width:100%;display:block}.card-variant span{color:var(--text-muted);font-size:.85rem}.card-variant.selected{border-color:var(--accent)}.card-variant.locked{cursor:not-allowed;opacity:.55}.card-variant.locked img{filter:grayscale(.6)}.card-variant.locked span{color:var(--accent)}
