/* An engraved instrument, with a raised silhouette over the floor. */
html[data-ui-mode="modern"]{--dock-height:242px;--status-height:0px;--orb-size:230px;--tray-edge:224px}
html[data-ui-mode="modern"] .view{bottom:155px}
html[data-ui-mode="modern"] .inventory{inset:auto 0 0;height:var(--dock-height);background:transparent;box-shadow:none;border:0;isolation:isolate}
html[data-ui-mode="modern"] .inventory:before{inset:18px 0 0;border:0;z-index:-1;background:#f9f9f9;clip-path:polygon(0 30px,8% 12px,19% 12px,21% 0,79% 0,81% 12px,92% 12px,100% 30px,100% 100%,0 100%)}
html[data-ui-mode="modern"] .inventory:after{display:block;inset:auto 0 0;left:0;top:auto;width:100%;height:36px;background:url('assets/temple-frieze.svg') bottom left/86px 36px repeat-x;z-index:-1}
html[data-ui-mode="modern"] .inventory h2{left:var(--tray-edge);right:var(--tray-edge);top:7px;height:22px;text-align:center;line-height:20px;color:#333;letter-spacing:4px;border:3px double #555;background:#fafafa;clip-path:polygon(10px 0,calc(100% - 10px) 0,100% 100%,0 100%)}
html[data-ui-mode="modern"] #inventory{display:grid;grid-template-rows:repeat(2,72px);grid-auto-flow:column;grid-auto-columns:calc((100% - 56px)/8);gap:7px 8px;left:var(--tray-edge);right:var(--tray-edge);top:36px;height:161px;padding:0 0 8px;border:0}
html[data-ui-mode="modern"] .item,html[data-ui-mode="modern"] .empty-slot{width:100%;height:72px;min-width:0;max-width:none;flex:none;border:4px double #555;clip-path:polygon(4px 0,calc(100% - 4px) 0,100% 4px,100% calc(100% - 4px),calc(100% - 4px) 100%,4px 100%,0 calc(100% - 4px),0 4px);box-shadow:inset 0 0 0 1px #ccc;background-color:#fff;padding:3px}
html[data-ui-mode="modern"] .item-icon{width:40px;height:40px}
html[data-ui-mode="modern"] .item-name{font-size:8px;line-height:10px;max-width:100%}
html[data-ui-mode="modern"] .item[aria-selected=true]{border-color:#111;box-shadow:inset 0 0 0 2px #111}
html[data-ui-mode="modern"] .empty-slot{background:linear-gradient(45deg,transparent 47%,#aaa 48% 52%,transparent 53%) center/10px 10px no-repeat,#eee;border-color:#999}
html[data-ui-mode="modern"] #selected-item{left:var(--tray-edge);bottom:31px;font:10px/17px Georgia,serif;max-width:180px}
html[data-ui-mode="modern"] .item-actions{right:var(--tray-edge);bottom:31px;gap:4px}
html[data-ui-mode="modern"] .item-actions button{min-height:20px;padding:0 8px;font:10px/16px Arial,sans-serif;border:3px double #777;background:#fff}
html[data-ui-mode="modern"] .slot-navigation{right:calc(var(--tray-edge) + 10px);top:6px;z-index:2}
html[data-ui-mode="modern"] .slot-navigation button{width:22px;height:21px;background:#fff;font-size:13px}
html[data-ui-mode="modern"] .status{position:absolute;inset:auto 0 0;height:var(--dock-height);background:transparent;border:0;box-shadow:none;pointer-events:none;z-index:6;overflow:visible}
html[data-ui-mode="modern"] .status:before,html[data-ui-mode="modern"] .status:after{display:none}
html[data-ui-mode="modern"] .modern-vitals{display:contents}
html[data-ui-mode="modern"] .vitals-emblem{display:none}
html[data-ui-mode="modern"] .vital{position:absolute;top:-24px;width:var(--orb-size);height:calc(var(--orb-size)*250/240);display:block;background:url('assets/ritual-orb.svg') center/100% 100% no-repeat;pointer-events:auto}
html[data-ui-mode="modern"] .vital-health{left:0}html[data-ui-mode="modern"] .vital-hunger{right:0}
html[data-ui-mode="modern"] .orb-well{position:absolute;left:19.7%;top:10.8%;width:60.6%;height:58.2%;border-radius:50%;overflow:hidden;background:#111;isolation:isolate}
html[data-ui-mode="modern"] .orb-fill{position:absolute;inset:auto 0 0;height:var(--fill,100%);background:radial-gradient(#999 .6px,transparent .8px) 0 0/4px 4px,#fff;border-top:2px solid #888}
html[data-ui-mode="modern"] .orb-symbol{position:absolute;inset:0;display:grid;place-items:center;font:64px/1 Georgia,serif;color:#111;text-shadow:1px 1px #fff,-1px -1px #fff,1px -1px #fff,-1px 1px #fff}
html[data-ui-mode="modern"] .orb-wheat{position:absolute;inset:23% 33%;width:34%;height:54%;fill:#fff;stroke:#111;stroke-width:2;filter:drop-shadow(0 0 1px white)}
html[data-ui-mode="modern"] .vital label{position:absolute;top:76%;left:20%;width:60%;text-align:center;font:bold 12px/16px Georgia,serif;letter-spacing:1.5px;text-transform:uppercase}
html[data-ui-mode="modern"] .vital strong{position:absolute;top:84%;left:20%;width:60%;text-align:center;font:bold 15px/19px monospace}
html[data-ui-mode="modern"] .vital meter{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
html[data-ui-mode="modern"] .status-body{bottom:5px;left:var(--tray-edge);right:var(--tray-edge);width:auto;height:19px;padding:0 4px;background:#fff;border:1px solid #555;gap:7px;pointer-events:auto;flex-wrap:nowrap;font-size:9px}
html[data-ui-mode="modern"] .status-body label{font-size:8px;margin-left:5px;letter-spacing:.5px}
html[data-ui-mode="modern"] #speed{height:17px;font-size:10px;width:30px}
html[data-ui-mode="modern"] #modern-oil{font-size:9px;margin-left:5px}
html[data-ui-mode="modern"] .news,html[data-ui-mode="modern"] .movement{bottom:calc(var(--dock-height) + 34px)}
html[data-ui-mode="modern"] .minimap-panel{border:4px double #222;box-shadow:0 0 0 2px #fff,0 0 0 3px #777;background:#fafafa}
@media(max-width:1100px){html[data-ui-mode="modern"]{--orb-size:176px;--tray-edge:172px}html[data-ui-mode="modern"] .vital{top:3px}html[data-ui-mode="modern"] .item-icon{width:32px;height:36px}html[data-ui-mode="modern"] #inventory{grid-auto-columns:calc((100% - 40px)/6)}html[data-ui-mode="modern"] .vital label{font-size:10px}html[data-ui-mode="modern"] .vital strong{font-size:12px}html[data-ui-mode="modern"] .orb-symbol{font-size:46px}html[data-ui-mode="modern"] #selected-item{max-width:110px;font-size:9px}}
@media(max-width:700px){html[data-ui-mode="modern"]{--dock-height:300px;--orb-size:126px;--tray-edge:14px}html[data-ui-mode="modern"] .view{bottom:200px}html[data-ui-mode="modern"] .vital{top:-18px}html[data-ui-mode="modern"] .vital-health{left:10px}html[data-ui-mode="modern"] .vital-hunger{right:10px}html[data-ui-mode="modern"] .orb-symbol{font-size:34px}html[data-ui-mode="modern"] .vital label{font-size:8px;line-height:10px;letter-spacing:.5px}html[data-ui-mode="modern"] .vital strong{font-size:10px;line-height:12px}html[data-ui-mode="modern"] .inventory:before{top:51px;clip-path:polygon(0 25px,20% 10px,36% 0,64% 0,80% 10px,100% 25px,100% 100%,0 100%)}html[data-ui-mode="modern"] .inventory h2{top:64px;left:140px;right:140px;font-size:8px;letter-spacing:1px}html[data-ui-mode="modern"] #inventory{top:115px;grid-template-rows:repeat(2,62px);height:137px;grid-auto-columns:calc((100% - 40px)/6)}html[data-ui-mode="modern"] .item,html[data-ui-mode="modern"] .empty-slot{height:62px}html[data-ui-mode="modern"] .item-icon{width:30px;height:30px}html[data-ui-mode="modern"] .slot-navigation{right:calc(50% - 26px);top:89px}html[data-ui-mode="modern"] #selected-item,html[data-ui-mode="modern"] .item-actions{bottom:26px}html[data-ui-mode="modern"] .item-actions button{padding:0 4px;font-size:9px}html[data-ui-mode="modern"] .status-body{bottom:3px;gap:3px}html[data-ui-mode="modern"] .status-body label{font-size:7px;letter-spacing:0;margin-left:2px}html[data-ui-mode="modern"] #weight{width:25px}html[data-ui-mode="modern"] #modern-oil{font-size:8px;margin-left:3px}html[data-ui-mode="modern"] .news,html[data-ui-mode="modern"] .movement{bottom:calc(var(--dock-height) + 35px)}}
@media(max-height:600px) and (min-width:701px){html[data-ui-mode="modern"]{--dock-height:202px;--orb-size:180px;--tray-edge:176px}html[data-ui-mode="modern"] .vital{top:-8px}html[data-ui-mode="modern"] #inventory{grid-template-rows:repeat(2,54px);height:123px}html[data-ui-mode="modern"] .item,html[data-ui-mode="modern"] .empty-slot{height:54px}html[data-ui-mode="modern"] .item-icon{width:28px;height:27px}html[data-ui-mode="modern"] .view{bottom:120px}}

/* Larger original artwork, with room for the engraving around each slot. */
html[data-ui-mode="modern"]{--dock-height:286px;--orb-size:260px;--tray-edge:252px}
html[data-ui-mode="modern"] .view{bottom:185px}
html[data-ui-mode="modern"] #inventory{top:40px;grid-template-rows:repeat(2,94px);height:204px;gap:8px}
html[data-ui-mode="modern"] .item,html[data-ui-mode="modern"] .empty-slot{height:94px;border:5px double #222;box-shadow:inset 0 0 0 1px #fff,inset 0 0 0 2px #888;padding:4px}
html[data-ui-mode="modern"] .item-icon{width:64px;height:64px;max-width:100%;margin:auto}
html[data-ui-mode="modern"] .item-name{font-size:9px;line-height:12px}
html[data-ui-mode="modern"] .item-quantity{font-size:12px;line-height:17px;right:2px;top:2px}
html[data-ui-mode="modern"] .inventory h2{top:6px;height:29px;line-height:24px;border:4px double #111;background:#fff url('assets/engraved-rail.svg') left center/100px 26px repeat-x;clip-path:polygon(12px 0,calc(100% - 12px) 0,100% 100%,0 100%)}
html[data-ui-mode="modern"] .inventory h2 span{display:inline-block;background:#fff;padding:0 16px;border-left:3px double #111;border-right:3px double #111}
html[data-ui-mode="modern"] .slot-navigation{top:10px}
html[data-ui-mode="modern"] .item:after,html[data-ui-mode="modern"] .empty-slot:after{content:'';position:absolute;inset:1px;pointer-events:none;background:linear-gradient(135deg,#111 0 3px,transparent 3px) top left/8px 8px no-repeat,linear-gradient(225deg,#111 0 3px,transparent 3px) top right/8px 8px no-repeat,linear-gradient(45deg,#111 0 3px,transparent 3px) bottom left/8px 8px no-repeat,linear-gradient(315deg,#111 0 3px,transparent 3px) bottom right/8px 8px no-repeat}
html[data-ui-mode="modern"] .item[aria-selected=true]{border:5px double #111;box-shadow:inset 0 0 0 2px #111}
html[data-ui-mode="modern"] .empty-slot{background:#fff url('assets/lotus-seal.svg') center/38px 38px no-repeat;border-color:#666}
html[data-ui-mode="modern"] .inventory:before{background:radial-gradient(#aaa .5px,transparent .6px) 0 0/5px 5px,#fff}
html[data-ui-mode="modern"] .inventory:after{height:38px;background-size:90px 38px}
@media(max-width:1100px){html[data-ui-mode="modern"]{--orb-size:195px;--tray-edge:191px}html[data-ui-mode="modern"] .item-icon{width:56px;height:60px}html[data-ui-mode="modern"] #inventory{grid-auto-columns:calc((100% - 40px)/6)}}
@media(max-width:700px){html[data-ui-mode="modern"]{--dock-height:328px;--orb-size:135px;--tray-edge:14px}html[data-ui-mode="modern"] .view{bottom:210px}html[data-ui-mode="modern"] .inventory h2{top:64px;left:150px;right:150px;font-size:8px;letter-spacing:0;background:#fff;clip-path:none}html[data-ui-mode="modern"] .inventory h2 span{padding:0;border:0}html[data-ui-mode="modern"] #inventory{top:123px;grid-template-rows:repeat(2,72px);height:159px;grid-auto-columns:calc((100% - 24px)/4)}html[data-ui-mode="modern"] .item,html[data-ui-mode="modern"] .empty-slot{height:72px}html[data-ui-mode="modern"] .item-icon{width:46px;height:46px}html[data-ui-mode="modern"] .item-name{font-size:8px;line-height:10px}html[data-ui-mode="modern"] .slot-navigation{top:97px}html[data-ui-mode="modern"] .empty-slot{background-size:28px 28px}}
@media(max-height:600px) and (min-width:701px){html[data-ui-mode="modern"]{--dock-height:228px;--orb-size:195px;--tray-edge:191px}html[data-ui-mode="modern"] #inventory{grid-template-rows:repeat(2,66px);height:147px}html[data-ui-mode="modern"] .item,html[data-ui-mode="modern"] .empty-slot{height:66px}html[data-ui-mode="modern"] .item-icon{width:42px;height:40px}html[data-ui-mode="modern"] .view{bottom:140px}}
/* Generated ink engraving overlays the live fill; no baked-in numbers. */
html[data-ui-mode="modern"] .vital{height:var(--orb-size);background:none;isolation:isolate;top:-7px}
html[data-ui-mode="modern"] .vital:before{content:'';position:absolute;inset:0;background:url('assets/ritual-orb-engraved.png') center/contain no-repeat;z-index:2;pointer-events:none}
html[data-ui-mode="modern"] .orb-well{left:23%;top:17.5%;width:54%;height:54%;z-index:1}
html[data-ui-mode="modern"] .vital label{top:80.5%;left:25%;width:50%;z-index:3;font-size:11px;line-height:15px;letter-spacing:1px}
html[data-ui-mode="modern"] .vital strong{top:87%;left:25%;width:50%;z-index:3;font-size:14px;line-height:18px}
@media(max-width:1100px){html[data-ui-mode="modern"] .vital label{font-size:9px;line-height:12px}html[data-ui-mode="modern"] .vital strong{font-size:11px;line-height:14px}}
@media(max-width:700px){html[data-ui-mode="modern"] .vital{top:-18px}html[data-ui-mode="modern"] .vital label{font-size:7px;line-height:9px;letter-spacing:.3px}html[data-ui-mode="modern"] .vital strong{font-size:9px;line-height:10px}}
html[data-ui-mode="modern"] .vital label{top:81.7%;font-size:10px;line-height:12px}
html[data-ui-mode="modern"] .vital strong{top:86.3%;font-size:12px;line-height:12px}
@media(max-width:1100px){html[data-ui-mode="modern"] .vital label{font-size:7px;line-height:9px}html[data-ui-mode="modern"] .vital strong{font-size:10px;line-height:10px}}
@media(max-width:700px){html[data-ui-mode="modern"] .vital label{top:95%;font-size:8px;line-height:10px;background:#fff}html[data-ui-mode="modern"] .vital strong{top:84%;font-size:9px;line-height:10px}}
html[data-ui-mode="modern"] .item-actions{background:#fff;padding:0 2px}
html[data-ui-mode="modern"] #selected-item{background:#fff;padding:0 4px}