:root{--bg-0: #0e0b08;--bg-1: #1a1409;--bg-2: #261d0f;--bg-3: #332a18;--line: #4a3d28;--ink: #e8dcc8;--ink-dim: #9a8b72;--ink-faint: #5c5040;--ember: #cc5500;--ember-dim: #7a3200;--ember-glow: rgba(204,85,0,.4);--grove: #3d6b3a;--grove-dim: #1e3a1c;--grove-glow: rgba(61,107,58,.35);--parchment: #d4b896;--parchment-dim: #8c7a5e;--rust: #8b3a2a;--rust-glow: rgba(139,58,42,.35);--crimson: var(--ember);--crimson-dim: var(--ember-dim);--crimson-glow: var(--ember-glow);--patina: var(--grove);--patina-dim: var(--grove-dim);--patina-glow: var(--grove-glow);--amber: var(--parchment);--amber-dim: var(--parchment-dim);--amber-glow: rgba(212,184,150,.35);--jade: var(--grove);--bone: var(--parchment);--gold-dim: #6b5b3a;--energy: #6cb8e0;--ff-display: "Cormorant Garamond", "Garamond", serif;--ff-body: "Inter", -apple-system, system-ui, sans-serif;--ff-brush: "Cormorant Garamond", serif;--ff-serif: "Cormorant Garamond", "Garamond", serif;--ff-mono: "JetBrains Mono", ui-monospace, monospace}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg-0);color:var(--ink);font-family:var(--ff-body);font-size:12px;line-height:1.4;-webkit-font-smoothing:antialiased;overflow:hidden}.surface{background:var(--bg-1);border:1px solid var(--line)}.surface.concrete{background:linear-gradient(180deg,var(--bg-2) 0%,var(--bg-1) 100%);border-color:var(--ember-dim)}.btn{display:inline-flex;align-items:center;justify-content:center;padding:4px 9px;background:var(--bg-2);border:1px solid var(--line);color:var(--ink);font-family:var(--ff-display);font-size:10px;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;transition:background .12s,border-color .12s,box-shadow .12s;white-space:nowrap;-webkit-user-select:none;user-select:none}.btn:hover:not(:disabled){background:var(--bg-3);border-color:var(--ember-dim)}.btn:disabled{opacity:.35;cursor:not-allowed}.btn.active{background:var(--ember-dim);border-color:var(--ember)}.btn.primary{background:linear-gradient(180deg,var(--ember-dim) 0%,#4a1e00 100%);border-color:var(--ember);color:var(--ink)}.btn.primary:hover:not(:disabled){background:linear-gradient(180deg,var(--ember) 0%,var(--ember-dim) 100%);box-shadow:0 0 12px var(--ember-glow)}.btn.ember{background:linear-gradient(180deg,var(--ember-dim) 0%,#3a1800 100%);border-color:var(--ember);color:var(--ink)}.btn.ember:hover:not(:disabled){background:linear-gradient(180deg,var(--ember) 0%,var(--ember-dim) 100%);box-shadow:0 0 12px var(--ember-glow)}.btn.grove{background:linear-gradient(180deg,var(--grove-dim) 0%,#0c1e0b 100%);border-color:var(--grove);color:var(--ink)}.btn.grove:hover:not(:disabled){background:linear-gradient(180deg,var(--grove) 0%,var(--grove-dim) 100%);box-shadow:0 0 12px var(--grove-glow)}.btn.ghost{background:transparent;border-color:transparent;color:var(--ink-dim)}.btn.ghost:hover:not(:disabled){background:var(--bg-2);border-color:var(--line);color:var(--ink)}.tab-bar{display:flex;gap:2px;border-bottom:1px solid var(--line);margin-bottom:10px}.tab{padding:4px 8px;background:transparent;border:none;border-bottom:2px solid transparent;color:var(--ink-dim);font-family:var(--ff-display);font-size:9px;letter-spacing:.18em;text-transform:uppercase;cursor:pointer;transition:color .1s,border-color .1s;white-space:nowrap}.tab:hover{color:var(--ink)}.tab.active{color:var(--ember);border-bottom-color:var(--ember)}.input{width:100%;padding:5px 8px;background:var(--bg-0);border:1px solid var(--line);color:var(--ink);font-family:var(--ff-body);font-size:11px;outline:none;transition:border-color .15s,box-shadow .15s}.input:focus{border-color:var(--ember);box-shadow:0 0 0 1px var(--ember-glow)}.input.rune{background:#0e0b0899;border:none;border-bottom:1px solid var(--parchment-dim);padding:7px 4px;font-family:var(--ff-serif);letter-spacing:.05em;font-size:12px;color:var(--ink);transition:border-color .18s,box-shadow .18s}.input.rune:focus{border-bottom-color:var(--grove);box-shadow:0 1px 0 0 var(--grove-glow)}.input.brass{background:#0e0b0899;border:none;border-bottom:1px solid var(--parchment-dim);padding:7px 4px;font-family:var(--ff-serif);font-size:12px;color:var(--ink);transition:border-color .18s,box-shadow .18s}.input.brass:focus{border-bottom-color:var(--grove);box-shadow:0 1px 0 0 var(--grove-glow)}.panel-title{display:flex;align-items:center;gap:6px;font-family:var(--ff-display);font-size:12px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--ink);margin-bottom:10px}.panel-title .accent{width:3px;height:12px;background:var(--ember);display:inline-block;box-shadow:0 0 5px var(--ember-glow)}.field-label{font-family:var(--ff-display);font-size:8px;letter-spacing:.28em;text-transform:uppercase;color:var(--grove);margin-bottom:3px}.scrollable{overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--line) transparent}.scrollable::-webkit-scrollbar{width:3px}.scrollable::-webkit-scrollbar-thumb{background:var(--line);border-radius:2px}@keyframes anim-up{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes anim-left{0%{opacity:0;transform:translate(-12px)}to{opacity:1;transform:none}}.anim-up{animation:anim-up .18s ease}.anim-left{animation:anim-left .18s ease}.skill-slot{position:relative;width:42px;height:42px;background:var(--bg-2);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;cursor:pointer;-webkit-user-select:none;user-select:none;font-size:20px;transition:border-color .12s}.skill-slot:hover{border-color:var(--ember-dim)}.skill-slot.active{border-color:var(--ember);box-shadow:inset 0 0 7px var(--ember-glow)}.skill-slot.locked{opacity:.35}.skill-slot .slot-key{position:absolute;top:1px;left:3px;font-size:8px;font-family:var(--ff-mono);color:var(--ink-faint)}.skill-slot .cost{position:absolute;bottom:1px;right:3px;font-size:8px;font-family:var(--ff-mono);color:var(--energy)}.skill-slot .cooldown-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#000000a6;display:flex;align-items:center;justify-content:center;font-family:var(--ff-mono);font-size:13px;color:var(--ink);pointer-events:none}.stone-plate{background:linear-gradient(180deg,var(--bg-2) 0%,var(--bg-1) 100%);border:1px solid var(--ember-dim);box-shadow:0 0 0 1px #0009,inset 0 1px #d4b8960a,0 24px 72px #000000bf;position:relative}.stone-plate:before,.stone-plate:after{content:"";position:absolute;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent 0%,var(--ember-dim) 15%,var(--parchment) 50%,var(--ember-dim) 85%,transparent 100%);opacity:.4}.stone-plate:before{top:5px}.stone-plate:after{bottom:5px}.brass-plate{background:linear-gradient(180deg,var(--bg-2) 0%,var(--bg-1) 100%);border:1px solid var(--ember-dim);position:relative}.runemark{position:absolute;width:5px;height:5px;border-radius:50%;background:radial-gradient(circle at 35% 35%,var(--ember-dim) 0%,#2a0e00 60%,#0a0500 100%);box-shadow:0 0 4px var(--ember-glow),inset 0 0 0 1px #000000b3}.runemark.tl,.rivet.tl{top:9px;left:9px}.runemark.tr,.rivet.tr{top:9px;right:9px}.runemark.bl,.rivet.bl{bottom:9px;left:9px}.runemark.br,.rivet.br{bottom:9px;right:9px}.rivet{position:absolute;width:5px;height:5px;border-radius:50%;background:radial-gradient(circle at 35% 35%,var(--ember-dim) 0%,#2a0e00 60%);box-shadow:0 0 4px var(--ember-glow)}.rune-grid{background-color:var(--bg-0);background-image:radial-gradient(ellipse at 50% 20%,rgba(204,85,0,.07) 0%,transparent 55%),radial-gradient(ellipse at 50% 100%,rgba(61,107,58,.08) 0%,transparent 60%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 64 64'%3E%3Cpath fill='none' stroke='%234a3d28' stroke-width='0.5' stroke-opacity='0.5' d='M32 4 L60 20 L60 44 L32 60 L4 44 L4 20 Z'/%3E%3Cpath fill='none' stroke='%234a3d28' stroke-width='0.3' stroke-opacity='0.3' d='M32 14 L50 24 L50 40 L32 50 L14 40 L14 24 Z'/%3E%3C/svg%3E");background-size:auto,auto,64px 64px}.hex-grid{background-color:var(--bg-0);background-image:radial-gradient(ellipse at 50% 20%,rgba(204,85,0,.07) 0%,transparent 55%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 64 64'%3E%3Cpath fill='none' stroke='%234a3d28' stroke-width='0.5' stroke-opacity='0.4' d='M32 4 L60 20 L60 44 L32 60 L4 44 L4 20 Z'/%3E%3C/svg%3E");background-size:auto,64px 64px}.glow-ring{position:absolute;border-radius:50%;border:1px solid var(--ember);box-shadow:0 0 24px var(--ember-glow),inset 0 0 24px var(--ember-glow);pointer-events:none}.scanlines:before{display:none}