/* Grimwood V20.10.24 · Duelo legible · Interfaz · Rendimiento
   Principio: el mundo ocupa el centro; la información importante vive en los bordes. */

:root{
  --gw-panel:#080909f5;
  --gw-panel-2:#11100ef6;
  --gw-gold:#c7a968;
  --gw-line:#6c5a37;
  --gw-text:#eee7d9;
  --gw-muted:#a59d90;
  --gw-cyan:#8dd7e4;
  --gw-red:#ed8576;
  --gw-amber:#e1bb69;
  --gw-green:#9bd0ae;
}

/* Native cursor: unlike a DOM cursor it remains visible over <dialog> top-layer UI. */
#grimwood-cursor{display:none!important}
body[data-input-mode="keyboardMouse"],body[data-input-mode="keyboardMouse"] *{
  cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 28 28'%3E%3Cg fill='none' stroke='%23ead8aa' stroke-width='1.7'%3E%3Cpath d='M14 1 20 8 14 14 8 8Z' fill='%23100d09'/%3E%3Cpath d='M14 14 19 20 14 27 9 20Z' fill='%23100d09'/%3E%3Cpath d='M2 14h7M19 14h7'/%3E%3C/g%3E%3Ccircle cx='14' cy='14' r='2' fill='%23c79b4c'/%3E%3C/svg%3E") 14 14,auto!important;
}
body[data-input-mode="gamepad"] *,body[data-input-mode="touch"] *{cursor:auto!important}

/* Expensive blur on constantly changing 3D content caused needless composition work. */
.player-vitals,.top-actions .currency,#objective,#abilities .ability,#panel,#panel::backdrop,#load-screen::backdrop{
  backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
}
#panel::backdrop,#load-screen::backdrop{background:rgba(0,0,0,.66)!important}
body.ui-modal-open #boss-hud:after,body.ui-modal-open #edit-flash{animation:none!important}

