@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600;700&family=DM+Sans:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--bg:#101713;--panel:#1d2721;--raised:#253029;--line:#3b4638;--gold:#d3b574;--muted:#9ba898;--text:#ebe8d9;--green:#93b27b;--red:#c7665c;font-family:'DM Sans',Arial,sans-serif;font-size:16px}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);overflow-x:hidden}button{font:inherit;color:inherit;cursor:pointer;background:none;border:0}button:focus-visible,canvas:focus-visible{outline:2px solid var(--gold);outline-offset:3px}button:disabled{cursor:not-allowed;opacity:.46}h1,h2,h3,p{margin:0}h2,h3{font-family:'Cormorant Garamond',Georgia,serif}button{transition:background .15s,color .15s}button:hover:not(:disabled){color:#f4d995}kbd{font-family:inherit;font-size:12px;color:#a6b09e;border:1px solid #505a48;border-radius:3px;padding:2px 5px;min-width:18px;text-align:center}.topbar{height:84px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding:0 30px;gap:20px;background:#18211b}.brand{display:flex;align-items:center;gap:12px}.brand-mark{font-size:46px;color:var(--gold);line-height:1}.brand h1{font-family:Georgia,serif;font-size:25px;letter-spacing:5px;font-weight:400}.brand div>span{font-size:10px;color:var(--gold);letter-spacing:4px}.world-status{display:flex;align-items:center;gap:12px;font-size:14px;color:#b7c1af}.world-status .sun{font-size:23px;color:#c9aa66}.world-status i{height:18px;width:1px;background:var(--line);margin:0 8px}.top-actions{display:flex;align-items:center;gap:12px}.top-actions>span{font-size:12px;color:var(--muted)}.icon-btn{width:34px;height:34px;border:1px solid var(--line);border-radius:4px;font-family:Georgia,serif;font-size:20px}.game-layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:16px;padding:20px 24px;max-width:1920px;margin:auto}.play-column{min-width:0}.world-frame{height:calc(100vh - 302px);min-height:435px;max-height:900px;position:relative;border:1px solid #53604a;border-radius:5px;overflow:hidden;background:#495c35;box-shadow:0 6px 25px #0003}#world{display:block;width:100%;height:100%;touch-action:none;cursor:crosshair}.location{position:absolute;top:24px;left:26px;text-shadow:0 2px 6px #000;pointer-events:none}.overline{font-size:11px;font-weight:700;letter-spacing:2px;color:var(--gold)}.location h2{font-size:32px;font-weight:600;margin:3px 0}.location>span:last-child{font-size:12px;color:#e0e3d0}.map-button{position:absolute;right:16px;top:16px;width:148px;padding:0;background:#142016dd;border:1px solid #a39262;box-shadow:0 2px 10px #0004;border-radius:50% 50% 5px 5px;overflow:hidden;display:grid}.map-button canvas{width:146px;height:126px}.map-button>span{font-size:10px;letter-spacing:1.6px;padding:7px 3px;border-top:1px solid #6a7350}.map-button kbd{font-size:10px;margin-left:6px}.quest-tracker{position:absolute;top:123px;left:26px;width:234px;background:linear-gradient(90deg,#16241be8,#16241bba);border-left:2px solid var(--gold);padding:13px 16px;pointer-events:none;box-shadow:0 3px 20px #0001}.quest-tracker strong{display:block;font-size:15px;margin-top:6px;font-weight:500}.quest-tracker p{font-size:12px;line-height:1.6;color:#c6ceb7;margin-top:5px}.world-footer{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(transparent,#172118e8);display:flex;align-items:center;justify-content:space-between;padding:32px 18px 14px;font-size:12px;pointer-events:none;gap:8px}.world-footer b{color:var(--gold);font-weight:500}.world-footer button{font-size:12px;pointer-events:auto}.hover-tip{position:absolute;padding:7px 11px;background:#141b16ef;border:1px solid #7c835e;border-radius:3px;font-size:12px;pointer-events:none;z-index:2;white-space:nowrap}.action-bar{display:flex;align-items:center;gap:16px;padding:12px 0}.health-block{width:128px;flex-shrink:0}.health-block>span{display:flex;justify-content:space-between;color:var(--red);font-size:19px}.health-block b{color:#c7cbbc;font-size:12px;font-weight:500;padding-top:4px}.health-track{height:6px;background:#372e26;border-radius:5px;margin-top:6px;overflow:hidden}.health-track div{height:100%;background:linear-gradient(90deg,#a34a42,#d37965);transition:width .3s}.abilities{display:flex;gap:7px;flex:1}.abilities button{display:flex;align-items:center;gap:8px;min-height:48px;background:#222d24;border:1px solid var(--line);border-radius:4px;padding:6px 10px;text-align:left;flex:1;font-size:12px}.abilities small{display:block;color:var(--muted);font-size:10px;margin-top:3px}.abilities .ability-icon{font-size:22px;color:#cdb785}.abilities kbd{margin-left:auto}#stop-btn{font-size:12px;display:grid;gap:4px}.event-panel{border:1px solid var(--line);border-radius:4px;background:#19221c;min-height:119px}.log-title{display:flex;justify-content:space-between;padding:10px 14px;border-bottom:1px solid #303b2f;font-size:10px;letter-spacing:1.7px;color:var(--gold)}.log-title .hint{color:#71836d;letter-spacing:0}.log{height:83px;overflow-y:auto;padding:6px 14px;font-size:12px;line-height:1.8;scrollbar-width:thin}.log-entry span{color:#6c8167;margin-right:12px;font-size:10px}.log-entry.loot{color:#d4c488}.log-entry.quest{color:#b8d49a}.log-entry.danger{color:#e18b7e}.sidebar{background:#1b251e;border:1px solid var(--line);border-radius:5px;display:flex;flex-direction:column;overflow:hidden;min-height:670px}.player-card{display:flex;align-items:center;gap:12px;padding:22px 16px;position:relative}.portrait{display:grid;place-items:center;width:48px;height:54px;border:1px solid #837448;background:#303729;color:#d6b97c;font-size:35px;border-radius:50% 50% 4px 4px}.player-card .overline{font-size:9px;letter-spacing:1.7px}.player-card h2{font-size:26px;margin:2px 0}.combat-tag{font-size:11px;color:#a8b69d}.combat-tag b{color:#d9d8ba}.coins{position:absolute;right:16px;top:25px;font-size:12px;color:#d8b766}.coins>span{font-size:16px}.tabs{display:flex;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.tabs button{flex:1;padding:14px 0;font-size:12px;color:var(--muted);position:relative}.tabs button.active{color:var(--gold);background:#263025}.tabs button.active:after{content:'';position:absolute;left:12px;right:12px;bottom:-1px;height:2px;background:var(--gold)}.panel{padding:18px 16px;flex:1}.panel-heading{display:flex;align-items:center;justify-content:space-between;font-size:10px;letter-spacing:1.3px;color:#acb7a0;margin-bottom:14px}.panel-heading span:last-child{color:#819176;letter-spacing:0}.inventory-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.slot{height:57px;border:1px solid #394432;background:#141e17;border-radius:3px;position:relative;display:grid;place-items:center}.slot.has-item:hover{background:#303c28;border-color:#afa36a}.slot canvas{width:42px;height:42px}.slot .quantity{position:absolute;right:5px;bottom:3px;font-size:10px;color:#d6c895}.slot.uncommon{border-color:#63855c}.slot.rare{border-color:#708ea2}.slot.epic{border-color:#a186b1}.equipment-section{border-top:1px solid var(--line);margin-top:23px;padding-top:19px}.equipment-row{display:flex;align-items:center;gap:10px;padding:9px 0}.equipment-row canvas{background:#172018;border:1px solid #49503a;border-radius:3px;width:38px;height:38px}.equipment-row strong{display:block;font-size:12px;font-weight:500}.equipment-row small{font-size:11px;color:var(--muted)}.equipment-row>span{margin-left:auto;color:var(--gold);font-size:11px}.stats-row{display:flex;justify-content:space-between;border-top:1px solid #36402f;padding-top:13px;margin-top:9px;color:#9eae90;font-size:11px}.stats-row b{color:#d4ca9a}.sidebar-foot{display:flex;gap:12px;padding:14px 16px;border-top:1px solid var(--line);color:#8c987f;font-size:11px;line-height:1.7}.sidebar-foot>span{color:var(--gold)}.sidebar-foot p>span{color:#667b62}.skill-card{padding:16px 0;border-bottom:1px solid #374230}.skill-top{display:flex;align-items:center;gap:12px}.skill-symbol{font-size:24px;color:var(--gold);width:30px;text-align:center}.skill-top h3{font:500 14px 'DM Sans',Arial}.skill-top small{color:#84947a;font-size:11px}.skill-level{margin-left:auto;font:600 25px Georgia;color:var(--gold)}.xp-track{height:4px;background:#111b13;border-radius:3px;margin:12px 0 6px}.xp-track>div{height:100%;background:#a2af6d}.xp-label{font-size:10px;display:flex;justify-content:space-between;color:#839477}.panel-note{font-size:12px;color:#9aa98e;line-height:1.7;margin-top:18px}.quest-card{border:1px solid #3b4a35;padding:14px;margin-bottom:12px;border-radius:3px;background:#1d2a20}.quest-card h3{font-size:20px;color:#e0d4ae}.quest-card p{font-size:12px;line-height:1.65;color:#b1baa2;margin:8px 0}.quest-card small{font-size:10px;color:var(--gold)}.quest-card button{font-size:11px;margin-top:8px;color:var(--gold);padding:0}.quest-card.complete{opacity:.68}.toasts{position:absolute;top:28px;left:50%;transform:translateX(-50%);display:grid;gap:8px;pointer-events:none;width:270px;text-align:center}.toast{background:#202b20ed;border:1px solid #baa36a;border-radius:4px;padding:12px 16px;box-shadow:0 6px 20px #0004;animation:toast-in .25s ease-out}.toast b{display:block;font-family:Georgia,serif;font-size:18px;color:#e8ce8b}.toast small{display:block;font-size:11px;color:#bcc7a7;margin-top:4px}@keyframes toast-in{from{transform:translateY(-10px);opacity:0}to{transform:translateY(0);opacity:1}}.target-card{position:absolute;left:50%;bottom:58px;transform:translateX(-50%);min-width:200px;padding:10px 18px;background:#182319ec;border:1px solid #627151;border-radius:3px;text-align:center;font-size:13px}.target-card .bar{height:5px;background:#332c23;margin-top:8px;overflow:hidden}.target-card .bar div{height:100%;background:#c57160}.target-card small{font-size:10px;color:#bdc6ad}dialog{width:min(480px,calc(100% - 32px));max-height:85vh;overflow:auto;background:#202b22;border:1px solid #91835b;border-radius:7px;color:var(--text);padding:24px;box-shadow:0 20px 90px #0009}dialog::backdrop{background:#080e0b99;backdrop-filter:blur(3px)}.modal-heading{display:flex;justify-content:space-between;align-items:flex-start;border-bottom:1px solid #47513c;padding-bottom:17px;margin-bottom:20px;gap:15px}.modal-heading h2{font-size:30px;margin-top:5px}#modal-body p{font-size:14px;line-height:1.75;color:#c5ceb8;margin:10px 0 18px}.primary-btn,.secondary-btn{display:block;width:100%;padding:12px 16px;border:1px solid #a28f5e;border-radius:3px;margin-top:10px;font-size:14px}.primary-btn{background:#c4ac71;color:#192219;font-weight:600}.primary-btn:hover:not(:disabled){background:#dec791;color:#192219}.secondary-btn{background:#2b3829;border-color:#58674a;color:#d1d8be}.reward-box{padding:14px;background:#17231a;border-left:2px solid var(--gold);font-size:13px;color:var(--gold);line-height:1.7}.help-row{display:flex;justify-content:space-between;gap:20px;font-size:13px;line-height:2.5;border-bottom:1px solid #384532}.shop-row{display:flex;align-items:center;padding:12px 0;gap:10px;border-bottom:1px solid #3a4633;font-size:13px}.shop-row canvas{width:38px;height:38px}.shop-row small{display:block;color:#8fa280;font-size:11px;margin-top:5px}.shop-row button{margin-left:auto;background:#37432d;padding:8px 10px;border:1px solid #798354;border-radius:3px;font-size:12px}.map-canvas{display:block;max-width:100%;margin:auto}.map-legend{display:flex;flex-wrap:wrap;gap:10px 16px;font-size:11px;color:#b7c3a7;margin:15px 0}.danger-link{display:block;color:#a89782;font-size:11px;margin:24px auto 0;text-decoration:underline}#map-hint{text-align:center;font-size:12px!important}.muted{color:#8f9d85}.intro-note{font-style:italic;color:#d4c39b!important}.locked{color:#aab39c;font-size:12px}.rarity{font-size:11px;color:var(--gold);text-transform:uppercase;letter-spacing:1px}.item-preview{display:flex;align-items:center;gap:18px}.item-preview canvas{width:74px;height:74px;background:#192219;border:1px solid #5b6347;border-radius:4px}.item-preview p{margin:0!important}.progress-objective{font-size:12px;line-height:2;color:#becba8}.progress-objective.done{color:#b9d895}@media(min-width:1500px){.game-layout{grid-template-columns:minmax(0,1fr) 350px;gap:20px}.slot{height:65px}.sidebar{min-height:720px}}@media(max-width:1050px){.game-layout{grid-template-columns:minmax(0,1fr) 270px;padding:12px;gap:12px}.topbar{padding:0 18px}.world-status{display:none}.quest-tracker{width:190px;top:115px;left:16px}.location{left:16px}.location h2{font-size:27px}.map-button{width:112px;right:10px;top:10px}.map-button canvas{width:110px;height:95px}.map-button>span{font-size:8px;letter-spacing:1px}.action-bar{gap:8px}.health-block{width:90px}.abilities button{padding:5px;font-size:11px;gap:4px}.abilities kbd{display:none}.abilities .ability-icon{font-size:18px}.panel{padding:16px 12px}.slot{height:50px}.player-card{padding:18px 12px}.player-card .coins{top:12px;right:12px}.player-card h2{font-size:23px}}@media(max-width:760px){.topbar{height:68px;padding:0 14px}.brand h1{font-size:20px;letter-spacing:3px}.brand div>span{font-size:8px;letter-spacing:2.7px}.brand-mark{font-size:35px}.top-actions{gap:7px}.top-actions>span{display:none}.game-layout{display:flex;flex-direction:column;padding:8px;gap:10px}.world-frame{height:62vh;min-height:410px}.location{top:18px}.location h2{font-size:26px}.quest-tracker{top:105px;width:181px;padding:10px 11px}.quest-tracker strong{font-size:13px}.quest-tracker p{font-size:11px}.quest-tracker .overline{font-size:9px}.toasts{top:auto;bottom:108px;width:250px}.sidebar{min-height:0}.sidebar-foot{display:none}.player-card{padding:12px 16px}.portrait{width:38px;height:43px;font-size:29px}.player-card h2{font-size:22px}.player-card .coins{top:28px;right:18px}.inventory-grid{grid-template-columns:repeat(7,1fr);gap:6px}.slot{height:49px}.equipment-section{margin-top:18px}.equipment-row{display:inline-flex;width:49%;font-size:11px;padding-right:8px}.equipment-row>span{display:none}.equipment-row strong{font-size:11px}.abilities button{min-width:0;flex:1}.abilities small{font-size:9px}.abilities .ability-icon{display:none}.health-block{width:78px}.health-block b{font-size:10px}.action-bar{gap:7px}.abilities{gap:5px}.abilities button{padding:6px 7px;font-size:11px}#stop-btn{font-size:10px}.world-footer{font-size:10px;padding:30px 10px 12px}.world-footer button{font-size:10px}.log-title .hint{display:none}.event-panel{min-height:103px}.log{height:68px}.skill-card{padding:14px 0}.panel-note{font-size:12px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
/* Social layer: chat stays close to the adventure log so it feels like a world channel. */
.social-dock{margin-top:10px;border:2px solid #766747;background:linear-gradient(180deg,#302a21,#201e19);box-shadow:0 4px 0 #121510;padding:9px;color:#e6d7ad}.social-title{display:flex;justify-content:space-between;align-items:center;font:700 12px Georgia;letter-spacing:.12em;color:#e7ca7e}.social-title span:last-child{font:11px Arial;color:#a9ab8c;letter-spacing:0}.chat-messages{height:86px;overflow:auto;margin:7px 0;padding:5px;background:#121b15;border:2px inset #655b44;font:12px Arial;color:#d8d0b7}.chat-line{margin-bottom:5px;line-height:1.25}.chat-line b{color:#e3c875;margin-right:5px}.chat-line.me b{color:#a8c77b}.chat-form{display:flex;gap:6px}.chat-form input{min-width:0;flex:1;padding:7px 8px;background:#eee5c9;color:#29261f;border:2px inset #7e7256;font:12px Arial}.chat-form button,.social-action{border:2px outset #a08b5d;background:#6e5d3d;color:#ffe6a2;padding:7px 10px;font:12px Georgia;cursor:pointer}.social-action.danger{color:#f2b6a3}.social-players{display:grid;gap:7px}.social-player{display:flex;align-items:center;gap:8px;padding:8px;border-bottom:1px solid #675b44}.social-player strong{flex:1;color:#f3dda0}.social-player small{color:#bcb694}.social-player button{margin-left:4px}.social-form{display:grid;gap:9px}.social-form label{font:12px Arial;color:#ded1aa}.social-form select,.social-form input{padding:8px;background:#efe7cd;color:#29261f;border:2px inset #817357}.social-request{padding:10px;background:#3a3024;border:1px solid #9a8050;margin-bottom:8px}.social-request b{color:#ffe49a}.social-request small{display:block;color:#c9bea1;margin:5px 0 8px}.social-request button{margin-right:6px}
@media(max-width:760px){.chat-messages{height:70px}.social-dock{margin-top:7px}}
