@font-face{font-family:HUDText;src:url('../../../../Fonts/Tinos/Tinos-Regular.ttf')}@font-face{font-family:HUDText;src:url('../../../../Fonts/Tinos/Tinos-Bold.ttf');font-weight:700}
@font-face{font-family:HUDTitle;src:url('../../../../Fonts/CormorantGaramond-Medium.ttf')}
:root{--ink:#101b1ceb;--gold:#ae8950;--gold-dark:#57442c;--cream:#f0e3c5;--jade:#63b29a;--dock-width:920px;--wing-width:220px}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#172321}body{font-family:HUDText,serif;color:var(--cream);font-size:16px;font-variant-numeric:tabular-nums}
button{font:inherit;color:inherit;cursor:pointer}button:focus-visible{outline:2px solid #bde4d7;outline-offset:3px}button:disabled{opacity:.65;cursor:default}button:hover:not(:disabled){box-shadow:inset 0 0 12px #b49b5844;border-color:#ecd098}button[aria-pressed=true]{border-color:var(--jade);background:#23443c;box-shadow:0 0 8px #61b59d55}[hidden]{display:none!important}.btn-portrait-hud{border:0;border-radius:50%;padding:0;background:none;display:flex;flex-shrink:0}
.hud{position:relative;width:100%;height:100%;isolation:isolate}.world{position:absolute;inset:0;background:#23302b url('../../../../../../References/UI/HUD/Gameplay/AZ02_CherryValley_20261006.png') center/cover;z-index:-2}.world:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#03110c33,transparent 28%)}.world-note{position:absolute;left:16px;top:10px;padding:4px 9px;background:#0a1716bb;color:#e4d7b7;font:12px system-ui,sans-serif}
.side-rail{position:absolute;top:29%;left:0;padding:9px 5px;display:flex;flex-direction:column;gap:7px;background:var(--ink);border:1px solid var(--gold);border-left:0;border-radius:0 13px 13px 0;box-shadow:inset -3px 0 0 #57442c}
.btn-menu-hud{width:40px;height:40px;padding:9px;background:#111b1f;border:1px solid #8d713f;border-radius:50%;display:grid;place-items:center}.btn-menu-hud img,.btn-command-hud img{width:100%;height:100%;object-fit:contain}.side-rail img{opacity:.9}
.navigation{position:absolute;top:14px;right:20px;width:178px;text-align:center}.map-preview{width:146px;height:146px;margin:0 auto;border-radius:50%;border:3px solid var(--gold);box-shadow:0 0 0 3px #172320,0 0 0 4px #5b4d35,inset 0 0 25px #000;background:linear-gradient(35deg,#0c201fa8,#45564777),url('../../../../../../References/UI/HUD/Gameplay/AZ02_CherryValley_20261006.png') center/cover;position:relative}.north{position:absolute;top:-11px;left:calc(50% - 9px);background:#152622;padding:0 5px;font-size:14px}.map-marker{position:absolute;top:57px;left:62px;color:#82dfff;font-size:29px}.region{padding:4px 8px;margin:8px -7px 0;background:var(--ink);border:1px solid var(--gold);border-radius:12px;font-size:15px}.objective{margin:11px -30px 0;padding:5px 7px;background:#101b1ccc;font-size:15px;line-height:1.15}
.bottom-foundation{position:absolute;bottom:0;left:0;right:0;height:17px;background:#101918eb;border-top:2px solid var(--gold-dark);box-shadow:0 -1px var(--gold)}
.instruments{position:absolute;bottom:0;left:50%;transform:translateX(-50%);display:flex;align-items:flex-end;width:max-content;height:138px}
.player-dock{position:relative;flex:0 0 var(--dock-width);width:var(--dock-width);display:grid;grid-template-columns:124px 1fr 124px;align-items:end;gap:0}
.action-bed{height:106px;background:linear-gradient(#122127f5,#0c1117f5);border-top:3px solid #a88c58;border-bottom:3px solid #856941;padding:16px 10px 8px;position:relative;box-shadow:inset 0 1px #d3b772,inset 0 -2px #332b20}
.action-bed:before,.action-bed:after{content:"";position:absolute;top:-11px;width:25px;height:25px;border:3px double var(--gold);border-radius:50%;background:#162b27;z-index:2}.action-bed:before{left:-15px}.action-bed:after{right:-15px}
.cultivation-meter{position:absolute;top:2px;left:12px;width:calc(100% - 24px);height:6px}.hotbar{height:77px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) 14px repeat(4,minmax(0,1fr));gap:8px;align-items:start}
.btn-skill-hud,.btn-item-hud{position:relative;width:100%;height:58px;padding:3px;border:1px solid #b19357;border-radius:3px;background:#0a131a;box-shadow:inset 0 0 0 2px #20231f}.btn-skill-hud>img{width:100%;height:100%;object-fit:cover}.btn-item-hud>img{width:75%;height:75%;object-fit:contain;filter:sepia(.5);padding:4px}.btn-item-hud:nth-last-child(4){background:radial-gradient(#76302d,#101820)}.btn-item-hud:nth-last-child(3){background:radial-gradient(#184e68,#101820)}.btn-item-hud:last-child{background:radial-gradient(#284a2c,#101820)}
kbd{font:14px HUDText,serif;border:1px solid #927344;border-radius:3px;background:#101619;padding:1px 7px;color:var(--cream)}
.hotbar kbd{position:absolute;bottom:-23px;left:50%;transform:translateX(-50%);min-width:27px;text-align:center}.item-count{position:absolute;right:5px;bottom:3px;font-size:14px;text-shadow:1px 1px #000}.cooldown{position:absolute;inset:0;background:#081118bd;display:grid;place-items:center;font-size:22px}.slot-divider{height:54px;margin:auto;border-left:1px solid var(--gold);position:relative}.slot-divider:after{content:"◇";position:absolute;top:14px;left:-8px;font-size:19px;background:#172120}
.orb-health,.orb-qi{position:relative;height:138px;text-align:center;background:linear-gradient(0deg,#10191c 18%,transparent 19%);z-index:3}
.orb-glass{position:absolute;left:11px;top:10px;width:102px;height:102px;border-radius:50%;overflow:hidden;background:radial-gradient(circle at 38% 20%,#84929366,#151317 75%);box-shadow:inset 0 0 10px #000}
.orb-glass:after{content:"";position:absolute;inset:0;border-radius:50%;background:radial-gradient(ellipse at 70% 24%,#fff9 0,transparent 9%),radial-gradient(ellipse at 30% 35%,#fff2,transparent 40%);box-shadow:inset 0 -7px 15px #0007}
.orb-fluid{position:absolute;bottom:0;left:0;right:0;border-top:2px solid #ffc2bacc;background:radial-gradient(ellipse at 30% 0,#ed3025,#a21017 75%);height:74%;box-shadow:0 -2px 7px #ff483266}.orb-qi .orb-fluid{height:58%;border-color:#a1e9ff;background:radial-gradient(ellipse at 30% 0,#1a9fe3,#10387f 75%);box-shadow:0 -2px 7px #26a7ff66}
.orb-bezel{position:absolute;top:0;left:-8px;width:140px;height:126px;pointer-events:none}
.orb-health output,.orb-qi output{position:absolute;bottom:0;left:0;width:124px;height:26px;padding-top:4px;background:#101a1f;border-top:1px solid #a48a52;border-bottom:2px solid #826744;border-radius:5px;font-size:15px;white-space:nowrap}
.companion-wing{position:relative;flex:0 0 var(--wing-width);margin-right:-14px;width:var(--wing-width);height:112px;padding:10px 20px 7px 10px;background:linear-gradient(110deg,#14262af7,#10191ff7);border:1px solid var(--gold);border-radius:15px 17px 0 0;box-shadow:inset 0 0 0 3px #332e24;z-index:1}.companion-identity{display:flex;align-items:center;gap:9px;height:56px}.portrait{width:51px;height:51px;object-fit:cover;border-radius:50%;border:2px solid var(--gold)}.companion-identity>div{min-width:0;flex:1}.companion-identity strong,.companion-identity span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.companion-identity strong{font-size:15px}.companion-identity span{font-size:12px;color:#d3c7b0;margin:1px 0 3px}.companion-identity progress{display:block;width:100%;height:5px;margin-top:4px}
.command-row{display:flex;justify-content:space-between;gap:6px;margin-top:6px}.btn-command-hud{width:29px;height:29px;padding:6px;display:grid;place-items:center;background:#111b1f;border:1px solid #a38654;border-radius:50%}
progress{appearance:none;-webkit-appearance:none;display:block;background:#101719;color:var(--jade);border:0;overflow:hidden;border-radius:2px}progress::-webkit-progress-bar{background:#101719;box-shadow:inset 0 1px #060a0e}progress::-webkit-progress-value{background:linear-gradient(0deg,#347768,#8cbba6)}.pet-health::-webkit-progress-value,.framed-meter progress::-webkit-progress-value,.enemy-panel progress::-webkit-progress-value{background:linear-gradient(0deg,#882426,#df4d39)}.pet-qi::-webkit-progress-value{background:linear-gradient(0deg,#164b8c,#43a9c7)}

.boss-panel{position:absolute;top:12px;left:50%;transform:translateX(-50%);width:min(580px,48%);text-align:center;text-shadow:1px 1px 3px #000;padding:3px 20px 6px;background:linear-gradient(90deg,transparent,#101b1bd9 15%,#101b1bd9 85%,transparent)}h1{font:600 24px HUDTitle,serif;margin:0;letter-spacing:1px}.boss-kind{font-size:14px;margin:0 0 5px}.framed-meter{position:relative;border:3px double var(--gold);padding:3px;background:#0c181df2;border-radius:9px;box-shadow:0 2px 5px #000b}.framed-meter:before,.framed-meter:after{content:"";position:absolute;top:-17px;width:48px;height:48px;background:url('Assets/cloud-cap.svg') center/contain no-repeat;pointer-events:none}.framed-meter:before{left:-33px}.framed-meter:after{right:-33px;transform:scaleX(-1)}.framed-meter progress{height:14px;width:100%}.boss-value{font-size:13px;margin:3px 0 0}
.enemy-panel{position:absolute;top:37%;left:57%;width:160px;padding:4px 7px;background:#11191bc9;border-radius:3px;font-size:13px;text-shadow:1px 1px #000}.enemy-panel progress{height:5px;width:100%;margin-top:4px;border:1px solid #a5854e}.enemy-mark{color:#e8c779;margin-right:4px}
.context-panel{position:absolute;left:50%;bottom:165px;transform:translateX(-50%);display:flex;align-items:center;gap:13px;width:354px;min-height:68px;padding:11px 17px;background:linear-gradient(110deg,#1b292bf5,#0d171bf5);border:1px solid var(--gold);border-radius:6px;box-shadow:inset 0 0 0 3px #332e24,0 2px 10px #0008}.context-panel:before,.context-panel:after{content:"";position:absolute;top:calc(50% - 23px);width:46px;height:46px;background:url('Assets/cloud-cap.svg') center/contain no-repeat;pointer-events:none}.context-panel:before{left:-27px}.context-panel:after{right:-27px;transform:scaleX(-1)}
.context-symbol{width:30px;height:30px;opacity:.9;flex-shrink:0}.context-copy{flex:1}.context-copy strong,.context-copy span{display:block}.context-copy strong{font-size:18px}.context-copy span{font-size:14px;color:#d0c6b0;margin-top:3px}
.btn-interact-hud,.btn-contract-hud{display:flex;gap:9px;align-items:center;padding:7px 11px;border:1px solid #a98a50;border-radius:4px;background:#173a33;font-size:16px}.btn-interact-hud kbd,.btn-contract-hud kbd{min-width:27px;text-align:center}
.encounter-panel{width:450px;align-items:flex-start}.encounter-copy{flex:1;min-width:0}.encounter-heading{display:flex;justify-content:space-between;align-items:center;gap:10px}.encounter-heading strong{font-size:19px}.rarity{font-size:12px;color:#e0c886;white-space:nowrap}.state-label{font-size:15px;margin:6px 0 10px;color:#c1d8c7}.resolve-row{display:flex;justify-content:space-between;font-size:13px;color:#ded4bd;margin-bottom:4px}.resolve-meter{height:6px;width:100%;border:1px solid #796d46}.eligibility{margin:8px 0;font-size:14px;color:#d0c5ac;line-height:1.25}.encounter-actions{display:flex;align-items:center;justify-content:space-between;gap:8px}.btn-contract-hud{font-size:15px;padding:5px 9px}
.presence-panel{position:absolute;right:20px;top:280px;width:285px;display:flex;flex-direction:column;flex-wrap:nowrap;align-items:stretch;gap:9px;padding:11px;background:var(--ink);border:1px solid var(--gold);border-radius:5px}.presence-panel img{width:29px;height:29px}.presence-panel p{font-size:13px;margin:4px 0 0}.btn-presence-hud{font-size:14px;padding:5px 11px;border:1px solid #a38a56;border-radius:4px;background:#152f2b}.tutorial-panel{position:absolute;right:20px;bottom:165px;width:285px;padding:13px 15px;background:var(--ink);border:1px solid var(--gold);border-radius:5px}.tutorial-panel h2{font-size:20px;margin:0 0 7px}.tutorial-panel p{font-size:15px;line-height:1.3;margin:0 0 11px}
.preview-notice{position:absolute;left:50%;top:24%;transform:translateX(-50%);background:#102321f2;border:1px solid #91b89f;border-radius:5px;padding:9px 14px;font-size:15px}
@media(max-width:1500px){:root{--dock-width:780px;--wing-width:205px}.player-dock{grid-template-columns:112px 1fr 112px}.orb-health,.orb-qi{width:112px}.orb-glass{left:10px;width:92px;height:92px;top:17px}.orb-bezel{left:-8px;top:7px;width:128px;height:116px}.orb-health output,.orb-qi output{width:112px;font-size:14px}.hotbar{gap:5px}.btn-skill-hud,.btn-item-hud{height:51px}.action-bed{height:99px}.hotbar kbd{bottom:-24px}.companion-wing{height:112px}.navigation{width:151px;right:13px}.map-preview{width:122px;height:122px}.map-marker{top:43px;left:51px}.objective{font-size:14px;margin-left:-20px;margin-right:-8px}.boss-panel{width:48%}.side-rail{top:25%}}
@media(max-width:1100px){:root{--dock-width:680px;--wing-width:176px}.hotbar{gap:3px;grid-template-columns:repeat(4,minmax(0,1fr)) 7px repeat(4,minmax(0,1fr))}.companion-wing{padding-left:6px;padding-right:14px}.portrait{width:40px;height:40px}.command-row{gap:4px}.btn-command-hud{width:25px;height:25px}.companion-identity strong{font-size:14px}.companion-identity span{font-size:11px}.navigation{width:137px}.map-preview{width:106px;height:106px}.map-marker{top:37px;left:41px}.region{font-size:13px}.objective{font-size:13px}.tutorial-panel,.presence-panel{width:230px}.boss-panel{width:48%}h1{font-size:21px}}

/* A review gallery is separate from the full-screen HUD/conversion source. */
.component-preview .world,.component-preview .world-note,.component-preview .navigation,.component-preview .side-rail,.component-preview .bottom-foundation,.component-preview .instruments{display:none}
.component-preview .hud{background:radial-gradient(ellipse at 50% 25%,#253736,#111b20)}
.component-preview .context-panel{top:50%;bottom:auto;transform:translate(-50%,-50%);width:calc(100% - 70px);max-width:410px}
.component-preview .boss-panel{top:24px;width:calc(100% - 70px);max-width:580px}
.component-preview .enemy-panel{top:auto;bottom:40px;left:50%;transform:translateX(-50%)}
.component-preview .presence-panel{top:50%;bottom:auto;right:auto;left:50%;width:calc(100% - 60px);max-width:350px;transform:translate(-50%,-50%)}
.component-preview .preview-notice{top:8px;width:90%;font-size:13px}

.player-effects{position:absolute;top:-47px;left:12px;right:12px;display:flex;justify-content:space-between;gap:14px;align-items:flex-start}.effect-group{display:flex;gap:5px;align-items:center}.btn-buff-hud,.btn-debuff-hud{position:relative;width:32px;height:32px;padding:6px 6px 9px;background:#102522ee;border:1px solid #78b597;border-radius:4px}.btn-debuff-hud{background:#301b22ee;border-color:#e0927d;border-radius:4px 4px 9px 9px}.btn-buff-hud img,.btn-debuff-hud img{width:100%;height:100%;object-fit:contain}.effect-polarity{position:absolute;top:-3px;right:1px;font-size:12px;text-shadow:1px 1px #000}.effect-duration{position:absolute;bottom:-3px;left:0;right:0;font-size:11px;background:#0c171df5;border-top:1px solid #726540;border-radius:0 0 3px 3px;text-align:center}.effect-stack{position:absolute;top:-3px;right:1px;font-size:12px;text-shadow:1px 1px #000}
.tutorial-overlay{position:absolute;inset:0;z-index:30;background:#071214bd;display:flex;align-items:center;justify-content:center;padding:26px}.tutorial-dialog{width:min(740px,90vw);max-height:calc(100vh - 52px);overflow:auto;padding:25px 30px 20px;background:linear-gradient(125deg,#203131,#101c22);border:2px solid #b29964;border-radius:9px;box-shadow:inset 0 0 0 4px #342e24,0 10px 60px #000b}.tutorial-category{font-size:13px;letter-spacing:2px;color:#c4b282;margin:0 0 5px}.tutorial-dialog h2{font:600 35px HUDTitle,serif;margin:0 0 9px}.tutorial-intro{font-size:18px;line-height:1.35;margin:0 0 17px;color:#e0d7c1}.tutorial-example{display:grid;grid-template-columns:1fr 20px 1fr 20px 1fr;gap:8px;align-items:center;padding:16px;background:#0b171ce0;border:1px solid #8a784e;border-radius:5px}.example-step{display:flex;flex-direction:column;align-items:center;gap:7px;text-align:center;min-width:0}.example-step img{width:62px;height:62px;object-fit:contain}.example-step:first-child img{border-radius:50%;border:1px solid #ab8a55}.example-step strong{font-size:17px;font-weight:400}.example-step>span{font-size:14px;color:#dbd0b6}.example-step progress{width:80%;height:7px}.example-health::-webkit-progress-value{background:linear-gradient(0deg,#982a2b,#e9714d)}.example-contract{font-size:11px!important;letter-spacing:1px;color:#accdb3!important;padding:3px 6px;border:1px solid #739b78;border-radius:3px}.example-arrow{font-size:32px;color:#b89a60}.example-caption{font-size:12px;color:#bac1b4;text-align:center;margin:7px 0 15px}.tutorial-description{display:grid;grid-template-columns:1fr 1fr;gap:24px}.tutorial-description p{font-size:17px;line-height:1.3;margin:0 0 15px;color:#d6cbb4}.tutorial-description strong{font-size:19px;font-weight:400;color:#efe3c5}.tutorial-footer{display:flex;align-items:center;justify-content:space-between;gap:15px;padding-top:13px;border-top:1px solid #8b794b}.tutorial-footer>span{font-size:13px;color:#bdc4b6;max-width:400px}.tutorial-footer button{padding:8px 22px}
.component-preview .tutorial-overlay{padding:14px}.component-preview .tutorial-dialog{width:100%;max-height:calc(100vh - 28px);padding:18px 24px}.component-preview .tutorial-intro{font-size:16px}.component-preview .tutorial-dialog h2{font-size:29px}.component-preview .tutorial-description p{font-size:15px}.component-preview .tutorial-example{padding:10px}.component-preview .example-step strong{font-size:15px}
@media(max-width:1100px){.player-effects{left:6px;right:6px}.effect-group{gap:4px}.tutorial-dialog{padding:21px 24px}.tutorial-dialog h2{font-size:30px}}

.boss-effects{position:absolute;top:calc(100% + 8px);left:50%;transform:translateX(-50%);display:flex;justify-content:center;gap:5px}.enemy-effects{position:absolute;left:0;top:-38px;display:flex;gap:5px}.beast-effects{position:absolute;left:10px;top:-39px;display:flex;gap:5px}.boss-effects .btn-buff-hud,.boss-effects .btn-debuff-hud,.enemy-effects .btn-buff-hud,.enemy-effects .btn-debuff-hud,.beast-effects .btn-buff-hud,.beast-effects .btn-debuff-hud{width:28px;height:28px;padding:5px 5px 8px}
.hud-tooltip{position:absolute;z-index:50;width:265px;padding:11px 14px;background:linear-gradient(125deg,#233331fa,#0d1b23fa);border:1px solid #bea471;border-radius:6px;box-shadow:inset 0 0 0 3px #3c3324,0 5px 20px #000a;color:#eee3c7;pointer-events:auto}.hud-tooltip>strong{display:block;font-size:19px;font-weight:400}.hud-tooltip>span{display:block;font-size:13px;color:#adc9b7;margin-top:4px}.hud-tooltip>p{font-size:15px;line-height:1.3;margin:8px 0 0;border-top:1px solid #a38b4c77;padding-top:7px}

.tutorial-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:9px}.tutorial-heading .tutorial-category{margin:0}.tutorial-heading>span{font-size:12px;letter-spacing:1px;white-space:nowrap;color:#806b41}.tutorial-description{margin-top:20px}.tutorial-footer>div{max-width:470px;color:#675734;font-size:14px;line-height:1.25}.tutorial-dots{display:flex;gap:7px;margin-top:12px}.tutorial-dot{width:7px;height:7px;border:1px solid #a38854;border-radius:50%;background:#cdbf9f}.tutorial-dot[data-active="true"]{background:#426d5b;border-color:#426d5b}.tutorial-example .example-step{position:relative}.tutorial-example .example-step progress{margin:0 8px 4px;width:calc(100% - 16px)}.tutorial-example .example-step progress::-webkit-progress-value{background:#718f76}.tutorial-example .example-step:first-child progress::-webkit-progress-value{background:#a65042}.tutorial-example .example-step progress[hidden]{display:none}.tutorial-dialog{width:min(810px,94vw)}
@media(max-width:650px){.tutorial-overlay{padding:12px}.tutorial-dialog{padding:18px}.tutorial-heading{align-items:flex-start}.tutorial-heading .tutorial-category{font-size:10px}.tutorial-dialog h2{font-size:28px}.tutorial-intro{font-size:16px}.tutorial-example{grid-template-columns:1fr;gap:10px}.example-arrow{display:none}.tutorial-description{grid-template-columns:1fr;gap:0}.tutorial-footer{align-items:flex-start}.tutorial-footer button{padding:8px 12px}.tutorial-example .example-step img{height:68px}}
.orb-glass{--fill:74}.orb-qi .orb-glass{--fill:58}.orb-fluid{height:calc(var(--fill)*1%);background:radial-gradient(ellipse at 36% 9%,#ff806d80,transparent 55%),linear-gradient(180deg,#ed493b 0%,#bb1822 40%,#640b19 100%);box-shadow:0 -2px 8px #ff695a66,inset 0 -10px 20px #3c020a77}.orb-qi .orb-fluid{height:calc(var(--fill)*1%);background:radial-gradient(ellipse at 36% 9%,#97e7ff80,transparent 55%),linear-gradient(180deg,#36b9f1 0%,#1668bf 45%,#102751 100%);box-shadow:0 -2px 8px #62d8ff77,inset 0 -10px 20px #04112988}.orb-fluid:before{content:"";position:absolute;top:-4px;left:-3%;width:106%;height:8px;border-radius:50%;background:linear-gradient(180deg,#ffdfcae6,#ef725c70);box-shadow:0 0 7px #ffab9066}.orb-qi .orb-fluid:before{background:linear-gradient(180deg,#d9f8fff2,#6ecefa70);box-shadow:0 0 7px #91e9ff66}
.tutorial-heading .tutorial-category{width:auto;max-width:calc(100% - 110px);white-space:normal;background:#1b2d30;color:#efdec1;border:1px solid #a88c57;padding:5px 10px;line-height:1.35}
.component-preview .boss-panel{top:12px}.component-preview .enemy-panel{bottom:20px}
/* One right-edge card stack: square map, attached title footer, aligned notices. */
.navigation{width:220px}
.map-preview{width:100%;height:auto;aspect-ratio:1;border:2px solid var(--gold);border-radius:7px 7px 0 0;box-shadow:inset 0 0 20px #0008;background-color:#162b29}
.map-marker{left:50%;top:50%;transform:translate(-50%,-50%)}
.region{margin:-1px 0 0;border:2px solid var(--gold);border-top:1px solid #74603f;border-radius:0 0 6px 6px;padding:6px 7px;background:#122025f2;font-size:14px}
.objective{width:100%;margin:10px 0 0;padding:8px 9px;border:1px solid #9d834f;border-radius:5px;background:#101b1ce6;text-align:left;font-size:14px}
@media(max-width:1500px){.navigation{width:196px}.region,.objective{font-size:13px}}
@media(max-width:1100px){.navigation{width:176px}.region,.objective{font-size:12px}}
/* Popup family draws on Interaction actions, Growth item cards and Bond events. */
.interact-panel,.encounter-panel,.presence-panel,.tutorial-dialog,.hud-tooltip{
 color:#393127;background:#f1e7ce;
 background-image:linear-gradient(110deg,#f8efd78c,#ecdfc273),url('../../../../Shared/RecordV2/Surfaces/PaperTile.png');
 background-position:center;background-size:100% 100%,180% 180%;
 border:1px solid #c3ad7c;border-image:none;border-radius:4px;
 box-shadow:inset 0 0 0 1px #fff9e455,0 4px 18px #08121066;text-shadow:none
}
.encounter-panel{padding:15px 17px;gap:12px}
.encounter-heading{margin:0;padding:0 0 6px;background:none;color:#393127;border-bottom:1px solid #b9a77688;border-radius:0;align-items:flex-start;flex-wrap:wrap;gap:5px 10px}
.encounter-heading strong{font-family:HUDTitle,serif;font-size:23px;font-weight:600;line-height:1.1}
.encounter-panel .state-label{color:#78613c;font-size:16px}.encounter-panel .resolve-row{color:#4b4235}.encounter-panel .eligibility{color:#504739;line-height:1.3}
.encounter-panel .btn-contract-hud,.tutorial-dialog .btn-contract-hud,.presence-panel .btn-presence-hud{background:linear-gradient(180deg,#303637,#172227);color:#efe3c5;border-color:#ac9159;box-shadow:inset 0 0 0 2px #c3a46822}
.encounter-panel .btn-contract-hud:disabled{background:#55534e;color:#d7ccb5;opacity:1}
.encounter-panel:before,.encounter-panel:after{display:none}
.presence-panel{padding:15px;gap:10px;width:var(--notice-width,285px)}.presence-panel>div{flex:none;min-width:0}.presence-panel strong{font:600 22px/1.1 HUDTitle,serif;color:#3c3225}.presence-panel p{font-size:14px;color:#5b5040;line-height:1.25}
.presence-heading img{filter:brightness(0) saturate(100%) invert(29%) sepia(16%) saturate(1000%) hue-rotate(356deg)}
.tutorial-dialog{padding:27px 31px 23px}
.tutorial-category{color:#f0e5cd;background:linear-gradient(90deg,#18262b,#535657cc 42%,#c2b89755 78%,transparent);padding:6px 9px;border-bottom:1px solid #b8a372;margin:0 0 13px;font-size:12px;letter-spacing:1px}
.tutorial-dialog h2{color:#3c3225}.tutorial-intro{color:#504739}
.tutorial-example{background:none;color:#efe4c9;border:0;box-shadow:none;padding:0;align-items:stretch;gap:7px}
.example-step{padding:10px 7px 0;background:linear-gradient(135deg,#27353a,#152228);border:1px solid #ac9159;border-radius:3px;overflow:hidden;justify-content:flex-end;gap:8px}
.example-step img{width:70px;height:70px;flex-shrink:0}.example-step strong{font-size:16px;min-height:38px;display:flex;align-items:center;justify-content:center;line-height:1.12}
.example-step>span:last-child{align-self:stretch;margin:0 -7px;padding:7px 5px;border-top:1px solid #bfa46c;background:linear-gradient(90deg,#e5d7b8,#f4ebd6);color:#4a4030;font-size:14px}
.example-arrow{align-self:center;color:#a58b55}
.example-contract{color:#e1c997!important;border-color:#aa8d59}
.example-caption{color:#796d56}.tutorial-description p{color:#504739}.tutorial-description strong{color:#3c3225}.tutorial-footer{border-color:#b6a071}.tutorial-footer>span{color:#796d56}
.hud-tooltip{padding:12px 14px;pointer-events:none}
.hud-tooltip>strong{font:600 21px/1.1 HUDTitle,serif;color:#3c3225;padding-bottom:5px;border-bottom:1px solid #b9a77688}
.hud-tooltip>span{color:#776140;font-size:13px;line-height:1.25}
.hud-tooltip>p{color:#504739;font-size:15px;border-top:0;padding-top:0;margin-top:7px}
@media(max-width:1100px){.presence-panel{--notice-width:230px}.presence-panel strong{font-size:20px}}
/* Notices follow the map/quest card in normal flow, avoiding viewport offsets. */
.right-hud-stack{position:absolute;top:14px;right:20px;width:220px;display:flex;flex-direction:column;gap:10px}
.right-hud-stack .navigation{position:static;width:100%}
.right-hud-stack .presence-panel{position:static;width:100%;padding:12px;gap:8px}
.presence-heading img{width:23px;height:23px;object-fit:contain;flex-shrink:0}
.right-hud-stack .presence-panel strong{font-size:21px}
.right-hud-stack .presence-panel p{font-size:14px}
.presence-actions .btn-presence-hud{flex:1;min-width:0;padding:6px 7px}
@media(max-width:1500px){.right-hud-stack{right:13px;width:196px}}
@media(max-width:1100px){.right-hud-stack{width:176px}.right-hud-stack .presence-panel strong{font-size:19px}}
.component-preview .right-hud-stack{display:contents}
.component-preview .right-hud-stack .presence-panel{position:absolute;top:50%;right:auto;left:50%;width:calc(100% - 60px);max-width:350px;transform:translate(-50%,-50%);padding:15px}
.component-preview .right-hud-stack .presence-panel strong{font-size:22px}

/* Resolve remains gold on parchment; effect polarity keeps its gameplay colors. */
.encounter-panel .resolve-meter::-webkit-progress-value{background:linear-gradient(0deg,#80663e,#b59a65)}
.encounter-panel .resolve-meter::-moz-progress-bar{background:linear-gradient(0deg,#80663e,#b59a65)}

/* Growth roots and Bond preferred-food rows become compact encounter hints. */
.encounter-elements{display:flex;align-items:center;gap:6px 14px;flex-wrap:wrap;margin:8px 0}
.root-element-hud{display:flex;align-items:center;gap:5px;color:#4b4235;font-size:15px}
.root-element-hud img{width:20px;height:20px;object-fit:contain;flex-shrink:0}
.hybrid-tag-hud{padding:2px 6px;border:1px solid #c2ae7c;border-radius:3px;background:#ddd1b6;color:#4c4436;font-size:12px}
.food-hint-hud{display:flex;align-items:center;gap:9px;margin:10px 0 12px;padding:7px;border:1px solid #c9b98b;border-radius:3px;background:#f8efd766}
.food-hint-art{width:49px;height:49px;object-fit:contain;background:#1b272c;border:1px solid #b99f68;border-radius:3px;flex-shrink:0}
.food-hint-copy{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.food-hint-label{font-size:12px;color:#796d56}.food-hint-copy strong{font-size:17px;font-weight:400}.food-hint-preference{font-size:13px;color:#9a4e3c}
.food-hint-quantity{font-size:13px;color:#796d56;max-width:62px;text-align:right}

/* One compact identity column: menu portrait, rarity/form, then stacked tags. */
.encounter-identity{width:96px;flex:0 0 96px;display:flex;flex-direction:column;align-items:stretch;gap:7px;padding-right:10px;border-right:1px solid #b9a77688}
.encounter-portrait{display:block;width:85px;height:85px;object-fit:cover;border:1px solid #ac9159;border-radius:3px;background:#172227}
.form-tag-hud,.encounter-class-tag{display:flex;align-items:center;justify-content:center;min-height:26px;font-size:13px;font-weight:400;text-align:center;padding:4px 6px;border-radius:3px;line-height:1.2;white-space:nowrap}
.form-tag-hud{border:1px solid #8f9d80;background:#657d69;color:#fff2d7}
.encounter-identity .encounter-elements{flex-direction:column;align-items:stretch;gap:5px;margin:0}
.encounter-identity .root-element-hud,.encounter-identity .hybrid-tag-hud{min-height:24px;padding:3px 5px;border:1px solid #c9b98b;border-radius:3px;background:#e5d9bd;color:#4b4235;font-size:13px;line-height:1.15}
.encounter-identity .root-element-hud img{width:16px;height:16px}
.encounter-identity .hybrid-tag-hud{text-align:center;background:#dce4e0;border-color:#b3c3c0;color:#45606b}
.component-preview .encounter-panel{max-width:450px}
@media(max-width:520px){.encounter-panel{width:calc(100% - 30px);padding:12px;gap:10px}.encounter-identity{width:86px;flex-basis:86px;padding-right:8px}.encounter-portrait{width:77px;height:77px}.encounter-heading strong{font-size:21px}}

.presence-heading{display:flex;align-items:center;gap:8px;min-width:0}.presence-heading strong{flex:1;min-width:0}.presence-panel .presence-description{margin:0;line-height:1.3}.presence-actions{display:flex;align-items:center;gap:8px;width:100%}

/* Rarity/class belong at the upper right; the portrait owns its full form tag. */
.encounter-heading{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:8px}
.encounter-heading strong{min-width:0;overflow-wrap:break-word}
.encounter-badges{display:flex;flex-direction:column;align-items:stretch;gap:5px;max-width:130px}
.encounter-class-tag{border:1px solid #b9aec8;background:#e3ddea;color:#665773;white-space:normal}
.form-tag-hud{width:100%}

.encounter-class-tag[data-variant="special"]{background:#ddd1b6;border-color:#c2ae7c;color:#4c4436}.encounter-class-tag[data-variant="celestial"]{background:#eee0b9;border-color:#c4ae70;color:#766333}


/* Flex width follows visible children: player alone or player plus overlapping wing. */
/* Two quest rows: category tag, then current objective and a compact open action. */
.quest-type-tag{display:inline-flex;align-items:center;border:1px solid #ad945c;border-radius:3px;padding:2px 6px;color:#ead29b;background:#54452c;font-size:12px;line-height:1.2}
.quest-type-tag[data-type="side"]{background:#35413e;border-color:#879887;color:#c8d4c5}
.quest-type-tag[data-type="sect"]{background:#3e394d;border-color:#958baa;color:#d4c9e4}
.quest-type-tag[data-type="world"]{background:#2e414b;border-color:#7899a8;color:#c7dce5}
.quest-goal-row{display:flex;align-items:center;gap:8px;margin-top:8px}
.quest-goal{flex:1;min-width:0;margin:0;font-size:14px;line-height:1.25;color:#e1d8c3}
.btn-quest-hud{display:flex;align-items:center;justify-content:center;width:25px;height:25px;flex:0 0 25px;padding:0;background:#111b1f;border:1px solid #a38654;border-radius:50%;color:#efe3c5;font-family:HUDText,serif;font-size:16px;font-weight:700;line-height:1}
@media(max-width:1100px){.quest-goal{font-size:13px}}

/* Nearby interaction uses the same parchment reading surface and ink action. */
.interact-panel{flex-direction:column;align-items:stretch;gap:10px;width:354px;max-width:calc(100% - 32px);min-height:0;padding:13px 15px}
.interact-panel:before,.interact-panel:after{display:none}
.interact-heading{display:flex;align-items:center;gap:11px;padding-bottom:9px;border-bottom:1px solid #b9a77688}
.interact-symbol{display:flex;align-items:center;justify-content:center;flex:0 0 36px;width:36px;height:36px;padding:7px;border:1px solid #ac9159;border-radius:50%;background:#172227}
.interact-symbol img{width:100%;height:100%;object-fit:contain}
.interact-heading strong{flex:1;min-width:0;font:600 23px/1.12 HUDTitle,serif;color:#393127;overflow-wrap:break-word}
.interact-details{display:flex;align-items:center;gap:12px}
.interact-details p{flex:1;min-width:0;margin:0;color:#5b5040;font-size:15px;line-height:1.3}
.interact-panel .btn-interact-hud{flex:0 0 auto;justify-content:center;gap:7px;padding:6px 9px;background:linear-gradient(180deg,#303637,#172227);color:#efe3c5;border:1px solid #ac9159;box-shadow:inset 0 0 0 2px #c3a46822;white-space:nowrap}
.interact-panel .btn-interact-hud kbd{padding:1px 5px;font-size:13px;min-width:23px}
.component-preview .interact-panel{max-width:354px}
@media(max-width:520px){.interact-panel{padding:11px 12px}.interact-heading strong{font-size:21px}.interact-details{flex-wrap:wrap;gap:9px}.interact-details p{flex-basis:100%}.interact-panel .btn-interact-hud{margin-left:auto}}

/* Taming shares the quest/map flow and the encounter meter. */
.taming-tracker{background:#101b1ce6;border:1px solid #9d834f;border-radius:5px;padding:10px}
.taming-heading{display:flex;justify-content:space-between;align-items:center;gap:6px;border-bottom:1px solid #a38b4c77;padding-bottom:7px;font-size:15px}.taming-heading>span{font-size:12px;color:#c5b692}
.taming-entry{padding-top:9px}.taming-entry+.taming-entry{margin-top:8px;border-top:1px solid #a38b4c55}.taming-identity{display:flex;flex-direction:column;gap:3px}.taming-identity strong{font-size:15px;font-weight:400}.taming-type{align-self:flex-start;font-size:11px;padding:2px 5px;border:1px solid #806b44;border-radius:3px;color:#d2bd8f;background:#332f24}.taming-meter-row{display:flex;align-items:center;justify-content:space-between;margin:5px 0;font-size:13px}.taming-meter-row .btn-quest-hud{width:25px;height:25px;flex-basis:25px;padding:5px}.taming-meter-row img{width:100%;height:100%}.taming-cooldown{display:block;margin-top:5px;color:#b9b399;font-size:12px}
.feeding-options{display:flex;gap:6px;margin:8px 0 10px}.btn-food-hud{flex:1;min-width:0;display:flex;align-items:center;flex-direction:column;gap:4px;padding:7px 4px;border:1px solid #bba575;border-radius:3px;background:#f5ecd8;color:#4b4235}.btn-food-hud img{width:35px;height:35px;object-fit:contain;background:#172227;border-radius:3px;padding:3px}.btn-food-hud strong{font-size:13px;font-weight:400}.btn-food-hud span{font-size:12px;color:#8a6e43}.btn-food-hud[aria-pressed=true]{background:#e5d8b9;border-color:#a88c58;box-shadow:inset 0 0 0 1px #d1b477;color:#3c3225}
.component-preview .taming-tracker{display:none}

/* Desktop refinement: reserve the instrument lane and compact the right stack. */
.right-hud-stack{max-height:calc(100% - 174px);min-height:0}
.right-hud-stack .navigation,.right-hud-stack .presence-panel{flex-shrink:0}
.taming-tracker{min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#a38b4c #152328}
.taming-heading{position:sticky;top:0;background:#152328;z-index:1}
.taming-entry{position:relative;padding-top:8px}
.taming-identity{padding-right:31px;gap:4px}
.taming-identity strong{line-height:1.15;overflow-wrap:break-word}
.taming-meter-row{margin:5px 0 4px;min-height:15px;line-height:1.15;color:#e4d6b6}
.taming-meter-row .btn-quest-hud{position:absolute;right:0;top:8px}
.taming-cooldown{margin-top:4px;line-height:1.15;color:#d1c8ad}
.taming-entry+.taming-entry{margin-top:7px}
.context-panel{bottom:198px;max-height:calc(100% - 222px);overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#ad945c #e9ddc2}
.component-preview .context-panel{max-height:calc(100% - 28px)}
/* Shared Cultivator identity; left symbol displays the strongest affinity. */
.cultivator-panel{position:absolute;top:72px;left:50%;transform:translateX(-50%);width:min(280px,calc(100% - 40px));padding:10px 16px 12px;background:none;isolation:isolate;border:0;box-shadow:none;border-radius:0;color:var(--cream);z-index:8}
.cultivator-panel:before{content:"";display:block;position:absolute;inset:0 -55px;z-index:-1;pointer-events:none;background:linear-gradient(90deg,#101b1b00 0%,#101b1b08 3%,#101b1b24 7%,#101b1b66 12%,#101b1bb3 18%,#101b1bd9 23%,#101b1bd9 77%,#101b1bb3 82%,#101b1b66 88%,#101b1b24 93%,#101b1b08 97%,#101b1b00 100%)}
.cultivator-heading{position:relative;display:flex;align-items:center;gap:8px}.cultivator-seal{display:grid;place-items:center;width:32px;height:32px;flex:0 0 32px;border:1px solid #b79a64;border-radius:50%;background:radial-gradient(#374139,#122027);box-shadow:inset 0 0 0 3px #1c2425}.cultivator-seal img{width:20px;height:20px;object-fit:contain}
.cultivator-name{min-width:0;flex:1;display:flex;flex-direction:column;gap:3px}.cultivator-name strong{font:600 20px HUDTitle,serif;line-height:1.1;overflow-wrap:anywhere}.cultivator-disposition{width:25px;height:25px;padding:6px;border:1px solid #b26758;background:#532a28;color:#ffd1bc;flex-shrink:0;border-radius:50%;display:grid;place-items:center}.cultivator-disposition span{font:700 16px HUDText,serif;line-height:1}
.cultivator-panel[data-disposition=friendly] .cultivator-disposition{border-color:#6f9e87;background:#244337;color:#d9efdd}
.cultivator-details{position:relative;margin:0;font-size:12px;line-height:1.2;color:#d4c6a9}.cultivator-health-label{position:relative;display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:11px;margin:5px 0 3px}.cultivator-panel>progress{position:relative;height:5px;width:100%}.cultivator-panel>progress::-webkit-progress-value{background:#bc493c}.cultivator-panel>progress::-moz-progress-bar{background:#bc493c}
.cultivator-effects{position:absolute;left:16px;top:-33px;display:flex;gap:5px}.cultivator-effects button{width:25px;height:25px}.component-preview .cultivator-panel{top:48px;width:min(280px,calc(100% - 40px))}.component-preview .hud[data-state=cultivator-npc] .interact-panel{top:auto;bottom:22px;transform:translateX(-50%);max-width:354px}
.encounter-panel .state-label{margin:7px 0 10px;line-height:1.2}
.encounter-panel .encounter-actions{border-top:1px solid #b9a77666;padding-top:9px;margin-top:10px}
.btn-food-hud strong{min-height:29px;display:flex;align-items:center;justify-content:center;line-height:1.1;text-align:center}
.btn-food-hud:disabled{opacity:.8}
.form-tag-hud{white-space:normal}
.orb-glass{border:1px solid #c5a76c55}
.orb-health output,.orb-qi output{text-shadow:0 1px 2px #000;box-shadow:inset 0 1px #ead29622}
.quest-goal-row{align-items:flex-start}
.btn-quest-hud{box-shadow:none}
.boss-kind{color:#e2d6bd}
.boss-value{color:#e5d8bc}
@media(max-height:800px){
 .right-hud-stack .map-preview{max-height:168px;aspect-ratio:auto;height:168px}
 .right-hud-stack .region{padding:5px 6px}
 .right-hud-stack .objective{padding:7px 9px}
 .right-hud-stack .quest-goal-row{margin-top:6px}
}

/* Legible owned control art, with a shared bronze rim and clear companion grouping. */
.side-rail{padding:10px 6px;gap:8px;border-radius:0 10px 10px 0;box-shadow:inset -3px 0 0 #57442c,2px 0 8px #0004}
.btn-menu-hud{padding:7px;background:radial-gradient(ellipse at 50% 30%,#303a36,#111d23);box-shadow:inset 0 0 0 2px #a38b4c22}
.side-rail img{opacity:1}
.btn-item-hud>img{width:83%;height:86%;padding:1px;filter:none;object-fit:contain}
.hotbar .btn-item-hud{background:linear-gradient(#1e2c30,#121d23)}
.item-count{right:4px;bottom:3px;min-width:18px;background:#111c23dd;border-radius:2px;padding:0 2px;font-size:13px}
.companion-wing{height:116px;padding-top:8px;padding-bottom:8px;background:linear-gradient(110deg,#172a2ef7,#10191ff7)}
.companion-identity{height:54px}
.companion-identity strong{color:#efdab0}
.command-row{margin-top:6px;padding-top:6px;border-top:1px solid #a38b4c66}
.btn-command-hud{box-shadow:inset 0 0 0 2px #a38b4c1c}
.btn-command-hud[aria-pressed=true]{background:radial-gradient(#365f4f,#182c2a);border-color:#8fbd9e}
.presence-distance{white-space:nowrap;color:#79613c}
.right-hud-stack .presence-panel strong{font-size:20px}
.right-hud-stack .presence-panel .presence-description{font-size:13px}
.presence-actions .btn-presence-hud{min-height:29px}
@media(max-height:800px){.hud[data-state="presence"] .right-hud-stack .map-preview{height:150px}}
@media(max-width:1100px){.companion-wing{height:116px}.companion-identity{height:54px}.btn-menu-hud{width:36px;height:36px}.right-hud-stack .presence-panel strong{font-size:19px}}

/* Connected bronze instrument assembly: raster castings, independent live contents. */
:root{--dock-width:1060px;--wing-width:236px;--orb-column:164px;--orb-art-size:224px;--orb-height:190px;--bed-height:136px;--slot-height:68px}
.instruments{height:var(--orb-height);transform:translateX(-50%)}
.player-dock{grid-template-columns:var(--orb-column) minmax(0,1fr) var(--orb-column)}
.orb-health,.orb-qi{width:var(--orb-column);height:var(--orb-height);background:none}
.orb-bezel{width:var(--orb-art-size);height:var(--orb-art-size);left:calc((var(--orb-column) - var(--orb-art-size))/2);top:calc(var(--orb-art-size)*-.08);z-index:2;filter:drop-shadow(0 2px 3px #0008)}
.orb-glass{width:calc(var(--orb-art-size)*.574);height:calc(var(--orb-art-size)*.574);left:calc((var(--orb-column) - var(--orb-art-size)*.574)/2);top:calc(var(--orb-art-size)*.094);border:0;background-color:#101418;box-shadow:inset 0 0 12px #000}
.orb-health:before,.orb-qi:before{content:"";position:absolute;left:calc(50% - 7px);top:calc(var(--orb-art-size)*.032 - 7px);width:14px;height:14px;transform:rotate(45deg);background:radial-gradient(ellipse at 20% 20%,#ffc2a2,#a32830 55%,#3e1520);z-index:1}
.orb-qi:before{background:radial-gradient(ellipse at 20% 20%,#c2f2ff,#247ebd 55%,#122541)}
.orb-health output,.orb-qi output{left:50%;top:calc(var(--orb-art-size)*.746 - 7px);bottom:auto;transform:translateX(-50%);width:calc(var(--orb-art-size)*.53);height:22px;padding:0;line-height:22px;background:none;border:0;border-radius:0;box-shadow:none;z-index:3;font-size:16px}
.action-bed,.companion-wing{
 border:2px solid transparent;border-radius:0;background:none;
 border-image-source:url('Assets/Frames/panel-frame.png');border-image-slice:260 210 315 210 fill;
 border-image-width:52px 42px 68px 42px;border-image-outset:26px 0 40px;border-image-repeat:stretch;
 box-shadow:none
}
.action-bed{height:var(--bed-height);padding:24px 22px 12px;margin:0 -9px;z-index:2}
.action-bed:before,.action-bed:after{display:none}
.experience-rail{position:absolute;top:-20px;left:0;width:100%;height:32px;z-index:3}
.experience-rail:after{content:"";position:absolute;inset:0;pointer-events:none;border:0 solid transparent;border-image-source:url('Assets/Frames/experience-rail.png');border-image-slice:357 165 360 165 fill;border-image-width:90px 42px 91px 42px;border-image-outset:78px 0 79px;border-image-repeat:stretch}
.cultivation-meter{top:12px;left:42px;width:calc(100% - 84px);height:8px;border:0;border-radius:0;background:#0b1417;box-shadow:none}
.cultivation-meter::-webkit-progress-bar{background:linear-gradient(180deg,#263c42,#0b1417 55%,#060d10);box-shadow:inset 0 1px #b9dac833,inset 0 -1px #0009;border:0;border-radius:0}
.cultivation-meter::-webkit-progress-value{background:linear-gradient(180deg,#e2fff0a0,#ffffff20 42%,transparent 43%,#061b1880),linear-gradient(90deg,#2d7869,#87c0a8);border:0;border-radius:2px;box-shadow:inset 0 1px #d4ffeb88}
.cultivation-meter::-moz-progress-bar{background:linear-gradient(180deg,#e2fff0a0,#ffffff20 42%,transparent 43%,#061b1880),linear-gradient(90deg,#2d7869,#87c0a8);border:0;border-radius:2px;box-shadow:inset 0 1px #d4ffeb88}
/* Glass-like review fills: Boss and EXP only; small actor bars stay restrained. */
.boss-panel .framed-meter{height:40px;padding:12px 42px;border:0;border-radius:0;background:none;box-shadow:none}
.boss-panel .framed-meter:before{display:none}
.boss-panel .framed-meter:after{content:"";position:absolute;inset:0;width:auto;height:auto;background:none;transform:none;pointer-events:none;border:0 solid transparent;border-image-source:url('Assets/Frames/experience-rail.png');border-image-slice:357 165 360 165 fill;border-image-width:90px 42px 91px 42px;border-image-outset:78px 0 79px;border-image-repeat:stretch}
.boss-panel .framed-meter progress{height:16px}
.boss-panel .framed-meter progress{background:linear-gradient(180deg,#2e272b,#0c1316 55%,#050b0e)}
.boss-panel .framed-meter progress::-webkit-progress-bar{background:linear-gradient(180deg,#2e272b,#0c1316 55%,#050b0e);box-shadow:inset 0 1px #ffe6c52e,inset 0 -1px #0009}
.boss-panel .framed-meter progress::-webkit-progress-value{background:linear-gradient(180deg,#ffd8bda0,#ffffff20 42%,transparent 43%,#24070b80),linear-gradient(90deg,#a71824,#ef4933);box-shadow:inset 0 1px #ffe2c988}
.boss-panel .framed-meter progress::-moz-progress-bar{background:linear-gradient(180deg,#ffd8bda0,#ffffff20 42%,transparent 43%,#24070b80),linear-gradient(90deg,#a71824,#ef4933);box-shadow:inset 0 1px #ffe2c988}
.player-effects{top:-64px}

.hotbar{height:calc(var(--slot-height) + 27px);gap:9px;grid-template-columns:repeat(4,minmax(0,1fr)) 16px repeat(4,minmax(0,1fr))}
.btn-skill-hud,.btn-item-hud{height:var(--slot-height);border:1px solid #c5a56d;border-radius:3px;padding:4px;box-shadow:inset 0 0 0 2px #504331,inset 0 0 8px #000; background:linear-gradient(#273331,#0c171c)}
.hotbar kbd{bottom:-33px;font-size:15px;line-height:1;padding:0 6px;min-width:38px;height:25px;background:linear-gradient(#26302d,#111a1d);border-color:#ae8f57;box-shadow:0 1px 2px #0008;display:flex;align-items:center;justify-content:center;text-align:center}
.hotbar kbd img{display:block;width:20px;height:23px;object-fit:contain;border:0;box-shadow:none;flex-shrink:0}
.slot-divider{height:var(--slot-height);border-color:#bea16d}.slot-divider:after{top:calc(50% - 10px);color:#d4b47a}
.companion-wing{height:142px;padding:12px 30px;margin-right:-5px;z-index:1;display:flex;flex-direction:column;justify-content:center}
.companion-identity{height:62px;gap:9px}.portrait{width:60px;height:60px;border:2px solid #c6a66d;box-shadow:0 0 0 2px #42382b}
.companion-identity strong{font-size:17px}.companion-identity span{font-size:12px}.companion-identity progress{height:6px}.companion-identity>div{text-align:left}
.command-row{margin-top:7px;padding-top:9px;border-top:1px solid #a68c59aa;gap:8px;justify-content:center}
.btn-command-hud{width:32px;height:32px;border-color:#bb9d66;box-shadow:inset 0 0 0 2px #745c3833,0 1px 3px #0007}
.bottom-foundation{height:19px;background:linear-gradient(#9d7e4e 0,#d0ae77 1px,#392e22 3px,#111a1e 4px,#111a1e 15px,#52412d 16px);border:0;box-shadow:0 -1px 4px #0008}
.right-hud-stack{max-height:calc(100% - 220px)}
.context-panel{bottom:236px;max-height:calc(100% - 260px)}
/* Scale the entire authoring canvas once, including text, effects and hover cards. */
.hud{width:calc(100% / var(--hud-scale,1));height:calc(100% / var(--hud-scale,1));transform:scale(var(--hud-scale,1));transform-origin:top left}
.component-preview .context-panel{max-height:calc(100% - 28px)}
@media(max-width:1500px){:root{--dock-width:900px;--wing-width:216px;--orb-column:144px;--orb-art-size:200px;--orb-height:174px;--bed-height:122px;--slot-height:59px}.action-bed{padding-inline:20px}.hotbar{gap:6px;grid-template-columns:repeat(4,minmax(0,1fr)) 12px repeat(4,minmax(0,1fr))}.companion-wing{height:132px;padding:10px 24px}.companion-identity{height:58px}.portrait{width:54px;height:54px}.companion-identity strong{font-size:16px}.command-row{gap:7px;padding-top:7px}.btn-command-hud{width:29px;height:29px}.orb-health output,.orb-qi output{font-size:14px}.right-hud-stack{max-height:calc(100% - 206px)}}
@media(max-width:1100px){:root{--dock-width:740px;--wing-width:186px;--orb-column:128px;--orb-art-size:182px;--orb-height:164px;--bed-height:116px;--slot-height:53px}.action-bed{padding:24px 18px 10px}.hotbar{gap:4px;grid-template-columns:repeat(4,minmax(0,1fr)) 9px repeat(4,minmax(0,1fr))}.companion-wing{height:124px;padding:9px 18px}.companion-identity{height:52px;gap:7px}.portrait{width:43px;height:43px}.companion-identity strong{font-size:14px}.companion-identity span{font-size:11px}.command-row{gap:6px;padding-top:7px}.btn-command-hud{width:25px;height:25px;padding:5px}.orb-health output,.orb-qi output{font-size:13px}.right-hud-stack{max-height:calc(100% - 196px)}}

/* Persistent dodge reserve recessed beneath Health's number plate. */
.orb-health output{z-index:4;background:linear-gradient(180deg,#101a1ef5 0%,#101a1ef5 76%,#101a1e9c 91%,#101a1e00 100%)}
.dodge-meter{position:absolute;left:50%;top:calc(var(--orb-art-size)*.746 + 11px);transform:translateX(-50%);width:calc(var(--orb-art-size)*.52);height:9px;padding:1px;border:1px solid #8b7044;border-radius:3px;background:linear-gradient(#423523,#0c1417);box-shadow:0 1px 2px #000a;z-index:3;pointer-events:none;opacity:.68;transition:opacity .18s}
.dodge-meter[data-active="true"]{opacity:1}
.dodge-fill{width:100%;height:100%;border:0;border-radius:2px;background:#101719;color:#dfb451}
.dodge-fill::-webkit-progress-bar{background:linear-gradient(#172126,#080e11);box-shadow:inset 0 1px #0009}
.dodge-fill::-webkit-progress-value{background:linear-gradient(180deg,#fff0bcb3,#ffffff26 40%,#ffffff00 42%,#61351080),linear-gradient(90deg,#ba822d,#e7c366);box-shadow:inset 0 1px #fff1c488}
.dodge-fill::-moz-progress-bar{background:linear-gradient(180deg,#fff0bcb3,#ffffff26 40%,#ffffff00 42%,#61351080),linear-gradient(90deg,#ba822d,#e7c366);box-shadow:inset 0 1px #fff1c488}