/* Combat HUD: compact, edge-anchored and with one hierarchy. */
.player-vitals{left:18px!important;top:16px!important;max-width:min(360px,31vw)!important;background:linear-gradient(105deg,#080909f2,#11110ff0)!important;border:1px solid #4d473a!important}
.top-actions{top:15px!important;right:18px!important}
.room-heading{top:15px!important;max-width:420px!important;pointer-events:none}
body.guardian-duel .room-heading{display:none!important}

#objective{left:20px!important;right:auto!important;bottom:22px!important;top:auto!important;width:min(430px,38vw)!important;max-width:none!important;padding:10px 14px!important;background:linear-gradient(100deg,#090a0af2,#12110ff0)!important;border:1px solid #4a4438!important}
#objective strong{font-size:11px!important;letter-spacing:.13em!important}#objective p{margin:2px 0 0!important;font-size:11px!important;line-height:1.35!important;color:#b8b0a3!important}
body.guardian-duel #objective{display:none!important}

#abilities{right:20px!important;left:auto!important;bottom:20px!important;top:auto!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,150px))!important;gap:6px!important;width:auto!important}
#abilities .ability{min-height:46px!important;padding:7px 9px!important;background:linear-gradient(105deg,#080909ee,#12110ff0)!important;border:1px solid #464137!important;box-shadow:0 7px 18px #0007!important}
#abilities .ability-symbol{font-size:19px!important}#abilities .ability strong{font-size:10px!important;letter-spacing:.08em!important}#abilities kbd{font-size:9px!important;background:#0b0b0b!important;border:1px solid #544a38!important;color:#d5c49a!important;padding:2px 5px!important}
body.guardian-duel #abilities{opacity:.88}

/* Guardian information: top-center instead of a large lower-third that obscures combat. */
body.guardian-duel #boss-hud{
  position:fixed!important;top:15px!important;left:50%!important;right:auto!important;bottom:auto!important;transform:translateX(-50%)!important;
  width:min(720px,55vw)!important;min-height:62px!important;max-height:74px!important;padding:8px 12px!important;z-index:24!important;
  background:linear-gradient(90deg,#070808f6,#170d0df3 48%,#070808f6)!important;border:1px solid #80683d!important;box-shadow:0 9px 30px #000a!important;
}
body.guardian-duel #boss-hud:before{top:auto!important;bottom:-14px!important;left:50%!important;transform:translateX(-50%);font-size:7px!important;opacity:.72}
body.guardian-duel #boss-hud:after{opacity:.35}
body.guardian-duel #boss-portrait{width:45px!important;min-width:45px!important;height:45px!important}
body.guardian-duel #boss-name{font-size:clamp(12px,1.05vw,17px)!important}body.guardian-duel #boss-title{font-size:8px!important}
body.guardian-duel #boss-phase{min-width:160px!important;font-size:9px!important;line-height:1.25!important;text-align:right!important;color:#e7d4a5!important}
body.guardian-duel #boss-hud .boss-track{height:6px!important;margin-top:4px!important}
body.guardian-duel #boss-hud .boss-posture-track{height:4px!important;margin-top:5px!important}

#guardian-duel-indicator{position:fixed!important;top:91px!important;left:50%!important;bottom:auto!important;transform:translateX(-50%)!important;width:auto!important;min-width:330px!important;max-width:55vw!important;padding:6px 12px!important;z-index:25!important;background:#070808ed!important;border:1px solid #66583c!important;box-shadow:0 7px 24px #0008!important}
#guardian-duel-indicator strong{font-size:10px!important;letter-spacing:.12em!important}#guardian-duel-indicator small{font-size:9px!important;color:#aaa398!important}
body.cue-block #guardian-duel-indicator{border-color:#79bdc8!important}body.cue-block #guardian-duel-indicator strong{color:var(--gw-cyan)!important}
body.cue-dodge #guardian-duel-indicator{border-color:#b75d53!important}body.cue-dodge #guardian-duel-indicator strong{color:#ff9a8e!important}
body.cue-move #guardian-duel-indicator{border-color:#ad8d43!important}body.cue-move #guardian-duel-indicator strong{color:#f0c66d!important}

/* Tutorial coach: tells WHAT / WHEN / WHY in one compact block. */
#tutorial-coach{
  position:fixed!important;top:132px!important;left:50%!important;bottom:auto!important;transform:translateX(-50%)!important;z-index:27!important;
  width:min(610px,64vw)!important;min-height:0!important;padding:10px 15px 11px!important;background:#090a0af3!important;border:1px solid #5d533f!important;box-shadow:0 10px 34px #000a!important;text-align:left!important;
  display:grid!important;grid-template-columns:auto 1fr!important;column-gap:12px!important;row-gap:3px!important;
}
#tutorial-coach[hidden]{display:none!important}
#tutorial-coach #tutorial-step{grid-column:1;color:#8f826b;font:800 8px/1 Arial,sans-serif;letter-spacing:.16em;align-self:center}
#tutorial-coach #tutorial-title{grid-column:2;color:#efe5d1;font:800 12px/1.15 Georgia,serif;letter-spacing:.06em}
#tutorial-coach #tutorial-status{grid-column:1 / -1;color:#d9ba75;font:900 10px/1.2 Arial,sans-serif;letter-spacing:.12em;margin-top:3px}
#tutorial-coach #tutorial-instruction{grid-column:1 / -1;margin:1px 0 0;color:#bbb3a6;font:11px/1.42 Arial,sans-serif;letter-spacing:.01em}
#tutorial-coach.urgent{transform:translateX(-50%) scale(1.015)!important;border-color:#c49a4d!important;background:#100d08f7!important;filter:none!important}
#tutorial-coach.observe{border-color:#617a7e!important}#tutorial-coach.mistake{border-color:#a3524a!important;filter:none!important}
body.guardian-duel #tutorial-coach{top:127px!important;width:min(650px,61vw)!important}

/* Persistent Duel grammar. The current rule lights up; everything else remains readable but quiet. */
#duel-legend{position:fixed;right:20px;top:50%;transform:translateY(-50%);z-index:23;width:210px;padding:10px;background:#070808ed;border:1px solid #494338;box-shadow:0 12px 34px #0009;color:#ded7cb}
#duel-legend[hidden]{display:none!important}#duel-legend>small{display:block;margin-bottom:7px;color:#8f826b;font:800 8px/1 Arial,sans-serif;letter-spacing:.17em}
.duel-rule{display:grid;grid-template-columns:58px 1fr auto;align-items:center;gap:5px;min-height:29px;padding:4px 6px;border-left:2px solid #3e3b35;opacity:.48;transition:opacity .1s ease,background .1s ease,border-color .1s ease,transform .1s ease}
.duel-rule b{font:900 9px/1 Arial,sans-serif;letter-spacing:.08em}.duel-rule span{font:800 8px/1 Arial,sans-serif;letter-spacing:.08em;color:#bbb3a6}.duel-rule kbd{font:800 8px/1 Arial,sans-serif;padding:2px 4px;color:#c9bea9;background:#0e0e0e;border:1px solid #423d33}
.duel-rule.active{opacity:1;background:#15120d;transform:translateX(-4px)}.duel-rule.cyan.active{border-color:var(--gw-cyan)}.duel-rule.cyan.active b{color:var(--gw-cyan)}.duel-rule.red.active{border-color:var(--gw-red)}.duel-rule.red.active b{color:#ff9e91}.duel-rule.amber.active{border-color:var(--gw-amber)}.duel-rule.amber.active b{color:#efc66f}.duel-rule.posture.active,.duel-rule.opening.active{border-color:var(--gw-green)}.duel-rule.posture.active b,.duel-rule.opening.active b{color:#b2dfbd}
#duel-legend:not(.training) .duel-rule.posture,#duel-legend:not(.training) .duel-rule.opening{display:none}

/* Menus: one clear sheet, high contrast, no translucent blur over the live scene. */
#panel{width:min(920px,90vw)!important;max-width:920px!important;max-height:86dvh!important;border:1px solid #6a5939!important;background:linear-gradient(135deg,#090a0afc,#13110efc)!important;box-shadow:0 24px 90px #000!important;padding:0 22px 18px!important;overflow:auto!important}
#panel .panel-header{position:sticky!important;top:0!important;z-index:5!important;margin:0 -22px 13px!important;padding:14px 22px 11px!important;background:#0b0b0bfa!important;border-bottom:1px solid #4c4435!important}
#panel-title{margin:4px 0 0!important;font-size:clamp(22px,3vw,36px)!important;line-height:1!important}
#panel-body{line-height:1.5!important}#panel-footer{position:sticky!important;bottom:-18px!important;z-index:5!important;margin:16px -22px -18px!important;padding:10px 22px 14px!important;background:linear-gradient(180deg,#0b0b0b00,#0b0b0b 28%)!important}
#panel-footer>button{min-height:40px!important}
.menu-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}.menu-grid button{min-height:62px!important;text-align:left!important;padding:10px 13px!important}
.choice,.profile-card,.save-slot,.run-event-choice{background:#0d0e0ef4!important;border:1px solid #484238!important;box-shadow:none!important}.choice:hover,.profile-card:hover,.save-slot:hover,.run-event-choice:hover,.menu-grid button:hover{border-color:#a6874d!important;background:#15130ff6!important}

/* Dialogue: lower-third presentation keeps character/world context visible and text predictable. */
#panel[data-kind="dialogue"],#panel[data-kind="npc"],#panel[data-kind="prologue"],#panel[data-kind="bossIntro"],#panel[data-kind="scene"]{
  position:fixed!important;left:50%!important;right:auto!important;top:auto!important;bottom:18px!important;transform:translateX(-50%)!important;width:min(1080px,88vw)!important;max-width:1080px!important;max-height:min(46dvh,410px)!important;padding:0 22px 14px 176px!important;overflow:auto!important;background:#080909fc!important;
}
#panel[data-kind="dialogue"] .panel-header,#panel[data-kind="npc"] .panel-header,#panel[data-kind="prologue"] .panel-header,#panel[data-kind="bossIntro"] .panel-header,#panel[data-kind="scene"] .panel-header{margin-left:-176px!important;padding-left:176px!important}
#panel[data-kind="dialogue"] #panel-portrait,#panel[data-kind="npc"] #panel-portrait,#panel[data-kind="prologue"] #panel-portrait,#panel[data-kind="bossIntro"] #panel-portrait,#panel[data-kind="scene"] #panel-portrait{position:absolute!important;left:16px!important;bottom:14px!important;top:48px!important;width:138px!important;height:auto!important;border:1px solid #514a3d!important;opacity:.92!important}
.spoken{font-size:clamp(15px,1.3vw,19px)!important;line-height:1.55!important;max-width:780px!important;margin:7px 0 4px!important}.dialogue-location,.dialogue-count{font-size:9px!important;letter-spacing:.12em!important;color:#81796c!important}

/* Modal pauses should look static; the background continues only as a low-rate visual. */
body.ui-modal-open #hud{opacity:.58;transition:opacity .12s ease}body.ui-modal-open #tutorial-coach,body.ui-modal-open #duel-legend{opacity:.25}

@media(max-width:1000px){
  body.guardian-duel #boss-hud{width:min(650px,68vw)!important}.player-vitals{max-width:34vw!important}#duel-legend{right:10px;width:180px}.duel-rule{grid-template-columns:50px 1fr}.duel-rule kbd{display:none}body.guardian-duel #tutorial-coach{width:58vw!important}.menu-grid{grid-template-columns:1fr!important}
}
@media(max-width:820px),(pointer:coarse){
  body.guardian-duel #boss-hud{top:max(6px,env(safe-area-inset-top))!important;width:72vw!important;min-height:48px!important;padding:5px 8px!important}.player-vitals{top:max(6px,env(safe-area-inset-top))!important;left:6px!important;max-width:25vw!important}.top-actions{right:6px!important;top:max(6px,env(safe-area-inset-top))!important}
  #guardian-duel-indicator{top:max(62px,calc(env(safe-area-inset-top) + 56px))!important;min-width:250px!important;max-width:55vw!important;padding:4px 8px!important}
  #tutorial-coach,body.guardian-duel #tutorial-coach{top:max(94px,calc(env(safe-area-inset-top) + 88px))!important;width:58vw!important;padding:7px 9px!important}#tutorial-coach #tutorial-instruction{font-size:9px!important}#tutorial-coach #tutorial-title{font-size:10px!important}
  #duel-legend{right:4px;top:auto;bottom:max(80px,calc(env(safe-area-inset-bottom) + 72px));transform:none;width:152px;padding:6px}.duel-rule{min-height:23px;grid-template-columns:42px 1fr;padding:3px 4px}.duel-rule b,.duel-rule span{font-size:7px!important}.duel-rule kbd{display:none}
  #abilities{right:6px!important;bottom:max(8px,env(safe-area-inset-bottom))!important;grid-template-columns:repeat(2,105px)!important}#abilities .ability{min-height:38px!important;padding:4px 6px!important}#abilities .ability-symbol{font-size:15px!important}
  #objective{left:6px!important;bottom:max(8px,env(safe-area-inset-bottom))!important;width:42vw!important;padding:6px 8px!important}
  #panel{width:94vw!important;max-height:91dvh!important;padding-inline:14px!important}.menu-grid{grid-template-columns:1fr!important}
  #panel[data-kind="dialogue"],#panel[data-kind="npc"],#panel[data-kind="prologue"],#panel[data-kind="bossIntro"],#panel[data-kind="scene"]{bottom:max(5px,env(safe-area-inset-bottom))!important;width:94vw!important;max-height:55dvh!important;padding:0 12px 10px 108px!important}
  #panel[data-kind="dialogue"] .panel-header,#panel[data-kind="npc"] .panel-header,#panel[data-kind="prologue"] .panel-header,#panel[data-kind="bossIntro"] .panel-header,#panel[data-kind="scene"] .panel-header{margin-left:-108px!important;padding-left:108px!important}
  #panel[data-kind="dialogue"] #panel-portrait,#panel[data-kind="npc"] #panel-portrait,#panel[data-kind="prologue"] #panel-portrait,#panel[data-kind="bossIntro"] #panel-portrait,#panel[data-kind="scene"] #panel-portrait{left:8px!important;width:86px!important;top:46px!important;bottom:10px!important}.spoken{font-size:14px!important}
}
@media(max-height:560px) and (orientation:landscape){
  body.guardian-duel #boss-hud{top:4px!important;max-height:50px!important;min-height:44px!important}#guardian-duel-indicator{top:55px!important}body.guardian-duel #tutorial-coach{top:84px!important;max-height:78px!important;overflow:hidden}#duel-legend{top:52%!important;bottom:auto!important;transform:translateY(-50%)!important}
  #panel[data-kind="dialogue"],#panel[data-kind="npc"],#panel[data-kind="prologue"],#panel[data-kind="bossIntro"],#panel[data-kind="scene"]{max-height:62dvh!important}
}
@media(prefers-reduced-motion:reduce){.duel-rule,#tutorial-coach,body.ui-modal-open #hud{transition:none!important}}
