/* Original painted assets; percentage slices preserve their corners at any size. */
/* The resource globes are drawn in CSS so their liquid can follow live values. */
:root{--bg:#100e0b;--panel:#211a14;--ink:#eee0c4;--muted:#b9a88a;--line:#59462e;--gold:#e1bb70;--serif:Palatino,'Palatino Linotype',Georgia,serif;--frame:url('/assets/ui/forged-frame.png');--button:url('/assets/ui/oxblood-button.png');--paper:url('/assets/ui/parchment.png')}
body{background:radial-gradient(ellipse at top,#35271b,#100e0b 75%);scrollbar-color:#806342 #19130f}
h1,h2,h3{color:#f2d59a;text-shadow:0 2px 2px #0009}
button,.gold{border:8px solid transparent;border-image:var(--button) 12.5% fill / 1 / 0 stretch;border-radius:0;background:#3a1c17;color:#f3dfb5;padding:3px 10px;font:600 14px var(--serif);text-shadow:0 1px 2px #000;box-shadow:0 2px 4px #0006;transition:filter .15s}
button:hover,.gold:hover{background:#4d291c;color:#fff0c7;filter:brightness(1.22)}
button:disabled{filter:grayscale(.6);opacity:.45}
button:focus-visible,input:focus-visible{outline:2px solid #ffe1a0;outline-offset:3px}
.topbar{height:94px;border:15px solid transparent;border-image:var(--frame) 12.5% fill / 1 / 0 stretch;padding:0 22px;box-shadow:0 6px 18px #0008;position:relative;z-index:2}
.brand{color:#f0d193;font-size:21px;text-shadow:0 2px 2px #000;letter-spacing:.13em}.brand small{color:#bba179;letter-spacing:.22em}
.crest{background:linear-gradient(140deg,#5c3d1c,#1c1710);border:2px solid #ab844a;outline-color:#725831;border-radius:4px 4px 14px 14px;box-shadow:inset 0 0 8px #000,0 2px 5px #0009;color:#f3cf79}
.game{gap:10px;padding:12px;grid-template-columns:minmax(0,1fr) 310px}
.world{border:12px solid transparent;border-image:var(--frame) 12.5% / 1 / 0 stretch;background:radial-gradient(ellipse at 50% 52%,#3d3a2f,#171817 72%);box-shadow:0 7px 22px #0008}
.world{min-height:520px}.room-heading{left:20px;top:14px;max-width:85%}.room-heading p{color:#d1c2a2;text-shadow:0 2px 4px #000}.eyebrow{color:#cba466;letter-spacing:.15em;font-size:10px}
.login-note,.selected{border:20px solid transparent;border-image:var(--frame) 12.5% fill / 1 / 0 stretch;border-radius:0;background:#19140f;box-shadow:0 14px 40px #000a;padding:15px;max-width:360px}
.login-note{left:20px;bottom:66px}.login-note h2{font-size:28px}.login-note p{color:#cbbb9b;line-height:1.5}.login-note button{padding:7px}
.selected{max-width:94%;width:max-content;padding:10px;gap:12px}.selected strong{color:#f1d49f}.selected button{font-family:var(--serif)}
.camera-bar{left:16px;right:16px;bottom:8px}.camera-bar span{color:#c3b59a;text-shadow:0 1px 3px #000}.camera-bar button{background:#321c15;border:7px solid transparent;border-image:var(--button) 12.5% fill / 1 / 0 stretch;padding:0 7px;font-size:22px}
.sidebar{background:none;border:0;overflow:visible}.sidebar>section,.sidebar>.possessions{border:15px solid transparent;border-image:var(--frame) 12.5% fill / 1 / 0 stretch;padding:16px 12px;margin-bottom:10px;background:#201911;box-shadow:0 5px 15px #0006}
.character-name{margin:16px 0 24px}.character-name h2{font-size:25px}.portrait{flex-shrink:0;width:52px;height:56px;border-radius:50%;border:3px ridge #a48450;background:radial-gradient(circle,#514429,#17110c);box-shadow:0 0 0 3px #100c09,inset 0 0 10px #000;color:#e9c77d}
.vital label{color:#d4c3a6}.meter{height:12px;border:1px solid #79603b;border-radius:2px;background:#100d0a;box-shadow:0 1px 0 #d3b57522,inset 0 2px 5px #000}
.meter>div{box-shadow:inset 0 2px 0 #ffffff30,inset 0 -2px 3px #0006}.health>div{background:linear-gradient(#c84131,#77271f)}.magic>div{background:linear-gradient(#548bc3,#234b81)}.stamina>div{background:linear-gradient(#a7ac55,#57612d)}
.section-heading h2{font-size:23px}#exits{gap:8px}#exits button{padding:5px 4px;gap:6px;font-size:14px}.tabs{padding:0;gap:6px;border-bottom:1px solid #725632;padding-bottom:12px}.tabs button{border:7px solid transparent;border-image:var(--button) 12.5% fill / 1 / 0 stretch;padding:3px;font-family:var(--serif);color:#cbb895}.tabs button[aria-selected=true],.practice-tabs [aria-pressed=true]{color:#ffdfa0;filter:brightness(1.35);box-shadow:0 2px 0 #d8ae65}
.entity-list{padding:8px 0;max-height:430px}.entity-button{border:0;border-image:none;background:linear-gradient(90deg,#b4945120,transparent);box-shadow:none;border-bottom:1px solid #775c333d;padding:11px 5px;color:#e5d4b5}.entity-button .icon{background:#16110b;border:1px solid #7c6139;box-shadow:inset 0 0 6px #000}.entity-button small{color:#b7a584}.empty{color:#bcaa8c}
.journal{border:18px solid transparent;border-image:var(--frame) 12.5% fill / 1 / 0 stretch;background:#120f0c;box-shadow:0 7px 20px #0008}
.journal-heading{height:48px;padding:0 10px;border-bottom:1px solid #83623988;gap:12px}.journal-heading h2{font-size:23px}.journal-heading>span{color:#bba88a}.journal-heading button{border:6px solid transparent;border-image:var(--button) 12.5% fill / 1 / 0 stretch;background:#321b14;padding:1px 7px;color:#d7c3a0}
#log{background:#100e0de8;margin:8px 0;padding:12px 14px;box-shadow:inset 0 0 18px #0007;color:#e5ddcd;scrollbar-color:#7e6240 #15100c}#log .system-message{color:#b5a88b}
#command-form{margin:0 4px;background:#100d0b;border:1px solid #947043;border-radius:0;box-shadow:inset 0 2px 6px #000,0 0 0 2px #0d0b09;padding:4px 5px 4px 10px}#command-form button{border:7px solid transparent;border-image:var(--button) 12.5% fill / 1 / 0 stretch;background:#371c14;padding:3px 10px;color:#f0d8a7}#command-form input::placeholder{color:#9b8a70}
.quick-actions{padding:12px 4px 2px;gap:6px;flex-wrap:wrap}.quick-actions button{border:6px solid transparent;border-image:var(--button) 12.5% fill / 1 / 0 stretch;background:#321b14;padding:3px 7px;color:#e9d4ab;font-size:13px}.quick-actions span{color:#b19d7b}
body>footer{border-top:1px solid #715334;background:#15110d;color:#ae9875}
.game-modal{width:min(800px,calc(100vw - 24px));max-height:90dvh;border:24px solid transparent;border-image:var(--frame) 12.5% fill / 1 / 0 stretch;border-radius:0;background:#1a140f;padding:0;overflow:hidden;box-shadow:0 24px 100px #000e}
.game-modal[open]{display:flex;flex-direction:column}.game-modal::backdrop{background:#090704b8;backdrop-filter:blur(4px)}
.login-modal{width:min(820px,calc(100vw - 24px))}.login-content{padding:22px;overflow:auto;min-height:0}#login-output{font:14px/1.5 Consolas,monospace;white-space:pre-wrap;overflow-wrap:anywhere;max-height:36dvh;overflow:auto;padding:16px;background:#0d0b09a6;border:1px solid #84683e55;margin-bottom:18px}#login-output:empty{display:none}#login-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}#login-actions .gold{grid-column:1/-1;padding:14px}#login-label{display:block;color:#e6c788;margin:12px 0}.login-entry{display:flex;gap:10px}.login-entry input{min-width:0;flex:1;background:#17110b;border:1px solid #84683e;color:#f1dfbd;padding:12px;border-radius:4px}.login-modal footer{height:auto}.login-modal #login-status{letter-spacing:0;line-height:1.4}@media(max-width:620px){.login-content{padding:12px}#login-output{font-size:12px}.connection{gap:5px;flex-wrap:wrap;justify-content:flex-end}.connection button{padding:5px;font-size:12px}}
.config-section{margin:22px 0}.config-section h3{font:20px var(--serif);color:#e6c788;border-bottom:1px solid #84683e;padding-bottom:9px;margin-bottom:0}.config-row{display:flex;align-items:center;gap:18px;padding:15px 0;border-bottom:1px solid #84683e33}.config-copy{flex:1;min-width:0}.config-copy strong{display:block;color:#eedcb6;font:17px var(--serif)}.config-copy small{display:block;color:#bba788;line-height:1.5;margin:5px 0}.config-copy code{font-size:11px;color:#907b59}.config-toggle{flex:0 0 90px;min-height:42px;border:1px solid #84683e;border-radius:20px;background:#241a13;color:#baa98b;font-weight:bold}.config-toggle[aria-checked=true]{background:linear-gradient(#5a6836,#303c1d);border-color:#aeb878;color:#f0efc3;box-shadow:inset 0 1px 3px #dce4a533}.config-toggle[aria-checked=false]{background:#281e18}.quick-actions{flex-wrap:wrap}
.game-modal>header{padding:16px 20px 20px;background:transparent;border-bottom:1px solid #9b7944;gap:18px;flex-shrink:0}.game-modal h2{font-size:34px;line-height:1.15}.game-modal>header button,#clear-selection{border:7px solid transparent;border-image:var(--button) 12.5% fill / 1 / 0 stretch;background:#321b14;padding:0 7px;font-size:24px;flex-shrink:0}
.game-modal #panel-content{padding:24px;overflow:auto;min-height:0;scrollbar-color:#8c704a #20160f}.game-modal>footer{padding:14px 20px;flex-shrink:0;border-top:1px solid #80613a;color:#bba788;background:#140f0b99;min-height:62px}.game-modal>footer button{font-size:13px;white-space:nowrap}
.equipment-slot{border:10px solid transparent;border-image:var(--frame) 12.5% fill / 1 / 0 stretch;border-radius:0;background:#21180f;padding:12px;min-height:110px;box-shadow:0 3px 8px #0006}.equipment-slot strong{font:18px var(--serif);color:#ebd6ad}.equipment-slot .slot-label{font-size:10px;color:#c5a66c}.empty-slot{opacity:.65}.empty-slot strong{color:#ac9b7e;font-style:italic}.inventory-actions{flex-wrap:wrap;gap:6px}.inventory-actions button{padding:3px 8px}
.modal-intro{color:#cab694}.loot-row{background:#a8812a09;padding:14px 10px;font-family:var(--serif);font-size:18px}.practice-table th{color:#cfb583}.practice-table td{border-color:#634a2a}.practice-table tbody tr:nth-child(odd){background:#b7955110}.practice-table strong{font:17px var(--serif)}.practice-tabs [aria-pressed=true]{background:#4b2c17}.practice-table small{color:#baa381}
.game-modal[data-panel=score] #panel-content{background:#c6ae7e var(--paper) center / 600px;color:#39291a;--muted:#695338;--line:#8b6b3e66;box-shadow:inset 0 0 30px #65451b55}.game-modal[data-panel=score] h3{color:#52381c;text-shadow:none;border-bottom:1px solid #76502c55;padding-bottom:8px}.modal-vital{background:#f4ddab40;border:1px solid #8c693d;border-top:3px double #8c693d;border-radius:0;box-shadow:0 2px 5px #60441b22}.modal-vital strong{font:25px var(--serif);color:#4a2c1c}.modal-vital:first-child strong{color:#792b21}.modal-vital:nth-child(2) strong{color:#294b72}.modal-vital:nth-child(3) strong{color:#465527}.score-grid dd{font-weight:600}.attribute-text{background:#68401b0f;border:1px solid #87653655;border-radius:0;color:#422d1c}
.game{grid-template-rows:minmax(520px,calc(100dvh - 122px - var(--console-height))) var(--console-height)}
@media(min-width:1600px){.game{grid-template-columns:minmax(0,1fr) 340px}}
@media(max-width:900px){.game{grid-template-columns:minmax(0,1fr) 255px;gap:7px;padding:8px}.topbar{padding:0 12px;height:84px}.brand{font-size:17px}.sidebar>section,.sidebar>.possessions{border-width:12px;padding:12px 8px}.journal{border-width:14px}.login-note{border-width:15px;padding:12px;max-width:290px;left:12px}.quick-actions span{display:none}.camera-bar>span{max-width:45%;line-height:1.6}.selected{border-width:14px}}
@media(max-width:620px){.topbar{height:78px;border-width:10px;padding:0 8px}.brand{font-size:14px;gap:10px}.game{padding:6px;gap:8px}.world{border-width:9px;min-height:470px}.room-heading{left:12px;top:12px}.sidebar{gap:7px}.sidebar>section,.sidebar>.possessions{margin-bottom:0;border-width:10px;padding:12px 8px}.sidebar .character{border-right:10px solid transparent}.character-name{gap:8px}.portrait{width:36px;height:42px;font-size:24px}.character-name h2{font-size:20px}#exits{grid-template-columns:1fr}.journal{border-width:12px}.journal-heading{padding:0 5px}.journal-heading h2{font-size:21px}.journal-heading>span{font-size:11px}.quick-actions{gap:5px}.quick-actions button{padding:4px 7px}#log{padding:10px 8px}.game-modal{border-width:14px;max-height:94dvh;width:calc(100vw - 12px)}.game-modal>header,.game-modal #panel-content{padding:16px 12px}.game-modal h2{font-size:27px}.game-modal>footer{padding:12px;gap:8px;font-size:11px}.game-modal>footer button{white-space:normal}.modal-vital{padding:10px 6px}.modal-vital strong{font-size:18px}.modal-vital small{font-size:11px}.score-grid dt,.score-grid dd{font-size:14px}.game-modal:has(.practice-table){width:calc(100vw - 12px)}}

/* Always-visible resource dock; reserve its space below the command console. */
body{padding-bottom:150px}
.orb-dock{position:fixed;z-index:8;bottom:0;left:50%;transform:translateX(-50%);display:flex;justify-content:center;align-items:end;gap:42px;padding:10px 44px 8px;border:12px solid transparent;border-image:var(--frame) 12.5% fill / 1 / 0 stretch;background:#19120d;box-shadow:0 -6px 28px #0009;max-width:calc(100vw - 16px)}
.resource-orb{--liquid-light:#f35741;--liquid:#ad1e20;--liquid-dark:#3b030b;display:flex;flex-direction:column;align-items:center;gap:7px}
.resource-orb.magic{--liquid-light:#6dbdfb;--liquid:#226dcd;--liquid-dark:#071636}
.resource-orb.stamina{--liquid-light:#d4da70;--liquid:#829432;--liquid-dark:#1d2c0b}
.orb-glass{position:relative;width:100px;height:100px;border:6px ridge #ad874b;border-radius:50%;overflow:hidden;background:radial-gradient(circle at 45% 35%,#302b28,#080606 75%);box-shadow:0 0 0 3px #211509,0 0 0 5px #79603a,0 4px 14px #000,inset 0 0 15px #000;isolation:isolate}
.orb-liquid{position:absolute;bottom:0;left:0;width:100%;height:0;transition:height .6s ease;background:radial-gradient(ellipse at 40% 15%,var(--liquid-light),transparent 70%),linear-gradient(var(--liquid),var(--liquid-dark));box-shadow:inset 0 3px 3px #ffffff70,inset 0 -7px 12px #0005}
.orb-glass::after{content:'';position:absolute;inset:0;border-radius:50%;pointer-events:none;background:radial-gradient(ellipse at 31% 21%,#fff9,transparent 13%),radial-gradient(ellipse at 40% 25%,#ffffff25,transparent 45%);box-shadow:inset -8px -9px 13px #0009,inset 3px 3px 8px #ffe9c533;z-index:1}
.orb-value{position:absolute;inset:0;display:grid;place-items:center;padding-top:16px;color:#fff3d9;font:700 13px Georgia,serif;text-shadow:0 1px 3px #000,0 0 5px #000,1px 0 #000;z-index:2;font-variant-numeric:tabular-nums;white-space:nowrap}
.orb-label{font:600 13px var(--serif);color:#ecd4a3;text-shadow:0 2px 2px #000;white-space:nowrap}.orb-label small{font:9px Arial,sans-serif;color:#bca477;margin-left:3px}
@media(max-width:620px){body{padding-bottom:126px}.orb-dock{gap:25px;padding:8px 22px 5px;border-width:9px}.orb-glass{width:78px;height:78px;border-width:5px}.orb-value{font-size:11px;padding-top:10px}.orb-label{font-size:11px}.orb-label small{display:none}}
@media(prefers-reduced-motion:reduce){.orb-liquid{transition:none}}
.game-modal .prac-knowledge{color:#eadbbd;background:#09080766;border-color:#87653666;}

/* Class family branches and level-ordered knowledge nodes. */
.game-modal[data-panel=skilltree]{width:min(1080px,calc(100vw - 32px))}
.skilltree-search{width:100%;padding:12px 15px;margin-bottom:18px;background:#100d09;color:#eee0c4;border:1px solid #917344;font:inherit}
/* Branches are carved plaques on a solid backing, never see-through. */
.skilltree{background:#1a140e;border:1px solid #4e3d27;padding:10px 12px 14px;box-shadow:inset 0 2px 12px #0008}
.skilltree-branch{margin:8px 0 8px 12px;padding-left:14px;border-left:1px solid #5a462c}
.skilltree>.skilltree-branch{margin-left:0;padding-left:0;border-left:0}
.skilltree-branch>summary{position:relative;cursor:pointer;list-style:none;padding:11px 38px 11px 15px;color:#e8c98d;background:linear-gradient(#2a2015,#1e160e);border:1px solid #6b5334;border-left:3px solid #8a6c40;font:19px var(--serif);text-transform:capitalize;box-shadow:0 2px 6px #0007,inset 0 1px 0 #ffffff0f}
.skilltree-branch>summary::-webkit-details-marker{display:none}
.skilltree-branch>summary::after{content:'';position:absolute;right:15px;top:50%;margin-top:-3px;border:6px solid transparent}
.skilltree-branch>summary::after{border-top-color:#c8a468;transition:transform .15s;transform-origin:50% 25%}
.skilltree-branch[open]>summary::after{transform:rotate(180deg)}
.skilltree-branch>summary:hover{background:linear-gradient(#342715,#241a10);color:#ffdca8}
.skilltree-branch>summary:focus-visible{outline:2px solid #ffe1a0;outline-offset:-2px}
.skilltree-branch[open]>summary{border-bottom-color:#8a6c40}
.skilltree-branch>summary:before{content:'';position:absolute;left:-15px;top:50%;width:11px;border-top:1px solid #5a462c}
.skilltree>.skilltree-branch>summary:before{display:none}
.skilltree-branch.current-class>summary{color:#ffeec4;border-left-color:#e1bb70;background:linear-gradient(#3a2a16,#241a0f);box-shadow:0 2px 8px #0008,inset 0 1px 0 #ffffff14}
.skilltree-branch>.modal-intro,.skilltree-branch>pre{margin:12px}
/* Cards: solid leather plates, each under its own medallion. */
.skilltree-nodes{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(210px,100%),1fr));gap:54px 12px;padding:56px 12px 16px}
.skilltree-node{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;min-width:0;padding:48px 13px 15px;background:linear-gradient(#272013,#17110a 70%);border:1px solid #6b5334;border-top:2px solid #a3803f;box-shadow:0 5px 14px #0009,inset 0 1px 0 #ffffff0f}
.skilltree-crest{position:absolute;top:-42px;left:50%;transform:translateX(-50%);width:84px;height:84px;border-radius:50%;border:2px solid #a3803f;background:radial-gradient(circle at 50% 32%,#3c2d1a,#0f0b07 72%);box-shadow:0 5px 12px #000a,inset 0 0 14px #000,0 0 0 4px #17110a;display:grid;place-items:center;overflow:hidden}
.skilltree-crest .skill-icon{width:100%;height:100%;object-fit:cover;display:block}
.skilltree-crest.runed{background:radial-gradient(circle at 50% 32%,#40301c,#120d08 72%)}
.skilltree-rune{font:34px var(--serif);color:#e1bb70;text-shadow:0 2px 3px #000}
.skilltree-node strong{font:18px var(--serif);color:#f0dcb0;text-transform:capitalize;line-height:1.25;overflow-wrap:anywhere}
.skilltree-node small{font-size:12px;color:#b9a88a;line-height:1.45}
.skilltree-node code{font-size:11px;overflow-wrap:anywhere;color:#c8b790}
.skilltree-node.learned{border-color:#7d9a63;border-top-color:#a8c98a;background:linear-gradient(#232a16,#14180d 70%)}
.skilltree-node.learned .skilltree-crest{border-color:#a8c98a;box-shadow:0 5px 12px #000a,inset 0 0 14px #000,0 0 0 4px #14180d,0 0 14px #8fbf6a44}
.skilltree-node.learned small:first-of-type{color:#bde09b}
.skilltree-level{width:100%;font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:#f0cf8b;background:#120d08;border:1px solid #6b5334;padding:4px 6px;box-shadow:inset 0 1px 3px #000}
/* The Special branch: the race's bearing, struck as emblems and tokens. */
.skilltree-attune{margin:14px 12px 6px;padding:16px 15px 15px;background:linear-gradient(#271e13,#17110a);border:1px solid #6b5334;border-top:2px solid #a3803f;box-shadow:0 4px 12px #0008,inset 0 1px 0 #ffffff0f}
.skilltree-attune h4{margin:0 0 13px;font:14px var(--serif);letter-spacing:.16em;text-transform:uppercase;color:#e1bb70;text-shadow:0 2px 2px #000}
.skilltree-emblems{display:flex;flex-wrap:wrap;gap:9px}
.skilltree-emblem{position:relative;width:66px;height:74px;display:grid;place-items:center;align-content:center;gap:1px;background:#7a6038;clip-path:polygon(50% 0,100% 18%,100% 82%,50% 100%,0 82%,0 18%);filter:drop-shadow(0 3px 5px #0008)}
.skilltree-emblem:before{content:'';position:absolute;inset:2px;background:linear-gradient(#312616,#140e08);clip-path:inherit}
.skilltree-emblem strong,.skilltree-emblem small{position:relative;z-index:1;line-height:1}
.skilltree-emblem strong{font:19px var(--serif);color:#cbb895}
.skilltree-emblem small{font-size:10px;letter-spacing:.12em;color:#a8977a}
.skilltree-emblem[data-sign=up]{background:#8fbf6a}
.skilltree-emblem[data-sign=up] strong{color:#c8e8ab}
.skilltree-emblem[data-sign=up] small{color:#9cbb85}
.skilltree-emblem[data-sign=down]{background:#b3685a}
.skilltree-emblem[data-sign=down] strong{color:#f2b0a2}
.skilltree-emblem[data-sign=down] small{color:#c0948b}
.skilltree-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.skilltree-tag{display:inline-flex;align-items:baseline;gap:7px;padding:5px 12px;background:#120d08;border:1px solid #6b5334;border-left:3px solid #a3803f;box-shadow:inset 0 1px 3px #000}
.skilltree-tag small{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:#a8977a}
.skilltree-tag strong{font:15px var(--serif);color:#f0dcb0;text-transform:capitalize}
.skilltree-tag.fatigue{border-left-color:#8fbf6a}
.skilltree-group{margin:22px 12px 0;padding-bottom:8px;font:14px var(--serif);letter-spacing:.14em;text-transform:uppercase;color:#c8a468;border-bottom:1px solid #5a462c;text-shadow:0 2px 2px #000}
.skilltree-group+.skilltree-nodes{padding-top:52px}
.skilltree-ribbon{font:13px var(--serif);letter-spacing:.04em;padding:2px 11px;background:#120d08;border:1px solid #6b5334;color:#f0cf8b;box-shadow:inset 0 1px 3px #000}
.skilltree-ribbon[data-sign=up]{border-color:#7d9a63;color:#bde09b}
.skilltree-ribbon[data-sign=down]{border-color:#a46151;color:#f0a99b}
@media(max-width:620px){.skilltree-branch{margin-left:3px;padding-left:7px}.skilltree-nodes{padding:52px 8px 12px;grid-template-columns:1fr}.skilltree-branch>summary{font-size:17px}.skilltree-attune,.skilltree-group{margin-left:6px;margin-right:6px}.skilltree-emblem{width:58px;height:66px}}

.skilltree-summary-portrait{width:48px;height:48px;object-fit:cover;vertical-align:middle;margin:-6px 12px -6px 0;border:1px solid #9a7949;border-radius:3px}
.skilltree-branch>summary:has(.skilltree-summary-portrait){display:flex;align-items:center;min-height:62px;line-height:1.35}
.skilltree-gender-portraits{display:flex;gap:18px;padding:16px;flex-wrap:wrap}
.skilltree-gender-portraits figure{margin:0;width:min(160px,40%);background:#17110b;border:1px solid #806340;padding:5px;box-shadow:0 4px 14px #0006}
.skilltree-gender-portraits .player-art-thumb{width:100%;height:auto;aspect-ratio:1;object-fit:cover;display:block}
.skilltree-gender-portraits figcaption{padding:8px 0;text-align:center;color:#e1bb70;font:16px var(--serif)}
.skilltree-gender-portraits .your-portrait{border-color:#e9c579;box-shadow:0 0 12px #cfab4944}
.portrait-unavailable{background:radial-gradient(circle at 50% 35%,#3a2c1a,#17110b 72%);object-fit:contain;padding:22%;opacity:.75}

/* Artifacts: the registry read out of masters/artifact.o, graded by rarity. */
.game-modal[data-panel=artifacts]{width:min(1120px,calc(100vw - 32px))}
.artifact-controls{display:flex;flex-direction:column;gap:10px;margin-bottom:6px}
.artifact-controls .skilltree-search{margin:0}
.artifact-count{margin:0 0 4px;color:#a8977a;font-size:12px;letter-spacing:.06em;text-transform:uppercase}
.artifact-grade{margin:22px 0 10px;padding-bottom:7px;border-bottom:1px solid #84683e;font:19px var(--serif);letter-spacing:.14em;text-transform:uppercase}
.artifact-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(320px,100%),1fr));gap:12px;align-items:stretch}
.artifact-card{--rarity:#b8a88c;background:linear-gradient(#1d1710,#15110c);border:1px solid #5f4931;border-top:3px solid var(--rarity);box-shadow:0 4px 12px #0007;min-width:0}
.artifact-card[data-rarity=unique]{--rarity:#e8c46a;box-shadow:0 4px 16px #0008,0 0 0 1px #e8c46a26}
.artifact-card[data-rarity="very rare"]{--rarity:#c08ade}
.artifact-card[data-rarity=rare]{--rarity:#7fabe0}
.artifact-card[data-rarity=uncommon]{--rarity:#8fbf79}
.artifact-card[data-rarity=common]{--rarity:#b8a88c}
.artifact-card[data-missing]{--rarity:#8a6f5a;border-style:dashed;opacity:.72}
.artifact-card[open]{grid-column:1/-1;background:linear-gradient(#221b13,#16120d)}
.artifact-card>summary{display:flex;gap:13px;align-items:flex-start;padding:13px;cursor:pointer;list-style:none}
.artifact-card>summary::-webkit-details-marker{display:none}
.artifact-card>summary:hover{background:#c9a05e0d}
.artifact-card>summary:focus-visible{outline:2px solid #ffe1a0;outline-offset:-2px}
.artifact-icon{width:46px;height:46px;flex-shrink:0;border:1px solid var(--rarity);background:#0f0c08;box-shadow:inset 0 0 10px #000}
.artifact-head{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}
.artifact-head strong{font:19px var(--serif);color:#f0dcb0;text-transform:capitalize;line-height:1.2}
.artifact-head em{color:#bda880;font-size:13px;font-style:italic}
.artifact-line{color:#cdbb99;font-size:13px;line-height:1.45}
.artifact-chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:3px}
.artifact-chip{font-size:11px;padding:2px 7px;border:1px solid #6d5638;background:#100d09;color:#cdb98f;letter-spacing:.03em}
.artifact-chip.stat{border-color:#a3803f;color:#f0cf8b}
.artifact-chip.resist{border-color:#4f6e92;color:#a9c9e9}
.artifact-chip.effect{border-color:#5d7e4c;color:#b8d9a3}
.artifact-chip.requires{border-color:#8c6a3c;background:#241a10;color:#e8c98d;letter-spacing:.05em}
.artifact-lore{color:#e7d6b0;font:16px/1.6 var(--serif)}
.artifact-lore:first-letter{font-size:24px;color:var(--rarity)}
.artifact-rank{display:flex;flex-direction:column;align-items:flex-end;gap:3px;flex-shrink:0;text-align:right}
.artifact-rarity{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--rarity)}
.artifact-rank small{color:#9d8c72;font-size:11px;white-space:nowrap}
.artifact-body{padding:0 14px 16px;border-top:1px solid #4f3d27}
.artifact-body h4{margin:18px 0 8px;font:15px var(--serif);color:#e1bb70;letter-spacing:.1em;text-transform:uppercase}
.artifact-text{margin:12px 0 0;color:#ddcda9;line-height:1.55;white-space:pre-line}
.artifact-text.muted{color:#ab9b7f;font-size:13px;font-style:italic}
.artifact-facts{display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:10px 16px;margin:15px 0 0}
.artifact-fact{min-width:0}
.artifact-facts dt{color:#9d8c72;font-size:11px;letter-spacing:.08em;text-transform:uppercase}
.artifact-facts dd{margin:1px 0 0;color:#e6d5b2;font:15px var(--serif);text-transform:capitalize}
.artifact-sources{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.artifact-sources li{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;padding:9px 11px;background:#b7955110;border-left:2px solid var(--rarity)}
.artifact-sources strong{font:16px var(--serif);color:#ecd9b2}
.artifact-sources strong::first-letter{text-transform:uppercase}
.artifact-where{color:#c3a97c;font-size:12px;text-transform:capitalize}
.artifact-sources small{color:#9d8c72;font-size:11px;flex-basis:100%}
.artifact-file{display:block;margin-top:14px;color:#87755b;font-size:11px;overflow-wrap:anywhere}
@media(max-width:620px){.artifact-grid{grid-template-columns:1fr}.artifact-card>summary{flex-wrap:wrap;padding:11px}.artifact-rank{flex-direction:row;align-items:baseline;gap:8px;width:100%}.artifact-icon{width:38px;height:38px}}

/* Connection lamp: a lit, breathing sigil while the world is reachable. */
.status-lamp{width:11px;height:11px;border-radius:50%;flex-shrink:0;background:#5c4a33;border:1px solid #2b2119;box-shadow:inset 0 1px 1px #0008}
.status-lamp[data-state=connecting]{background:#d9a441;box-shadow:0 0 7px #d9a44188,inset 0 1px 1px #0006;animation:lamp-breathe 1s ease-in-out infinite}
.status-lamp[data-state=online]{background:radial-gradient(circle at 35% 30%,#b6ffb0,#3fae42 60%,#1d6b26);border-color:#2f7a33;box-shadow:0 0 8px #56d45f99,inset 0 1px 2px #ffffff44;animation:lamp-pulse 2.2s ease-in-out infinite}
@keyframes lamp-pulse{0%,100%{box-shadow:0 0 5px #56d45f66,inset 0 1px 2px #ffffff44}50%{box-shadow:0 0 13px #6cf078,0 0 22px #56d45f55,inset 0 1px 2px #ffffff55}}
@keyframes lamp-breathe{0%,100%{opacity:.55}50%{opacity:1}}
@media(prefers-reduced-motion:reduce){.status-lamp{animation:none!important}}
#who-online{border:6px solid transparent;border-image:var(--button) 12.5% fill / 1 / 0 stretch;background:#321b14;padding:3px 9px;color:#e9d4ab;font-size:13px}

/* The roll call. */
.game-modal[data-panel=who]{width:min(820px,calc(100vw - 32px))}
.who-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(250px,100%),1fr));gap:10px;margin:16px 0 4px}
.who-card{display:flex;gap:12px;align-items:center;padding:12px;background:linear-gradient(#1d1710,#15110c);border:1px solid #5f4931;border-left:3px solid #8a6c40;box-shadow:0 3px 9px #0006;min-width:0}
.who-card.who-me{border-left-color:#e1bb70;background:linear-gradient(#241c12,#17120d)}
.who-card.who-immortal{border-left-color:#c08ade}
.who-sigil{flex-shrink:0;width:40px;height:40px;display:grid;place-items:center;border-radius:50%;border:2px ridge #a48450;background:radial-gradient(circle,#514429,#17110c);color:#f0d193;font:20px var(--serif);box-shadow:inset 0 0 8px #000}
.who-body{min-width:0;display:flex;flex-direction:column;gap:3px}
.who-body strong{font:18px var(--serif);color:#f0dcb0;text-transform:capitalize;line-height:1.2}
.who-title{color:#bda880;font-size:13px;line-height:1.4}
.who-marks{display:flex;flex-wrap:wrap;gap:5px;margin-top:2px}
.who-mark{font-size:10px;letter-spacing:.08em;text-transform:uppercase;padding:2px 6px;border:1px solid #6d5638;color:#cdb98f;background:#100d09}
.who-mark.me{border-color:#a3803f;color:#f0cf8b}
.who-mark.afk{border-color:#6b5a45;color:#a3906f;font-style:italic}
.who-mark.rank{border-color:#7d5a91;color:#d6b4e8}
.who-notes{margin:16px 0 0;color:#a8977a;font-size:12px;letter-spacing:.05em;text-transform:uppercase}
.who-refresh{margin-top:18px}
.quick-actions .sos-action{color:#fff0c8;text-shadow:0 0 6px #efc87566;box-shadow:0 0 7px #dfb46a26}