/* Independent UI layers. Keep the live model, artwork, text and controls separate. */
#hero-sheet{--sheet-layer-background:0;--sheet-layer-panels:1;--sheet-layer-model:2;--sheet-layer-slots:4;--sheet-layer-identity:5;--sheet-layer-controls:6;isolation:isolate;padding:20px;border:1px solid #b9a06a55;border-radius:12px;background:#0e1714;box-shadow:0 28px 100px #000b,0 0 0 1px #0008;color:#e8e0cb;font-family:'Segoe UI',sans-serif}
.sheet-window-backdrop{position:absolute;inset:0;z-index:var(--sheet-layer-background);border-radius:11px;background:radial-gradient(ellipse at 25% 0%,#24382d77,transparent 65%),linear-gradient(145deg,#17231e,#0e1714);pointer-events:none}
#hero-sheet[open]{grid-template-rows:44px minmax(0,1fr) 42px;gap:14px}
#hero-sheet .sheet-header{position:relative;z-index:var(--sheet-layer-controls);background:none;border-bottom:1px solid #d2bf8b26;padding:0 0 10px;gap:10px}
#hero-sheet .sheet-header h2{font:24px Georgia,serif;font-weight:normal;letter-spacing:.02em;color:#f0e5c7;text-shadow:none}
#hero-sheet #sheet-cross{width:30px;height:30px;line-height:26px;border:1px solid #bdac7930;border-radius:6px;background:#ffffff06;color:#c2b691;box-shadow:none;font:23px 'Segoe UI'}
#hero-sheet #sheet-cross:hover{background:#ffffff10;color:#f3e9cb}
#hero-sheet .sheet-body{position:relative;z-index:var(--sheet-layer-panels);gap:16px;padding-right:16px}
#hero-sheet .sheet-equipment{isolation:isolate;background:radial-gradient(ellipse at 50% 42%,#35473a55,#131e1855 75%);border:1px solid #b6a47c26;border-radius:8px;box-shadow:none}
#hero-sheet #sheet-model{z-index:var(--sheet-layer-model)}
#hero-sheet .sheet-slot-column{z-index:var(--sheet-layer-slots);gap:7px;top:3%;bottom:3%}
#hero-sheet .sheet-identity{z-index:var(--sheet-layer-identity);top:15px;color:#bfb393;font:12px 'Segoe UI',sans-serif;letter-spacing:.04em;text-shadow:none}
#hero-sheet .sheet-slot{border:1px solid #bca77540;border-radius:6px;background:linear-gradient(145deg,#26332999,#111b15);box-shadow:inset 0 1px 0 #ffffff06}
#hero-sheet .sheet-slot:hover,#hero-sheet .sheet-slot:focus-visible{border-color:#d2bb7d90;background:#2c392a}
#hero-sheet .sheet-slot.equipped{border-color:#c3a96990;background:linear-gradient(145deg,#3a3728,#19211a);box-shadow:inset 0 1px 0 #e0cd9730,0 0 10px #a77f1910}
#hero-sheet .sheet-slot.equipped::before{inset:3px;border:0;border-radius:4px;background:radial-gradient(ellipse,#a7853636,transparent 75%);box-shadow:none;filter:none}
#hero-sheet .sheet-slot.equipped::after{display:none}
#hero-sheet .sheet-slot .sheet-slot-icon{opacity:.32;filter:grayscale(.5)}
#hero-sheet .sheet-slot.equipped .sheet-item-icon{opacity:1;filter:drop-shadow(0 2px 2px #000a)}
#hero-sheet .sheet-parameters{position:relative;background:linear-gradient(155deg,#26312988,#18221cbb);border:1px solid #b6a47c26;border-radius:8px;box-shadow:none;padding:14px 16px;color:#dcd6c6}
#hero-sheet .sheet-parameters h3{font:600 12px 'Segoe UI',sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#c4b17c;padding-bottom:7px;margin:12px 0 5px;border-bottom:1px solid #b7a57224}
#hero-sheet .sheet-parameters h3:first-child{margin-top:0}
#hero-sheet .sheet-stat{font:13px 'Segoe UI',sans-serif;min-height:26px;gap:8px;padding:0 2px}
#hero-sheet .sheet-stat>span:first-child{color:#c4c5b9}
#hero-sheet .sheet-stat output{font-variant-numeric:tabular-nums;color:#f0e7ce;font-weight:500;min-width:45px}
#hero-sheet .sheet-attribute{min-height:29px}
#hero-sheet .sheet-attribute button{position:relative;width:23px;height:23px;background:#d5bd7710;border:1px solid #b59b603d;color:#dec58e;border-radius:4px;box-shadow:none;font:17px 'Segoe UI'}
#hero-sheet .sheet-attribute button:hover:enabled{background:#ccb27126;border-color:#ccb27188}
#hero-sheet button:disabled{opacity:.32}
#hero-sheet .sheet-points{padding-top:12px;border-color:#b7a57224;font:12px 'Segoe UI';color:#bdb99f}
#hero-sheet .sheet-points output{color:#e9d39b;font-weight:600}
#hero-sheet .sheet-footer{position:relative;z-index:var(--sheet-layer-controls);gap:10px;align-items:center}
#hero-sheet .sheet-footer button{min-width:130px;height:36px;padding:7px 16px;border:1px solid #b79a6655;border-radius:6px;box-shadow:none;background:linear-gradient(#b9a16a,#947b49);color:#131c15;font:600 13px 'Segoe UI';line-height:20px}
#hero-sheet #sheet-close{background:#ffffff05;color:#d6cba9;border-color:#b79a6640}
#hero-sheet #sheet-close:hover{background:#ffffff0d;border-color:#b79a6680}
#hero-sheet button:focus-visible{outline:2px solid #dbc38b;outline-offset:2px}
@media(max-height:730px){#hero-sheet{padding:16px}#hero-sheet[open]{gap:10px;grid-template-rows:40px minmax(0,1fr) 38px}#hero-sheet .sheet-stat{min-height:23px;font-size:12px}#hero-sheet .sheet-attribute{min-height:25px}#hero-sheet .sheet-parameters h3{margin-top:9px;padding-bottom:5px;font-size:11px}#hero-sheet .sheet-parameters{padding:12px 14px}}
@media(max-width:600px){#hero-sheet{padding:12px}#hero-sheet .sheet-body{gap:8px;padding-right:8px}#hero-sheet .sheet-parameters{padding:8px}#hero-sheet .sheet-stat{font-size:11px}#hero-sheet .sheet-parameters h3{font-size:10px}#hero-sheet .sheet-header h2{font-size:20px}#hero-sheet .sheet-identity{font-size:10px}#hero-sheet .sheet-slot .sheet-slot-icon{inset:7px;left:7px;top:7px}}

/* Match the game's restrained forest-green and antique-gold visual language. */
#hero-sheet{border-color:#b69a5e75;color:#e9ddba;background:#101a14}
.sheet-window-backdrop{background:radial-gradient(ellipse at 25% 0%,#30432b66,transparent 65%),linear-gradient(145deg,#1a251b,#101a14)}
#hero-sheet .sheet-header{border-bottom-color:#bda26750}
#hero-sheet .sheet-header h2{color:#ecd6a2;text-shadow:0 1px 2px #0008}
#hero-sheet .sheet-equipment{border-color:#a48d5640;background:radial-gradient(ellipse at 50% 42%,#374a3055,#141e1455 75%)}
#hero-sheet .sheet-parameters{border-color:#a48d5640;background:linear-gradient(155deg,#2c352188,#192318bb)}
#hero-sheet .sheet-parameters h3{font-family:Georgia,serif;font-size:14px;font-weight:normal;text-transform:none;letter-spacing:.015em;color:#d1b87e;border-bottom-color:#b9a16b35}
#hero-sheet .sheet-parameters h3::before{content:'◆';font-size:7px;margin-right:7px;vertical-align:2px;color:#ad8c49}
#hero-sheet .sheet-identity{font-family:Georgia,serif;color:#c9bb95;letter-spacing:0}
#hero-sheet .sheet-slot{border-color:#ad945650}
#hero-sheet .sheet-slot.equipped{border-color:#c6a66999}
#hero-sheet .sheet-stat output{color:#eedfba}
#hero-sheet .sheet-footer button{font-family:Georgia,serif;font-weight:normal;font-size:14px;border-color:#bea26477;box-shadow:inset 0 1px 0 #e7cb8f22}
#hero-sheet #sheet-close{background:linear-gradient(#3b3020aa,#231f17aa);color:#e1cca0}
#hero-sheet #sheet-close:hover{background:linear-gradient(#4a3b25aa,#30271baa)}
@media(max-height:730px){#hero-sheet .sheet-parameters h3{font-size:13px}}
@media(max-width:600px){#hero-sheet .sheet-parameters h3{font-size:12px}}

/* Antique metal trim stays a separate, non-interactive layer. */
#hero-sheet{border:1px solid #bca06b;border-radius:9px;box-shadow:inset 0 0 0 2px #080e0b,inset 0 0 0 3px #b3965c38,0 28px 100px #000b,0 0 0 1px #090d09}
#hero-sheet::before{content:'';position:absolute;inset:6px;z-index:7;border:1px solid #9e854749;border-radius:5px;pointer-events:none;background:linear-gradient(#c6a35d99,#c6a35d99) left top/20px 1px no-repeat,linear-gradient(#c6a35d99,#c6a35d99) left top/1px 20px no-repeat,linear-gradient(#c6a35d99,#c6a35d99) right top/20px 1px no-repeat,linear-gradient(#c6a35d99,#c6a35d99) right top/1px 20px no-repeat,linear-gradient(#c6a35d99,#c6a35d99) left bottom/20px 1px no-repeat,linear-gradient(#c6a35d99,#c6a35d99) left bottom/1px 20px no-repeat,linear-gradient(#c6a35d99,#c6a35d99) right bottom/20px 1px no-repeat,linear-gradient(#c6a35d99,#c6a35d99) right bottom/1px 20px no-repeat}
#hero-sheet .sheet-equipment,#hero-sheet .sheet-parameters{border:1px solid #ac915d80;border-radius:5px;box-shadow:inset 0 0 0 2px #0b130a99,inset 0 0 0 3px #b0965720}
#hero-sheet .sheet-slot{border-radius:3px;border-color:#b4995a70;box-shadow:inset 0 0 0 1px #080e0b,inset 0 1px 2px #d4bc7420}
#hero-sheet .sheet-slot.equipped{border-color:#d0ad6ca0;box-shadow:inset 0 0 0 1px #080e0b,inset 0 1px 0 #e5cb8b30,0 0 8px #b08a1915}
#hero-sheet .sheet-header{border-bottom-color:#b79a5e66}
#hero-sheet .sheet-footer button,#hero-sheet #sheet-cross{border-radius:4px;box-shadow:inset 0 0 0 1px #0a130b80,inset 0 1px 0 #e2c99022}

.sheet-window-backdrop{background:linear-gradient(135deg,#17261945,#07100975),url('hero-panel-leather-v1.png') center/384px 384px repeat}
#hero-sheet .sheet-equipment{background:radial-gradient(ellipse at 50% 40%,#35482a66,#0d160f77 80%),url('hero-panel-leather-v1.png') center/320px 320px repeat}
#hero-sheet .sheet-parameters{background:linear-gradient(145deg,#27321e66,#111b1290),url('hero-panel-leather-v1.png') center/384px 384px repeat}

/* Reset game HUD footer geometry for this independent dialog footer. */
#hero-sheet .sheet-footer{height:auto;min-height:0;align-self:stretch;top:auto;right:auto;bottom:auto;left:auto;align-items:center;margin:0}

#hero-sheet .sheet-attribute button[hidden]{display:none}
/* Parchment character sheet: independent metal trim, paper and live controls. */
#hero-sheet{padding:24px;border:0;border-radius:7px;background:#101c18}
#hero-sheet::before{inset:0;border:0;border-radius:0;background:url('hero-window-frame-v1.png') center/100% 100% no-repeat;box-shadow:none}
#hero-sheet .sheet-header{padding:0 6px 10px;border-bottom:1px solid #b29255;background:linear-gradient(90deg,#08151166,transparent)}
#hero-sheet .sheet-header h2{font-size:28px;color:#f0d9a3}
#hero-sheet .sheet-equipment{border:1px solid #bb9a5e;box-shadow:inset 0 0 0 2px #07100d,inset 0 0 0 3px #ae8d4f50}
#hero-sheet .sheet-parameters{background:#e8d8b7 url('hero-parchment-v1.png') center/100% 100%;border:1px solid #b49a70;border-radius:7px;color:#302717;padding:15px 18px;box-shadow:inset 0 0 16px #80572c35,0 2px 5px #0007}
#hero-sheet .sheet-parameters h3{font:18px Georgia,serif;color:#64451f;border-bottom:1px solid #99794b70;margin-top:13px;padding-bottom:5px}
#hero-sheet .sheet-parameters h3::before{content:'❧';font-size:20px;color:#947441;vertical-align:0;margin-right:7px}
#hero-sheet .sheet-stat{font:14px Georgia,serif;min-height:26px}
#hero-sheet .sheet-stat>span:first-child,#hero-sheet .sheet-stat output{color:#2f281c;font-weight:normal;text-shadow:none}
#hero-sheet .sheet-points{color:#49371f;border-color:#99794b70;font:14px Georgia,serif}
#hero-sheet .sheet-points output{color:#302717}
#hero-sheet .sheet-attribute button{color:#eed9a3;background:linear-gradient(#4c4c3d,#222b24);border-color:#947c50;box-shadow:inset 0 0 0 1px #ffffff14}
#hero-sheet .sheet-slot{border:1px solid #b49a64;box-shadow:inset 0 0 0 2px #0a100e,inset 0 0 0 3px #d8bb7540;background:linear-gradient(140deg,#25302b,#080f0c)}
#hero-sheet .sheet-slot.equipped{border-color:#dfbb70;box-shadow:inset 0 0 0 2px #241c0b,inset 0 0 0 3px #d8bb7560,0 0 5px #d6a54130}
#hero-sheet .sheet-footer button,#hero-sheet #sheet-cross{border:1px solid #d0ae70;box-shadow:inset 0 0 0 2px #131611,inset 0 0 0 3px #b3965650,0 2px 4px #0008;color:#efdca9;background:linear-gradient(#364137,#101a15)}
#hero-sheet #sheet-close{background:linear-gradient(#513824,#25190f);color:#f2dfb0;border-color:#d0ae70}
#hero-sheet #sheet-apply:disabled{opacity:.65}
@media(max-height:730px){#hero-sheet{padding:22px}#hero-sheet .sheet-parameters{padding:11px 15px}#hero-sheet .sheet-parameters h3{font-size:16px;margin-top:8px;padding-bottom:3px}#hero-sheet .sheet-stat{font-size:13px;min-height:23px}#hero-sheet .sheet-points{font-size:12px}}
@media(max-width:600px){#hero-sheet{padding:16px}#hero-sheet .sheet-parameters{padding:8px}#hero-sheet .sheet-stat{font-size:11px}#hero-sheet .sheet-parameters h3{font-size:13px}#hero-sheet .sheet-header h2{font-size:22px}}
/* Compensate the artwork's transparent margins: metal rails sit on the window edge. */
#hero-sheet{overflow:visible}
#hero-sheet::before{inset:-25px -23px;background-size:100% 100%}
#hero-sheet .sheet-header{padding-left:28px;padding-right:8px}
/* External trim sits behind the opaque window, never over controls or content. */
#hero-sheet{width:min(940px,calc(100vw - 100px));height:min(690px,calc(100dvh - 100px));overflow:visible}
#hero-sheet::before{inset:-42px;z-index:0;background-size:100% 100%}
#hero-sheet .sheet-window-backdrop{inset:-10px;z-index:0;border-radius:3px;box-shadow:0 0 0 1px #b99b5755}
#hero-sheet .sheet-header{padding-left:6px;padding-right:6px}
/* Nine-slice overlay keeps ornament size independent of the window dimensions. */
#hero-sheet::before{inset:0;z-index:7;background:none;border:32px solid transparent;border-image:url('hero-window-frame-v1.png') 150 / 32px / 12px stretch;box-shadow:none;pointer-events:none}
#hero-sheet .sheet-window-backdrop{inset:0;border-radius:5px;box-shadow:none}
/* Forest sanctuary backdrop and larger outward-facing corner ornaments. */
#hero-sheet::before{border-width:44px;border-image-width:44px;border-image-outset:24px}
#hero-sheet .sheet-equipment{background:linear-gradient(#06110b18,#06110b08),url('hero-preview-scene-v1.png') center/100% 100% no-repeat}
#hero-sheet #sheet-model{top:7%;height:80%}
#hero-sheet .sheet-identity{text-shadow:0 1px 3px #000,0 0 6px #000;color:#edddb6}

/* Modern RPG hierarchy over the established parchment and forest artwork. */
#hero-sheet{padding:24px;box-shadow:0 30px 100px #000d,0 8px 24px #0008}
#hero-sheet[open]{grid-template-rows:58px minmax(0,1fr) 42px;gap:14px}
#hero-sheet .sheet-header{align-items:center;padding:0 4px 10px;background:none;border-bottom:1px solid #b49b5b55}
#hero-sheet .sheet-header h2{font:normal 29px/1.05 Georgia,serif;letter-spacing:.02em}
#hero-sheet .sheet-header h2::before{content:'ПЕРСОНАЖ';display:block;margin-bottom:6px;font:600 9px/1 'Segoe UI',sans-serif;letter-spacing:.22em;color:#b5a476}
#hero-sheet #sheet-cross{width:32px;height:32px;font:22px/28px 'Segoe UI';border-color:#b5a06b70;box-shadow:inset 0 1px 0 #e8d8ab20;background:#0c1715b3;transition:background .15s,border-color .15s}
#hero-sheet .sheet-body{gap:18px;padding-right:18px;grid-template-columns:49% 51%}
#hero-sheet .sheet-equipment{border-color:#ad945a99;box-shadow:inset 0 0 0 3px #06100b70,0 3px 12px #0005}
#hero-sheet .sheet-identity{top:12px;left:20%;right:20%;padding:6px 3px;border-radius:3px;background:linear-gradient(90deg,transparent,#08140dd9 20%,#08140dd9 80%,transparent);font:12px Georgia;color:#eedcb1}
#hero-sheet .sheet-slot-column{top:3%;bottom:3%;gap:8px;width:15%}
#hero-sheet .sheet-slot{border-radius:5px;border-color:#93845b85;background:linear-gradient(140deg,#26332bf0,#080e0bf5);box-shadow:inset 0 1px 0 #ecd49b20,inset 0 0 0 2px #070e0b,0 2px 5px #0007;transition:border-color .16s,box-shadow .16s,background .16s}
#hero-sheet .sheet-slot.equipped{border-color:#c5a260;box-shadow:inset 0 0 0 2px #12140c,inset 0 1px 0 #f1d18a55,0 2px 5px #0008}
#hero-sheet .sheet-slot:hover,#hero-sheet .sheet-slot:focus-visible{border-color:#edd39b;box-shadow:inset 0 0 0 2px #111c12,0 0 12px #d4b25d40}
#hero-sheet .sheet-slot .sheet-slot-icon{opacity:.46;filter:grayscale(.35);inset:9px}
#hero-sheet .sheet-slot.equipped .sheet-item-icon{opacity:1;filter:drop-shadow(0 3px 3px #0009)}
#hero-sheet .sheet-parameters{padding:16px 20px;border-color:#c3a777;border-radius:7px;box-shadow:inset 0 0 0 1px #fff0d633,inset 0 0 20px #8a65272b,0 5px 14px #0006}
#hero-sheet .sheet-parameters h3{display:flex;align-items:center;gap:7px;font:600 11px/18px 'Segoe UI',sans-serif;text-transform:uppercase;letter-spacing:.12em;color:#705126;margin:12px 0 6px;padding-bottom:5px;border-bottom:1px solid #99794b55}
#hero-sheet .sheet-parameters h3:first-child{margin-top:0}
#hero-sheet .sheet-parameters h3::before{font:18px Georgia;margin-right:0;color:#967641}
#hero-sheet .sheet-stat{font:13px/1.3 'Segoe UI',sans-serif;min-height:26px;padding:0 6px;border-radius:3px}
#hero-sheet .sheet-stat output{font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:.01em}
#hero-sheet #sheet-resources{display:grid;grid-template-columns:1.35fr 1fr;gap:8px}
#hero-sheet #sheet-resources .sheet-stat{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:5px;min-height:58px;padding:8px 10px 12px;background:#fff9e52e;border:1px solid #9c7c4930;box-shadow:inset 0 1px 0 #fff9e555}
#hero-sheet #sheet-resources .sheet-stat>span{font:11px 'Segoe UI';color:#6f5b3c}
#hero-sheet #sheet-resources .sheet-stat output{font:600 16px 'Segoe UI';min-width:0}
#hero-sheet #sheet-resources .sheet-stat::after{content:'';position:absolute;left:10px;right:10px;bottom:6px;height:3px;border-radius:2px;background:#446b7780}
#hero-sheet #sheet-resources.uses-energy .sheet-stat:nth-child(2)::after{background:linear-gradient(90deg,#d5a51e var(--sheet-energy-fill,100%),#99794b33 var(--sheet-energy-fill,100%));box-shadow:0 0 4px #d9a91866}
#hero-sheet #sheet-resources .sheet-stat:first-child::after{background:linear-gradient(90deg,#8e4034 0%,#a75843 94%,#99794b33 94%)}
#hero-sheet .sheet-attribute{min-height:28px;background:#ffffff1f;border-bottom:1px solid #9c7c4916;padding:0 7px}
#hero-sheet .sheet-attribute:nth-of-type(even){background:#76502308}
#hero-sheet .sheet-attribute output{color:#6d4a21}
#hero-sheet .sheet-attribute button{width:23px;height:23px;border-radius:3px;background:linear-gradient(#535546,#29332a);border-color:#947d52;box-shadow:inset 0 1px 0 #f3dfb433}
#hero-sheet #sheet-derived .sheet-stat:nth-child(even){background:#79532709}
#hero-sheet .sheet-points{align-items:center;margin-top:auto;padding:9px 6px 0;font:12px 'Segoe UI';border-top:1px solid #99794b55}
#hero-sheet .sheet-points output{display:grid;place-items:center;min-width:27px;height:24px;border-radius:4px;border:1px solid #a88a5138;background:#fff9e54d;font-weight:600}
#hero-sheet .sheet-footer{gap:12px}
#hero-sheet .sheet-footer button{height:38px;min-width:140px;border-radius:4px;font:600 13px 'Segoe UI';letter-spacing:.02em;transition:filter .15s,box-shadow .15s}
#hero-sheet #sheet-close{background:linear-gradient(#463727,#281f16);border-color:#b99b60;color:#f1deb3;box-shadow:inset 0 1px 0 #ead2a130,0 2px 5px #0008}
#hero-sheet #sheet-apply{background:linear-gradient(#c8ab6f,#a18043);color:#172015;border-color:#d6bc80;box-shadow:inset 0 1px 0 #ffe6a95c,0 2px 5px #0008}
#hero-sheet #sheet-apply:disabled{background:linear-gradient(#26372c,#17241c);color:#b5b49a;border-color:#877b5370;opacity:.6}
#hero-sheet .sheet-footer button:hover:enabled{filter:brightness(1.15)}
@media(max-height:730px){#hero-sheet{padding:22px}#hero-sheet[open]{grid-template-rows:52px minmax(0,1fr) 38px;gap:12px}#hero-sheet .sheet-parameters{padding:12px 16px}#hero-sheet .sheet-parameters h3{margin-top:9px;font-size:10px;line-height:15px;padding-bottom:4px;margin-bottom:4px}#hero-sheet .sheet-stat{min-height:23px;font-size:12px}#hero-sheet .sheet-attribute{min-height:26px}#hero-sheet #sheet-resources .sheet-stat{min-height:52px}#hero-sheet #sheet-resources .sheet-stat output{font-size:15px}#hero-sheet .sheet-points{padding-top:7px}}
@media(max-width:600px){#hero-sheet{width:calc(100vw - 50px);padding:16px}#hero-sheet .sheet-body{gap:10px;padding-right:10px}#hero-sheet .sheet-parameters{padding:9px}#hero-sheet .sheet-stat{font-size:10px}#hero-sheet .sheet-header h2{font-size:24px}#hero-sheet #sheet-resources .sheet-stat{padding-left:6px}#hero-sheet #sheet-resources .sheet-stat output{font-size:11px}#hero-sheet .sheet-footer button{min-width:110px}#hero-sheet .sheet-identity{font-size:10px}}
#hero-sheet #sheet-resources .sheet-stat:first-child::after{background:linear-gradient(90deg,#9b4a3b var(--sheet-health-fill,100%),#99794b33 var(--sheet-health-fill,100%))}
#hero-sheet .sheet-points{flex-shrink:0}
@media(max-height:730px){#hero-sheet .sheet-parameters h3{margin-top:7px}#hero-sheet .sheet-attribute{min-height:24px}#hero-sheet #sheet-derived .sheet-stat{min-height:20px}#hero-sheet #sheet-resources .sheet-stat{min-height:48px}#hero-sheet .sheet-points{font-size:11px;padding-top:6px}#hero-sheet .sheet-points output{height:22px}}
/* Keep the slot surface stable while only its trim changes on hover. */
#hero-sheet .sheet-slot{background-color:#0c1510;background-image:linear-gradient(140deg,#26332b,#080e0b);transition:border-color .16s,box-shadow .16s}
#hero-sheet .sheet-slot:hover,#hero-sheet .sheet-slot:focus-visible{background-color:#0c1510;background-image:linear-gradient(140deg,#26332b,#080e0b)}
#hero-sheet .sheet-slot.equipped,#hero-sheet .sheet-slot.equipped:hover,#hero-sheet .sheet-slot.equipped:focus-visible{background-color:#192019;background-image:linear-gradient(145deg,#3a3728,#19211a)}
/* Window interaction: header dragging, with no native text/image selection. */
#hero-sheet,#hero-sheet *{user-select:none;-webkit-user-select:none}
#hero-sheet img,#hero-sheet svg,#hero-sheet canvas{-webkit-user-drag:none}
#hero-sheet .sheet-header{cursor:grab;touch-action:none}
#hero-sheet.sheet-dragging .sheet-header{cursor:grabbing}
#hero-sheet .sheet-header button{cursor:pointer}
#hero-sheet{--sheet-drag-padding:24px}
/* Extend the existing header handle across the top padding and ornate frame. */
#hero-sheet .sheet-header::after{content:'';position:absolute;top:calc(0px - var(--sheet-drag-padding) - 8px);left:calc(0px - var(--sheet-drag-padding) - 8px);right:calc(0px - var(--sheet-drag-padding) - 8px);bottom:0;z-index:-1;cursor:inherit;touch-action:none}
#hero-sheet .sheet-header{user-select:none}
#hero-sheet .sheet-slot.sheet-item-drag-source .sheet-slot-icon{opacity:.35}
#hero-sheet .sheet-slot.sheet-drop-target{border-color:#f3d27e;box-shadow:inset 0 0 0 1px #f3d27e,0 0 12px #c89c5570}
@media(max-height:730px){#hero-sheet{--sheet-drag-padding:22px}}
@media(max-width:600px){#hero-sheet{--sheet-drag-padding:16px}}
#hero-sheet [data-stat-tip]{cursor:help}
#hero-sheet [data-stat-tip]:hover,#hero-sheet [data-stat-tip]:focus-visible{background:#92703818;outline:1px solid #a3834940;outline-offset:-1px}
#hero-sheet .sheet-stat-tooltip{position:absolute;z-index:12;width:280px;max-width:calc(100vw - 24px);box-sizing:border-box;padding:13px 15px;color:#eef0df;background:linear-gradient(145deg,#192219,#0b120e);border:1px solid #bca16a;border-radius:5px;box-shadow:inset 0 0 0 2px #050a07,0 8px 22px #000b;pointer-events:none;text-align:left;font:14px/1.45 'Segoe UI',Arial,sans-serif;text-shadow:none}
#hero-sheet .sheet-stat-tooltip[hidden]{display:none}
#hero-sheet .sheet-stat-tooltip strong{display:block;padding-bottom:7px;margin-bottom:8px;border-bottom:1px solid #b3955860;font:600 17px/1.35 Georgia,serif;color:#ffe2a6}
#hero-sheet .sheet-stat-tooltip p{margin:0 0 8px;color:#eef0df;line-height:1.45}
#hero-sheet .sheet-stat-tooltip small{display:block;color:#cbd4bf;font:13px/1.55 'Segoe UI',Arial,sans-serif;letter-spacing:0}

#hero-sheet .sheet-stat-tooltip small{white-space:pre-line}

#hero-sheet .sheet-attributes-heading{display:flex;align-items:center;gap:8px}

#hero-sheet .sheet-points-counter{margin-left:auto;padding:0;border:0;background:none;box-shadow:none;color:#806342;font:12px/1.3 'Segoe UI',sans-serif;letter-spacing:0;text-transform:none;white-space:nowrap}
#hero-sheet .sheet-points-counter output{margin-left:6px;font-size:15px;font-weight:700;font-variant-numeric:tabular-nums;color:#62431c}
#hero-sheet .sheet-points-counter.has-points output{color:#78501b}
#hero-sheet .sheet-points-counter:hover,#hero-sheet .sheet-points-counter:focus-visible{background:none;outline:none;text-decoration:none}

/* Fixed geometry: only colour and light change during interaction. */
#hero-sheet .sheet-attribute{align-items:center;gap:6px}
#hero-sheet .sheet-attribute button{position:relative;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;flex:0 0 25px;width:25px;min-width:25px;height:25px;min-height:25px;margin:0;padding:0;border:1px solid #8d7850;border-radius:5px;background:linear-gradient(180deg,#465348,#25382c);color:#f3e2b9;font-size:0;line-height:1;box-shadow:inset 0 1px #f8e7be29,0 1px 2px #45300d26;transform:none;transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease,color .18s ease;color-scheme:dark}
#hero-sheet .sheet-attribute button[data-plus]::before,#hero-sheet .sheet-attribute button[data-minus]::before,#hero-sheet .sheet-attribute button[data-plus]::after{content:'';position:absolute;left:50%;top:50%;margin:0;padding:0;transform:translate(-50%,-50%);background:currentColor;border:0;border-radius:1px;pointer-events:none}
#hero-sheet .sheet-attribute button[data-plus]::before,#hero-sheet .sheet-attribute button[data-minus]::before{width:10px;height:2px}
#hero-sheet .sheet-attribute button[data-plus]::after{width:2px;height:10px}
#hero-sheet .sheet-attribute button:hover:enabled,#hero-sheet .sheet-attribute button:focus-visible{background:linear-gradient(180deg,#718264,#3e573e);border-color:#e0ba70;transform:none;filter:none;opacity:1;box-shadow:inset 0 1px #fff0bc66,0 0 0 1px #d6ae5933,0 0 10px #c3984c66;color:#fff3cc}
#hero-sheet .sheet-attribute button:active:enabled{transform:none;background:linear-gradient(180deg,#324733,#486044);box-shadow:inset 0 2px 4px #0005}
#hero-sheet .sheet-attribute button:disabled{background:linear-gradient(180deg,#d1c3a2,#bfb18e);color:#8b7b58;border-color:#b8a985;opacity:.65;box-shadow:none;transform:none;cursor:default}
#hero-sheet .sheet-attribute button[hidden]{display:none}
@media(prefers-reduced-motion:reduce){#hero-sheet .sheet-attribute button{transition:none}}

#hero-sheet .sheet-stat output{white-space:nowrap}
#hero-sheet .sheet-pending-bonus{display:inline-block;margin-left:7px;color:#34783a;font-size:.9em;font-weight:700;line-height:inherit;white-space:nowrap}

/* A separate square class emblem centred below the character. */
#hero-sheet .sheet-class-emblem{position:absolute;left:50%;bottom:4%;transform:translateX(-50%);width:clamp(36px,12%,52px);aspect-ratio:1;z-index:4;display:grid;place-items:center;pointer-events:none;filter:drop-shadow(0 2px 4px #000b)}
#hero-sheet .sheet-class-emblem img.class-icon{display:block;position:static;width:100%;height:100%;margin:0;padding:0;object-fit:contain;transform:none}

#hero-sheet .sheet-class-emblem{box-sizing:border-box;padding:7px;border:1px solid #b99a5f;border-radius:8px;background:radial-gradient(circle at 50% 40%,#48513b,#19281e 58%,#101911);box-shadow:inset 0 0 0 2px #08110bc9,inset 0 0 12px #c7a35e1a,0 3px 8px #0009,0 0 9px #c3a06026;filter:none}
#hero-sheet .sheet-class-emblem img.class-icon{filter:drop-shadow(0 1px 2px #000c)}

/* Generated slim oak-and-emerald frame: preserved corners, uninterrupted rails. */
#hero-sheet::before{inset:-8px;z-index:7;background:none;border:40px solid transparent;border-image:url('hero-window-frame-slim-v2.png') 140 / 40px / 0 stretch;box-shadow:none;pointer-events:none}
