:root{color-scheme:dark;--bg:#101718;--panel:#192224;--line:#2b383a;--text:#eaf1ec;--muted:#9bafac;--accent:#9dedc8}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:15px/1.6 system-ui,-apple-system,Segoe UI,sans-serif;display:grid;grid-template-columns:290px 1fr}
body.standalone{display:block}body>main:only-child{grid-column:1/-1;max-width:1050px;margin:0 auto}
body.standalone header{margin:28px 0}body.standalone h1{font-size:clamp(28px,5vw,48px)}
body.standalone .upload{display:inline-block;margin:10px 0;text-decoration:none}body.standalone code{overflow-wrap:anywhere}
.map-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-bottom:10px}.map-toolbar button{margin:0;padding:7px 12px}
#map{touch-action:none;cursor:grab}#map:active{cursor:grabbing}
#map-icon-size{width:100%;margin:0 0 10px;padding:0;accent-color:var(--accent)}
#map line,#map polyline{vector-effect:non-scaling-stroke}
.npc-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:12px}.npc-card{padding:15px;border:1px solid var(--line);border-radius:8px;background:#121b1d}.npc-card>a:not(.entity){font-size:12px}
.npc-card input{width:100%;margin-top:8px}.npc-card details button{margin-top:8px;padding:6px 10px}.npc-tooltip-photo{display:block;max-width:100%;max-height:150px;margin-top:10px;object-fit:contain;border-radius:5px}
aside{padding:32px 25px;background:#141d1e;border-right:1px solid var(--line);min-height:100vh}main{padding:35px clamp(20px,4vw,65px);max-width:1550px;width:100%}
a{color:var(--accent)}.brand{display:flex;gap:12px;align-items:center;font-size:23px;font-weight:750;text-decoration:none;letter-spacing:-.8px}.mark{display:grid;place-items:center;border:1px solid var(--accent);border-radius:12px;width:42px;height:42px;color:var(--accent)}
.eyebrow{font-size:10px;font-weight:750;letter-spacing:2px;color:var(--accent);margin:0 0 8px}aside .eyebrow{margin-top:52px}
h1{font-size:25px;line-height:1.35;letter-spacing:-.7px}h2{font-size:clamp(23px,2.4vw,34px);line-height:1.2;margin:4px 0 16px;letter-spacing:-1px}h3{font-size:20px;line-height:1.2;margin:0}
.muted{color:var(--muted)}.tiny,small{font-size:12px;color:var(--muted)}label{display:block;margin:17px 0 6px;font-size:12px;font-weight:650}
button,input,select{font:inherit}input,select{background:#11191a;border:1px solid #405052;color:var(--text);padding:10px;border-radius:7px;min-width:0}aside input,aside select,aside button{width:100%}
button,.upload{background:var(--accent);color:#11251d;font-weight:700;padding:11px 14px;border:0;border-radius:7px;cursor:pointer;text-align:center}button{margin-top:18px}.upload{margin-top:28px}.upload input{display:block;margin-top:8px;font-size:10px;background:transparent;color:#11251d;max-width:100%}.upload input::file-selector-button{display:none}
:focus-visible{outline:3px solid #f8cf87;outline-offset:4px}.side-footer{margin-top:45px;font-size:12px}.dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--accent);margin-right:7px}
header,.panel-heading{display:flex;justify-content:space-between;align-items:center;gap:16px}.badge{white-space:nowrap;border:1px solid #405052;border-radius:20px;padding:5px 10px;font-size:10px;letter-spacing:.6px;color:var(--muted)}
#notice{background:#1a2e29;border-left:3px solid var(--accent);padding:12px 16px;font-size:13px;color:#cde5da;margin:20px 0 26px}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:24px}.cards article{border:1px solid var(--line);border-radius:12px;padding:18px;background:linear-gradient(130deg,#22302e,#192224)}.cards span{font-size:11px;color:var(--muted)}.cards strong{display:block;font-size:29px;letter-spacing:-1px;margin:10px 0 4px;font-weight:550;color:var(--accent)}.cards small{display:block;font-size:10px}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:24px;margin-bottom:22px}.panel-heading{margin-bottom:22px}.columns{display:grid;grid-template-columns:1.15fr 1fr;gap:22px}.columns .panel{min-width:0}#scrub{width:100%;padding:0;accent-color:var(--accent)}.range-labels{display:flex;justify-content:space-between;font-size:11px;color:var(--muted)}
#map{width:100%;background:#101c1d;border:1px solid var(--line);border-radius:8px}#map line{stroke:#263638;stroke-width:1}#map polyline{stroke:#6fba9a;stroke-width:2;fill:none}#map circle{fill:#a1f0ca;stroke:#182822;stroke-width:2}
.gear{display:grid;grid-template-columns:1fr 1fr;gap:6px;max-height:230px;overflow:auto}.gear div{background:#111b1c;border:1px solid #2b393a;border-radius:6px;padding:6px 9px;font-size:11px}.gear span{color:var(--muted);display:block}
details{margin-top:18px;font-size:12px}summary{cursor:pointer;color:var(--accent)}pre{white-space:pre-wrap;max-height:200px;overflow:auto;color:var(--muted);font:12px/1.7 system-ui}
.table-wrap{overflow:auto;max-height:450px}table{width:100%;border-collapse:collapse;font-size:12px;text-align:left}th{color:var(--muted);font-weight:500;position:sticky;top:0;background:var(--panel)}td,th{padding:12px 10px;border-bottom:1px solid var(--line)}td:first-child{white-space:nowrap;color:var(--muted)}.positive{color:var(--accent)}.negative{color:#f6aaa0}footer{font-size:11px;color:var(--muted);margin:20px 0}
@media(max-width:1100px){.cards{grid-template-columns:1fr 1fr}.columns{grid-template-columns:1fr}header{align-items:start;flex-direction:column}}
@media(max-width:720px){body{display:block}aside{min-height:auto;border-right:0;border-bottom:1px solid var(--line)}aside h1,aside .muted,aside .eyebrow{display:none}.side-footer{margin-top:15px}main{padding:24px 16px}.panel{padding:18px}.cards article{padding:12px}.cards strong{font-size:25px}.panel-heading{flex-wrap:wrap}}
.entity{display:inline-flex;align-items:center;gap:8px;min-height:36px;text-decoration:none;overflow-wrap:anywhere}.entity:hover{text-decoration:underline}.entity img{width:32px;height:32px;border:1px solid #678174;border-radius:5px}.quality-2{color:#78de73}.quality-3{color:#73b8ff}.quality-4{color:#cf9cff}.quality-5{color:#ffb36d}.spell-list{display:grid;gap:6px;max-height:250px;overflow:auto}.portrait-row{display:flex;align-items:center;gap:16px;margin:16px 0}.portrait-row img{width:110px;height:145px;object-fit:contain;border-radius:12px;background:#111b1c}.portrait-row>div{min-width:0}.portrait-row input{max-width:100%}.portrait-row button{font-size:11px;padding:6px;margin:5px 0}.media-setting{display:flex;align-items:center;gap:8px;margin-top:20px}.media-setting input{width:auto}#map line{stroke-opacity:.3}#map polyline{stroke:#ffdf72;stroke-width:3}#map circle{fill:#fff3a3;stroke:#121b22;stroke-width:3}
/* FellowTrail: original CSS ornamentation, no borrowed game UI artwork. */
:root{--accent:#e0bc73;--muted:#b4b0a1;--line:#464437;--panel:#1b2325}
body{background:radial-gradient(ellipse at 85% 0%,#33443d 0,transparent 42%),#101719;color:#ece6d6}
aside{background:linear-gradient(175deg,#202b29,#111818);border-right:1px solid #6e5c3b}
.brand{font-family:Georgia,serif;font-size:28px;letter-spacing:1px;color:#eed6a2}.mark{background:transparent;color:#e9c476;border:1px solid #ac8a4a;transform:rotate(0deg)}
h1,h2,h3{font-family:Georgia,"Times New Roman",serif;font-weight:normal;letter-spacing:.2px}
h2{font-size:clamp(26px,3vw,42px)}header{border-bottom:1px solid #6b5a3c;padding-bottom:24px}
.eyebrow{color:#d5b77c;letter-spacing:2px}.badge{border-color:#675638;color:#e4c990;background:#29291e}
.panel{background:linear-gradient(140deg,#252c2b,#171f22);border:1px solid #62533a;box-shadow:0 8px 24px #0003;position:relative}
.panel:before{content:"";position:absolute;left:14px;top:14px;width:10px;height:10px;border-top:1px solid #ba985c;border-left:1px solid #ba985c;pointer-events:none}
.cards article{background:linear-gradient(135deg,#33392e,#1a2423);border-color:#62583d;box-shadow:inset 0 1px #b69b5533}
.cards strong{color:#f2dba4;font-size:25px}.companion-callout{border:1px solid #71603e;border-radius:8px;background:#d9b56d0b;padding:15px;margin:25px 0;font-size:13px}
button,.upload{background:linear-gradient(#57442a,#3e3020);color:#f7e4be;border:1px solid #a18450}
button:hover{background:#705738}button:disabled{opacity:.55;cursor:wait}input,select{border-color:#5f5744;background:#121b1d}
.coin{display:inline-block;width:14px;height:14px;margin-left:5px;border-radius:50%;vertical-align:-2px;border:1px solid #35210b;box-shadow:inset 0 0 0 2px #ffffff30,1px 1px 2px #0008;background:radial-gradient(circle at 35% 30%,#ffe9a0,#b17b1d)}
.coin.silver{background:radial-gradient(circle at 35% 30%,#eef7fa,#7c8b99);border-color:#4d5763}.coin.copper{background:radial-gradient(circle at 35% 30%,#f7c1a1,#a95831);border-color:#62391e}
.money{display:inline-flex;gap:9px;flex-wrap:wrap;align-items:baseline;font-variant-numeric:tabular-nums}.money>span{white-space:nowrap}.cards small .money{gap:4px}.cards small .coin{width:10px;height:10px;margin-left:2px}
.account{border-top:1px solid var(--line);margin-top:20px}.account button{width:100%;margin:5px 0;padding:8px;font-size:12px}.account p{overflow-wrap:anywhere}.account input,.account select{width:100%}
#account-status{user-select:all;overflow-wrap:anywhere;color:#ecd29b}.account details{margin:12px 0}#devices p{font-size:11px;border-bottom:1px solid var(--line);padding-bottom:8px}
[hidden]{display:none!important}
.entity-icon{display:grid!important;place-items:center;flex:0 0 36px;width:36px;height:36px;border:1px solid #9d8049;border-radius:6px;background:linear-gradient(135deg,#4d4530,#172222);color:#e7c584!important;font-size:23px;overflow:hidden}
.entity .entity-icon img{display:block;width:100%;height:100%;object-fit:cover;border:0;border-radius:0}.entity-name{color:inherit!important}
.movement-controls{margin:12px 0}.movement-controls>label{display:block;margin:8px 0;font-size:12px}.movement-controls input[type=checkbox]{width:auto}.movement-controls input[type=range]{width:100%}.playback-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.playback-row button{margin:0}
#map .movement-trail{stroke-dasharray:7 5;stroke-width:2.5;stroke:#99a4ad}
#map .movement-trail.alive{stroke:#69e6a1}#map .movement-trail.ghost{stroke:#8fdbff}
#map .map-event-symbol{fill:#ffe09b;stroke:#121b22;stroke-width:.5px;font-size:19px;cursor:help}
#map .friend-dot{fill:#aaa;stroke:#111;stroke-width:2}
#map .friend-WARRIOR{fill:#c79c6e}#map .friend-PALADIN{fill:#f58cba}#map .friend-HUNTER{fill:#abd473}#map .friend-ROGUE{fill:#fff569}#map .friend-PRIEST{fill:#fff}#map .friend-DEATHKNIGHT{fill:#c41f3b}#map .friend-SHAMAN{fill:#0070de}#map .friend-MAGE{fill:#69ccf0}#map .friend-WARLOCK{fill:#9482c9}#map .friend-MONK{fill:#00ff96}#map .friend-DRUID{fill:#ff7d0a}#map .friend-DEMONHUNTER{fill:#a330c9}#map .friend-EVOKER{fill:#33937f}
.entity-tooltip{position:fixed;z-index:10000;width:320px;max-width:calc(100vw - 16px);max-height:calc(100vh - 16px);overflow:auto;padding:15px 18px;border:1px solid #c3a05b;border-radius:8px;background:#101822f5;box-shadow:0 8px 30px #000a;color:#f0e7d2;font-size:13px;line-height:1.5;white-space:pre-line}
.entity-tooltip strong{display:block;color:#f3d48e;font-size:15px;margin-bottom:7px}.entity-tooltip small{display:block;color:#a7b3b5;margin-top:12px;font-size:10px}
.attributes{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:14px 0}.attribute{display:grid;grid-template-columns:32px 1fr auto;align-items:center;gap:8px;padding:10px;background:#111c20;border:1px solid #514b39;border-radius:6px;font-size:12px}
.attribute-icon{color:#e8c986;font-size:23px;text-align:center}.attribute strong{font-size:20px;font-variant-numeric:tabular-nums;color:#f2dba4}.attributes>p{grid-column:1/-1;margin:4px 0}
@media(max-width:500px){.attributes{grid-template-columns:1fr}}
