@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@600;700;800&family=Marcellus+SC&display=swap');

:root { color-scheme: dark; }
* { box-sizing: border-box; }
html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; background: #020706; }
body { font-family: "Cinzel", Georgia, serif; }
.game-loader{position:absolute;z-index:1000;inset:0;display:grid;place-content:center;justify-items:center;gap:12px;color:#ead8a5;background:radial-gradient(circle at 50% 42%,#18231f 0,#080d0b 48%,#020403 100%);font-family:Cinzel,serif;letter-spacing:.16em;transition:opacity .3s ease}.game-loader.ready{opacity:0;pointer-events:none}.loader-mark{width:62px;height:62px;display:grid;place-items:center;border:2px solid #af8e49;border-radius:50%;color:#e9c86d;font-size:34px;box-shadow:0 0 28px #b9812d33}.game-loader b{font-size:15px}.game-loader small{color:#8fa297;font:10px Arial,sans-serif;letter-spacing:.05em}.loader-track{width:min(280px,68vw);height:7px;padding:1px;border:1px solid #695a38;background:#050807}.loader-track i{display:block;width:3%;height:100%;background:linear-gradient(90deg,#8b652b,#e4c66c);transition:width .12s ease}

.title-screen { position: relative; width: 100%; height: 100%; min-height: 520px; isolation: isolate; display: grid; place-items: center; }
.backdrop { position: absolute; inset: -2%; z-index: -4; background: url("assets/skeleton-title-bg.png") center 36% / cover no-repeat; animation: breathe 12s ease-in-out infinite alternate; }
.shadow { position: absolute; inset: 0; z-index: -3; background: radial-gradient(ellipse 43% 38% at 50% 57%, transparent 0 48%, #0207062c 70%, #010303b8 100%), linear-gradient(to bottom, #01070618 36%, #02070738 65%, #010302e8 100%); }
.shadow::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, #0008, transparent 18% 82%, #0008), radial-gradient(circle at center, transparent 30%, #00100c26 70%); }
.title-lockup { position: absolute; left: 50%; top: 55%; transform: translate(-50%, -50%); width: min(900px, 92vw); text-align: center; filter: drop-shadow(0 7px 7px #000) drop-shadow(0 0 24px #000); animation: reveal 1.5s cubic-bezier(.2,.8,.2,1) both; }
.eyebrow { margin: 0 0 .6rem; color: #cfa95d; font: 600 clamp(.48rem, 1vw, .72rem)/1 "Marcellus SC", serif; letter-spacing: .62em; text-indent: .62em; opacity: .9; }
h1 { margin: 0; line-height: .72; letter-spacing: .04em; }
h1 span { display: block; }
.floors { font-size: clamp(3.4rem, 9.4vw, 8.8rem); background: linear-gradient(#fffbdc 7%, #ddc98c 39%, #8d6b35 62%, #ddbd69 76%, #5b3d19 100%); -webkit-background-clip: text; color: transparent; -webkit-text-stroke: 1px #2a1708; text-shadow: 0 2px 0 #e9d59333; }
.of { margin: .18em 0 .05em; font-size: clamp(.7rem, 1.35vw, 1.15rem); color: #c49b50; letter-spacing: .7em; text-indent: .7em; }
.targoth { font-size: clamp(2.45rem, 6.4vw, 6.1rem); letter-spacing: .12em; text-indent: .12em; background: linear-gradient(#ead9aa, #ad8241 58%, #6d471d); -webkit-background-clip: text; color: transparent; -webkit-text-stroke: 1px #241509; }
.ornament { display: flex; align-items: center; justify-content: center; gap: 14px; margin: clamp(14px, 2.5vh, 25px) auto 0; color: #b68c45; font-size: 9px; }
.ornament i { width: min(18vw, 135px); height: 1px; background: linear-gradient(90deg, transparent, #c59e56); }
.ornament i:last-child { transform: scaleX(-1); }

.title-actions{position:absolute;z-index:3;left:50%;bottom:max(7vh,calc(env(safe-area-inset-bottom) + 22px));transform:translateX(-50%);display:grid;gap:10px}.title-actions button{position:relative;width:clamp(190px,22vw,280px);height:58px;padding:2px;color:#f6e9c4;background:linear-gradient(110deg,#4b3215,#d5ae62 45%,#533516);border:0;clip-path:polygon(10px 0,calc(100% - 10px) 0,100% 50%,calc(100% - 10px) 100%,10px 100%,0 50%);cursor:pointer;filter:drop-shadow(0 8px 10px #000) drop-shadow(0 0 12px #b8752633);animation:buttonReveal 1.3s .65s cubic-bezier(.2,.8,.2,1) both;transition:filter .2s,transform .2s}.title-actions button::before{content:"";position:absolute;inset:2px;background:linear-gradient(#19241f,#080f0d);clip-path:inherit}.title-actions button::after{content:"";position:absolute;inset:8px 20px;border-top:1px solid #b69154aa;border-bottom:1px solid #5d4628}.title-actions button span{position:relative;z-index:1;font:700 .95rem "Cinzel",serif;letter-spacing:.32em;text-indent:.32em}.title-actions button:hover{filter:drop-shadow(0 8px 12px #000) drop-shadow(0 0 20px #e39d38aa);transform:scale(1.035)}.title-actions button:active{transform:scale(.98)}.title-actions button:focus-visible{outline:2px solid #f6d588;outline-offset:5px}
.fade { position: absolute; inset: 0; z-index: 10; pointer-events: none; background: #020303; opacity: 0; transition: opacity 1s ease; }
.title-screen.leaving .fade { opacity: 1; }
.title-screen.leaving .title-lockup { transform: translate(-50%, -52%) scale(.97); opacity: 0; transition: 1s ease; }
.embers { position: absolute; inset: 0; z-index: -1; pointer-events: none; background-image: radial-gradient(circle, #ffc45c 0 1px, transparent 1.5px), radial-gradient(circle, #d0772f 0 1px, transparent 1.5px); background-size: 97px 113px, 139px 151px; opacity: .2; animation: embers 14s linear infinite; mask-image: linear-gradient(transparent 25%, black); }

@keyframes breathe { from { transform: scale(1.01); filter: brightness(.82) saturate(.9); } to { transform: scale(1.055); filter: brightness(.98) saturate(1.05); } }
@keyframes reveal { from { opacity: 0; transform: translate(-50%, -45%) scale(.92); filter: blur(8px); } to { opacity: 1; transform: translate(-50%, -50%) scale(1); filter: drop-shadow(0 7px 7px #000) drop-shadow(0 0 24px #000); } }
@keyframes buttonReveal { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: translateY(0); } }
@keyframes embers { to { background-position: 30px -160px, -20px -200px; } }

@media (max-aspect-ratio: 3/4) {
  .backdrop { background-position: center 30%; }
  .title-lockup { top: 55%; }
  .eyebrow { letter-spacing: .35em; text-indent: .35em; }
  .title-actions { bottom: max(8vh, calc(env(safe-area-inset-bottom) + 20px)); }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; } }

/* Premium character equipment and backpack screen */
.dialog.inventory-dialog{inset:50% auto auto 50%;bottom:auto;transform:translate(-50%,-50%);width:min(1120px,95vw);max-height:min(760px,92vh);padding:0;overflow:auto;text-align:left;background:linear-gradient(135deg,#0b1211f7,#050807fa);border:2px solid #9b7a3d;box-shadow:0 24px 70px #000,inset 0 0 80px #23443b28;text-shadow:1px 2px #000}
.inventory-dialog:before,.inventory-dialog:after{content:"";position:absolute;z-index:4;width:70px;height:70px;pointer-events:none;border-color:#d1b164}.inventory-dialog:before{left:7px;top:7px;border-left:3px double;border-top:3px double}.inventory-dialog:after{right:7px;bottom:7px;border-right:3px double;border-bottom:3px double}
.inventory-title{height:50px;display:grid;grid-template-columns:1fr 1fr;align-items:center;text-align:center;color:#f3dfaa;background:linear-gradient(#2a281d,#0b100e);border-bottom:1px solid #b18a45;font:700 15px Cinzel,serif;letter-spacing:.13em}.inventory-title span{border-right:1px solid #715c35}.inventory-title b{font:inherit}
.inventory-shell{display:grid;grid-template-columns:1fr 1fr;min-height:520px}.paperdoll,.backpack-panel{position:relative;padding:18px}.paperdoll{border-right:1px solid #735d34;background:radial-gradient(ellipse at center,#30443d 0,#151c19 43%,#080c0b 76%)}
.paperdoll:after{content:"";position:absolute;inset:10px;pointer-events:none;border:1px solid #75633f55;clip-path:polygon(0 0,32% 0,32% 1px,68% 1px,68% 0,100% 0,100% 100%,68% 100%,68% calc(100% - 1px),32% calc(100% - 1px),32% 100%,0 100%)}
.hero-card{position:absolute;left:50%;top:50%;transform:translate(-50%,-54%);width:225px;text-align:center}.hero-card canvas{display:block;width:220px;height:250px;filter:drop-shadow(0 13px 8px #000)}.hero-card strong,.hero-card small{display:block}.hero-card strong{color:#f3dfa5;font:700 17px Cinzel,serif}.hero-card small{margin-top:3px;color:#719f98;font-size:9px;letter-spacing:.12em}
.inventory-dialog .equipment-slots{position:absolute;inset:15px;z-index:2}.inventory-dialog .gear-slot{position:absolute;width:118px;min-height:82px;padding:7px;border:2px solid #8e713b;background:linear-gradient(145deg,#222b28,#0b100f);box-shadow:inset 0 0 0 2px #17110a,inset 0 0 12px #000,0 4px 12px #0008}.inventory-dialog .gear-slot:nth-child(1){left:15px;top:82px}.inventory-dialog .gear-slot:nth-child(2){right:15px;top:35px}.inventory-dialog .gear-slot:nth-child(3){right:8px;top:157px}.inventory-dialog .gear-slot:nth-child(4){right:20px;top:279px}.inventory-dialog .gear-slot:nth-child(5){left:32px;top:306px}.inventory-dialog .gear-slot i{display:grid;place-items:center;width:35px;height:35px;margin:0 auto 4px;color:#d8e8e7;background:radial-gradient(#35566a,#111a1c);border:1px solid #c5a45b;font:normal 20px Georgia}.inventory-dialog .gear-slot span,.inventory-dialog .gear-slot b,.inventory-dialog .gear-slot em{display:block;text-align:center}.inventory-dialog .gear-slot span{color:#806f52;font-size:7px;letter-spacing:.17em}.inventory-dialog .gear-slot b{overflow:hidden;color:#e6d4a8;font-size:9px;text-overflow:ellipsis;white-space:nowrap}.inventory-dialog .gear-slot em{margin-top:3px;color:#d49a4b;font:normal 7px Arial}.inventory-dialog .gear-slot:disabled{opacity:.68}.inventory-dialog .gear-slot.filled{border-color:#c9a65b;box-shadow:inset 0 0 14px #35687d55,0 0 11px #b88d3940}
.gear-stats{position:absolute;left:50%;bottom:16px;z-index:3;transform:translateX(-50%);display:grid;grid-template-columns:repeat(4,1fr);width:calc(100% - 35px);background:#050807dc;border:1px solid #715d38}.gear-stats span{padding:8px 4px;text-align:center;color:#75847e;font-size:7px;border-right:1px solid #3a4038}.gear-stats span:last-child{border:0}.gear-stats b{display:block;color:#e7d59f;font:700 13px Cinzel,serif}
.backpack-panel{padding:28px 25px;background:linear-gradient(145deg,#151712,#090c0a)}.bag-summary{display:flex;justify-content:space-between;margin-bottom:13px;padding:9px 12px;color:#7f8d83;background:#070a09;border:1px solid #524d38;font-size:9px;letter-spacing:.1em}.bag-summary b{color:#e4c771}.inventory-dialog .inventory-items{display:grid;grid-template-columns:repeat(6,1fr);gap:3px;padding:5px;background:#987b42;border:2px solid #d1af63;box-shadow:inset 0 0 0 2px #20170d,0 7px 18px #000}.inventory-dialog .bag-cell{position:relative;aspect-ratio:1;min-width:0;padding:3px;overflow:hidden;color:#cfd7d4;background:linear-gradient(145deg,#29322f,#111614);border:1px solid #45514c;box-shadow:inset 0 0 12px #000}.inventory-dialog .bag-cell.empty{display:block;background:linear-gradient(145deg,#252b29,#121615);border:1px solid #3e4743}.inventory-dialog .bag-cell i{display:grid;place-items:center;height:50%;color:#b9d9e5;font:normal clamp(16px,2.3vw,27px) Georgia;text-shadow:0 0 8px #5bb0dc}.inventory-dialog .bag-cell b{display:block;overflow:hidden;color:#e7d5a7;font-size:7px;text-align:center;text-overflow:ellipsis;white-space:nowrap}.inventory-dialog .bag-cell small{display:block;margin:2px 0 0;color:#72a4ae;font-size:6px;text-align:center}.inventory-dialog .bag-cell em{position:absolute;right:2px;bottom:1px;display:grid;place-items:center;width:14px;height:14px;color:#f4dc96;background:#15110a;border:1px solid #8d743f;border-radius:50%;font:normal 7px Arial}.inventory-dialog .bag-cell.equipped{border-color:#e4b650;box-shadow:inset 0 0 15px #976d18,0 0 8px #d8a536}.inventory-dialog .bag-cell.locked{filter:grayscale(.7);opacity:.55}.backpack-panel>p{margin:15px 5px 0!important;color:#718077!important;text-align:center;font-size:9px!important}.inventory-dialog .inventory-close{position:absolute;z-index:8;right:8px;top:7px;width:36px;height:36px;margin:0;padding:0;color:#ecd9a4;background:linear-gradient(#3d3526,#16140f);border:1px solid #c6a35b;font:26px/1 Georgia}
@media(max-width:760px){.dialog.inventory-dialog{width:96vw;max-height:94vh}.inventory-title{height:38px;font-size:10px}.inventory-shell{min-height:420px}.paperdoll,.backpack-panel{padding:8px}.hero-card{transform:translate(-50%,-58%) scale(.7)}.inventory-dialog .gear-slot{width:76px;min-height:65px;padding:4px}.inventory-dialog .gear-slot:nth-child(1){left:4px;top:60px}.inventory-dialog .gear-slot:nth-child(2){right:3px;top:25px}.inventory-dialog .gear-slot:nth-child(3){right:0;top:113px}.inventory-dialog .gear-slot:nth-child(4){right:6px;top:201px}.inventory-dialog .gear-slot:nth-child(5){left:8px;top:236px}.inventory-dialog .gear-slot i{width:25px;height:25px;font-size:14px}.inventory-dialog .gear-slot b{font-size:7px}.gear-stats{grid-template-columns:repeat(2,1fr);bottom:7px}.gear-stats span{padding:4px}.backpack-panel{padding:20px 10px 10px}.inventory-dialog .inventory-items{grid-template-columns:repeat(4,1fr)}.inventory-dialog .bag-cell:nth-child(n+17){display:none}.inventory-dialog .inventory-close{width:29px;height:29px;font-size:20px}.inventory-dialog .bag-cell i{font-size:16px}}
@media(max-width:520px) and (orientation:portrait){.inventory-shell{grid-template-columns:1fr}.paperdoll{min-height:390px;border-right:0;border-bottom:1px solid #735d34}.backpack-panel{min-height:300px}.inventory-title{grid-template-columns:1fr}.inventory-title b{display:none}.dialog.inventory-dialog{max-height:96vh}.inventory-dialog .inventory-items{grid-template-columns:repeat(6,1fr)}.inventory-dialog .bag-cell:nth-child(n){display:block}}
.inventory-dialog .inventory-items{max-height:none;overflow:visible}
.dialog.inventory-dialog .inventory-close{width:36px;margin:0;padding:0}
@media(max-width:760px){.dialog.inventory-dialog .inventory-close{width:29px}}
#game-screen:has(.inventory-dialog:not(.hidden)) .quickbar,#game-screen:has(.inventory-dialog:not(.hidden)) .skillbar,#game-screen:has(.inventory-dialog:not(.hidden)) #hint{opacity:0;pointer-events:none}
.dialog.skill-master-dialog{inset:50% auto auto 50%;bottom:auto;transform:translate(-50%,-50%);width:min(760px,94vw);max-height:88vh;overflow:auto;padding:20px;background:radial-gradient(circle at 20% 0,#24332d,#080d0b 58%);border:2px solid #a98645;text-align:left}.skill-training-title{display:flex;align-items:center;gap:13px;padding-bottom:13px;border-bottom:1px solid #695938}.skill-training-title>span{display:grid;place-items:center;width:52px;height:52px;color:#f2d780;background:#111a17;border:2px solid #b28c46;font-size:27px}.skill-training-title h3,.skill-training-title p{margin:0!important}.skill-training-title p{color:#bc9b57!important;font-size:9px!important;letter-spacing:.1em}.skill-training-list{display:grid;gap:9px;margin-top:14px}.skill-training-card{display:grid;grid-template-columns:58px 1fr 92px;align-items:center;gap:12px;padding:12px;background:linear-gradient(110deg,#17231f,#0b100e);border:1px solid #76623c;box-shadow:inset 0 0 18px #0008}.skill-training-card.locked{filter:saturate(.65);border-color:#4d554b}.skill-training-card.mastered{border-color:#c4a354}.skill-training-icon{display:grid;place-items:center;width:54px;height:54px;color:#f5df98;background:radial-gradient(#314d45,#0b1210);border:2px solid #a88749;font-size:25px;box-shadow:inset 0 0 14px #000,0 0 10px #76e6d329}.skill-training-card h4{margin:0;color:#efdb9f;font:700 14px Cinzel,serif}.skill-training-card p{margin:3px 0!important;color:#8fa49a!important;font-size:9px!important}.skill-training-card strong,.skill-training-card small,.skill-training-card em{display:block}.skill-training-card strong{color:#e3c06a;font-size:10px}.skill-training-card small{margin-top:3px;color:#b8c5bb;font-size:8px}.skill-training-card em{margin-top:4px;color:#73d28d;font:normal 8px Arial}.skill-training-card.locked em{color:#e07d69}.skill-training-card button{min-height:46px;color:#fff0bb;background:linear-gradient(#5b4624,#21190f);border-color:#c49b51;font:700 9px Cinzel,serif}.skill-training-card button:disabled{color:#747c73;background:#111613;border-color:#3c4841}.skill-training-note{text-align:center}.dialog.skill-master-dialog .close{text-align:center}@media(max-width:620px){.dialog.skill-master-dialog{padding:12px}.skill-training-card{grid-template-columns:43px 1fr;padding:9px;gap:8px}.skill-training-icon{width:40px;height:40px;font-size:20px}.skill-training-card>button{grid-column:1/-1;width:100%;min-height:34px}.skill-training-card h4{font-size:12px}.skill-training-card small{font-size:7px}}
.inventory-dialog canvas.item-art{display:block;width:45px;height:45px;margin:0 auto 3px;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 2px 3px #000)}
.inventory-dialog .gear-slot canvas.item-art{width:38px;height:38px;background:radial-gradient(#35566a,#111a1c);border:1px solid #c5a45b}
.inventory-dialog .bag-cell canvas.item-art{width:100%;height:58%;margin:0;filter:drop-shadow(0 2px 4px #000) drop-shadow(0 0 3px #39799b)}
.inventory-dialog .rarity-common b{color:#f0eee7}.inventory-dialog .rarity-green{border-color:#3f9b52!important}.inventory-dialog .rarity-green b{color:#63d36f}.inventory-dialog .rarity-blue{border-color:#438bd0!important}.inventory-dialog .rarity-blue b{color:#62aef4}.inventory-dialog .rarity-gold{border-color:#c99d31!important;box-shadow:inset 0 0 15px #ad751844,0 0 8px #e5bb3944}.inventory-dialog .rarity-gold b{color:#f0c84b}.refining-panel{margin-top:14px;padding:10px;background:#070a09;border:1px solid #655332}.refining-panel h4{margin:0 0 8px;color:#e6c66d;font:11px Cinzel,serif;letter-spacing:.12em}.refining-panel .refine-choice{width:100%;margin:3px 0;padding:7px;background:#151c19;border:1px solid #66583b}.refining-panel .no-refine{margin:4px!important;font-size:8px!important}.inventory-dialog .gear-slot:nth-child(6){left:20px;top:190px}
.dialog.refining-dialog{inset:50% auto auto 50%;bottom:auto;transform:translate(-50%,-50%);width:min(680px,94vw);max-height:88vh;overflow:auto;padding:20px;text-align:left;background:radial-gradient(circle at 20% 0,#38291c,#0b0d0b 62%);border:2px solid #bd8845}.forge-title{display:flex;align-items:center;gap:13px;padding-bottom:12px;border-bottom:1px solid #75512e}.forge-title>span{display:grid;place-items:center;width:54px;height:54px;color:#ffd582;background:#24170f;border:2px solid #bd8845;font-size:27px}.forge-title h3,.forge-title p{margin:0!important}.forge-title p{color:#c49353!important;font-size:9px!important;letter-spacing:.12em}.forge-explanation,.forge-warning{text-align:center}.refining-dialog .refining-panel{display:grid;gap:7px;max-height:53vh;overflow:auto}.refining-dialog .refine-choice{display:grid;grid-template-columns:1fr 22px 1fr;text-align:left}.refining-dialog .refine-choice i{align-self:center;text-align:center;color:#d9a958;font-style:normal}.refining-dialog .refine-choice small,.refining-dialog .refine-choice em{grid-column:1/-1;display:block;margin-top:4px;font-style:normal}.refining-dialog .refine-choice em{color:#d8b969;font-size:8px}.refining-dialog .rarity-green{border-color:#3f9b52}.refining-dialog .rarity-blue{border-color:#438bd0}.refining-dialog .rarity-gold{border-color:#c99d31}.refining-dialog .rarity-green b{color:#63d36f}.refining-dialog .rarity-blue b{color:#62aef4}.refining-dialog .rarity-gold b{color:#f0c84b}.refining-dialog .close{width:100%}@media(max-width:560px){.dialog.refining-dialog{padding:12px}.refining-dialog .refine-choice{grid-template-columns:1fr}.refining-dialog .refine-choice i{display:none}}

.multiplayer-status{position:absolute;z-index:30;top:max(86px,calc(env(safe-area-inset-top) + 74px));left:12px;display:flex;align-items:center;gap:6px;padding:7px 10px;color:#b9c4bc;background:#050807e8;border:1px solid #48564e;border-radius:3px;font:700 8px Arial,sans-serif;letter-spacing:.08em;pointer-events:auto;cursor:pointer;touch-action:manipulation}.multiplayer-status i{width:7px;height:7px;border-radius:50%;background:#8b4139;box-shadow:0 0 7px #8b4139}.multiplayer-status.online{color:#d9e7d8;border-color:#52745a}.multiplayer-status.online i{background:#65d478;box-shadow:0 0 8px #65d478}

.hidden{display:none!important}.screen{position:fixed;inset:0;z-index:20}#create-screen{display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 50% 30%,#18322d 0,#09110f 44%,#020504 100%)}#create-screen:before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.14;background:url("assets/skeleton-title-bg.png") center/cover;filter:blur(3px)}.create-panel{position:relative;z-index:1;pointer-events:auto;width:min(470px,92vw);padding:40px clamp(24px,6vw,52px);text-align:center;color:#ddcfaa;background:linear-gradient(#111b18ef,#070c0bef);border:1px solid #8e713d;box-shadow:0 30px 80px #000,inset 0 0 45px #162f2855;clip-path:polygon(18px 0,calc(100% - 18px) 0,100% 18px,100% calc(100% - 18px),calc(100% - 18px) 100%,18px 100%,0 calc(100% - 18px),0 18px);animation:reveal .8s both}.rune{margin:0 auto 18px;width:58px;height:58px;display:grid;place-items:center;transform:rotate(45deg);border:1px solid #ba9550;color:#e3c779;font-size:27px;box-shadow:0 0 25px #bd7e3055}.kicker{margin:0 0 8px;font-size:9px;letter-spacing:.38em;color:#9e8354}.create-panel h2{margin:0;color:#eee1b9;font-size:clamp(1.6rem,5vw,2.3rem)}.lore{color:#788c83;font:italic 14px Georgia,serif}.create-panel label{display:block;margin:30px 0 8px;text-align:left;color:#9f8657;font-size:9px;letter-spacing:.2em}#character-name{position:relative;z-index:2;display:block;width:100%;padding:15px;border:1px solid #52675f;outline:0;background:#030706;color:#f3e8c6;text-align:center;font:700 17px Cinzel,serif;letter-spacing:.06em;pointer-events:auto;touch-action:manipulation;user-select:text;-webkit-user-select:text;-webkit-appearance:none;appearance:none}#character-name:focus{border-color:#c7a35b;box-shadow:0 0 15px #b7823344}#name-error{height:18px;margin:6px 0;color:#d97766;font:11px sans-serif}#begin{position:relative;z-index:2;width:100%;padding:15px;color:#f7e9c0;border:1px solid #c29d55;background:linear-gradient(#4a3820,#1e180f);font:700 12px Cinzel,serif;letter-spacing:.2em;cursor:pointer;touch-action:manipulation}
#game-screen{background:#111;overflow:hidden;touch-action:none}#world{display:block;width:100%;height:100%;image-rendering:pixelated;cursor:crosshair}.game-hud{position:absolute;inset:0;pointer-events:none;font-family:Arial,sans-serif;text-shadow:1px 2px #000}.status{position:absolute;top:max(12px,env(safe-area-inset-top));left:12px;display:flex;gap:7px;min-width:180px;padding:6px 10px 7px 6px;background:#050807db;border:1px solid #7b6a43}.avatar{width:42px;height:42px;display:grid;place-items:center;color:#e8ca73;background:#17221e;border:1px solid #a88a4c;font-size:20px}.status b,.status small{display:block}.status b{color:#f4e6b9;font-size:13px}.status small{color:#9aaa9c;font-size:8px}.meter{width:120px;height:5px;margin-top:4px;background:#151515}.meter i{display:block;width:100%;height:100%;background:#bf3d37}.meter.mp i{background:#3971b5}.zone{position:absolute;top:max(12px,env(safe-area-inset-top));left:50%;transform:translateX(-50%);min-width:150px;padding:7px 18px;text-align:center;background:#050807c7;border-top:1px solid #a88a4c}.zone b,.zone small{display:block}.zone b{color:#e6d6a8;font:12px Cinzel,serif;letter-spacing:.16em}.zone small{color:#73ba83;font-size:8px}#hint{position:absolute;left:50%;bottom:max(18px,env(safe-area-inset-bottom));transform:translateX(-50%);padding:8px 14px;color:#d7cba9;background:#050807c7;border:1px solid #665b40;font-size:11px}#toast{position:absolute;top:22%;left:50%;transform:translate(-50%,-10px);padding:9px 16px;color:#f0dfb0;background:#080d0bdc;border:1px solid #887341;opacity:0;transition:.25s;font-size:11px}#toast.show{opacity:1;transform:translate(-50%,0)}.quickbar{position:absolute;right:max(16px,env(safe-area-inset-right));bottom:max(20px,env(safe-area-inset-bottom));display:flex;gap:9px;pointer-events:auto}.quickbar button{width:58px;height:58px;border:2px solid #8f7845;border-radius:50%;color:#edda9c;background:#0a100ee8;font-size:25px;box-shadow:0 4px 10px #000}.dialog{position:absolute;left:50%;bottom:max(95px,calc(env(safe-area-inset-bottom) + 80px));transform:translateX(-50%);width:min(430px,90vw);padding:16px;color:#d8ceb2;background:#07100eef;border:1px solid #aa8a4b;box-shadow:0 10px 30px #000;pointer-events:auto;text-align:center}.dialog h3{margin:0 0 5px;color:#efd78d;font:17px Cinzel,serif}.dialog p{margin:6px 0 13px;font-size:12px;color:#9daf9f}.dialog .items{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.dialog button{padding:10px 5px;color:#dfcea0;background:#17221e;border:1px solid #5b6d61}.dialog button b,.dialog button small{display:block}.dialog button small{color:#c59950;margin-top:4px}.dialog .close{margin-top:10px;width:100%}@media(max-width:600px){.zone{top:68px}.dialog{bottom:90px}.quickbar button{width:54px;height:54px}}
#gm-title{color:#ffcf4a;font-weight:bold;letter-spacing:.13em}.quickbar .gm-control{border-color:#ffd24f;color:#17110a;background:#e8b72d;font:bold 13px Arial;text-shadow:none}.gm-dialog .items{grid-template-columns:repeat(2,1fr)}
.dialog.trade-dialog{width:min(760px,96vw);max-height:88vh;overflow:auto}.trade-offers{display:grid;grid-template-columns:1fr 1fr;gap:10px}.trade-offer-card{display:grid;grid-template-columns:72px 1fr;align-items:center;min-height:105px;padding:9px;background:#0d1512;border:2px solid #554b34;text-align:left}.trade-offer-card.confirmed{border-color:#69c58a;box-shadow:inset 0 0 18px #244c33}.trade-offer-card>b,.trade-offer-card>em{grid-column:1/-1;color:#d9bd70;font-size:10px}.trade-offer-card canvas{width:64px;height:64px;image-rendering:pixelated}.trade-offer-card>i{grid-row:2;grid-column:1/-1;padding:20px;color:#64736b;text-align:center}.trade-offer-card>span,.trade-offer-card>small{font-size:10px}.trade-offer-card>em{color:#76c996}.trade-inventory-title,.trade-gold-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px}.trade-inventory-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:4px;max-height:250px;margin-top:6px;padding:6px;background:#17150e;border:2px solid #92743b;overflow:auto}.trade-inventory-cell{min-width:0!important;padding:4px!important;background:#14201c!important;border:1px solid #40564d!important}.trade-inventory-cell.selected{border-color:#f1cd68!important;box-shadow:inset 0 0 13px #87691f}.trade-inventory-cell canvas{display:block;width:100%;height:54px;object-fit:contain;image-rendering:pixelated}.trade-inventory-cell b,.trade-inventory-cell small{display:block;overflow:hidden;font-size:7px;text-overflow:ellipsis;white-space:nowrap}.trade-gold-row label{flex:1;text-align:left}.trade-gold-row input{width:130px;margin-left:8px}.trade-empty-bag{grid-column:1/-1}@media(max-width:600px){.dialog.trade-dialog{max-height:91vh}.trade-inventory-grid{grid-template-columns:repeat(4,1fr)}.trade-offers{gap:5px}.trade-offer-card{grid-template-columns:52px 1fr}.trade-offer-card canvas{width:48px;height:48px}}
.chat-panel{position:absolute;z-index:35;left:max(12px,env(safe-area-inset-left));bottom:max(88px,calc(env(safe-area-inset-bottom) + 78px));display:grid;grid-template-rows:auto minmax(60px,125px) auto;width:min(310px,38vw);color:#d8e1dc;background:#07100ee8;border:1px solid #6d765d;box-shadow:0 5px 20px #000;font:11px Arial;pointer-events:auto;text-shadow:1px 1px #000}.chat-panel header{display:flex;align-items:center;justify-content:space-between;padding:5px 7px;color:#d7bd72;background:#111b17;border-bottom:1px solid #526057;font-size:9px;letter-spacing:.12em}.chat-panel header button{width:25px;height:22px;padding:0;color:#e6d39e;background:#1c2823;border:1px solid #5f725f}.chat-panel #chat-messages{padding:6px 8px;overflow:auto}.chat-panel #chat-messages p{display:grid;grid-template-columns:auto 1fr auto;gap:5px;margin:0 0 4px;line-height:1.25}.chat-panel #chat-messages b{color:#84d2bd}.chat-panel #chat-messages span{overflow-wrap:anywhere}.chat-panel #chat-messages small{color:#687b72;font-size:8px}.chat-panel #chat-messages .gm-message b{color:#ffd24f}.chat-panel form{display:grid;grid-template-columns:1fr auto;border-top:1px solid #526057}.chat-panel input{min-width:0;padding:9px;color:#f4ead0;background:#060a09;border:0;outline:0;font-size:12px}.chat-panel form button{padding:0 12px;color:#ead797;background:#27372f;border:0;border-left:1px solid #526057;font-size:9px}.chat-panel.collapsed{bottom:max(14px,env(safe-area-inset-bottom));display:block;width:48px;height:48px;border-color:#917842;border-radius:8px;box-shadow:0 3px 10px #000}.chat-panel.collapsed header{width:100%;height:100%;padding:0;border:0;border-radius:7px}.chat-panel.collapsed header b,.chat-panel.collapsed #chat-messages,.chat-panel.collapsed form{display:none}.chat-panel.collapsed header button{width:100%;height:100%;border:0;border-radius:7px;color:#ead38a;background:#101915;font:bold 8px Arial;letter-spacing:.04em}.chat-panel.collapsed.unread{border-color:#ffd24f;box-shadow:0 0 12px #d9a72d}.chat-panel.collapsed.unread header button:after{content:"";position:absolute;width:9px;height:9px;margin:-6px 0 0 1px;background:#e85143;border:1px solid #ffd2a2;border-radius:50%}@media(max-width:700px){.chat-panel{bottom:max(82px,calc(env(safe-area-inset-bottom) + 72px));width:min(290px,76vw);grid-template-rows:auto minmax(50px,95px) auto}.chat-panel.collapsed{bottom:max(12px,env(safe-area-inset-bottom));width:46px;height:46px}.chat-panel input{font-size:16px}.chat-panel #chat-messages p{grid-template-columns:auto 1fr}.chat-panel #chat-messages small{display:none}}
.chat-panel.collapsed header button{position:relative}
.dialog.gm-dialog{width:min(620px,94vw);max-height:88vh;overflow:auto}.gm-item-grant{margin-top:14px;padding:12px;background:#0a1210;border:1px solid #8f743d;text-align:left}.gm-item-grant h4{margin:0;color:#f0cf70;font:14px Cinzel,serif;text-align:center}.gm-item-grant>p{text-align:center}.gm-item-grant label{display:block;color:#9eab9f;font-size:9px;letter-spacing:.08em}.gm-item-grant select{display:block;width:100%;margin:5px 0 10px;padding:9px;color:#eadcaf;background:#111b17;border:1px solid #52675e;font-size:10px}.gm-item-grant>div{display:grid;grid-template-columns:1fr 1fr;gap:8px}.gm-item-grant>button{width:100%;border-color:#c79e47!important}.gm-item-grant>em{display:block;min-height:16px;margin-top:7px;color:#78d09a;font:normal 9px Arial;text-align:center}@media(max-width:600px){.dialog.gm-dialog{max-height:91vh}.gm-item-grant>div{grid-template-columns:1fr}.gm-item-grant select{font-size:12px}}
