/* Tema "Marco dorado" compartido para las ventanas del juego (Banco, Comercio, Artesano, Clan, ...).
   Uso: agregar la clase .aow al contenedor de la ventana y usar .aow-head/.aow-title/.aow-x/.aow-body/.aow-panel/.aow-btn/.aow-input/.aow-tab/.aow-chip. */
:root{--aow-gold:#d4af37;--aow-gold-2:#f6e08a;--aow-line:rgba(154,106,28,.6);--aow-btn-line:#b07d22;--aow-mute:#9b8a6c;--aow-faint:#7d6e52;--aow-text:#ddd;--aow-bad:#ff8f82;--aow-ok:#9fe3a0}
@property --aow-sa{syntax:"<angle>";inherits:false;initial-value:0deg}
.aow{position:relative;display:flex;flex-direction:column;overflow:hidden;isolation:isolate;box-sizing:border-box;max-width:calc(100vw - 24px);max-height:calc(100vh - 16px);
 background:linear-gradient(135deg,rgba(232,160,50,.14),rgba(20,15,8,.97) 55%),#14100a;border:2px solid #9a6a1c;border-radius:8px;color:var(--aow-text);font:12px Arial,sans-serif;
 box-shadow:0 0 16px rgba(230,150,40,.09) inset,0 0 22px rgba(230,150,40,.22),0 18px 60px rgba(0,0,0,.9);outline:1px solid rgba(240,180,70,.38);outline-offset:-6px;animation:aowIn .45s cubic-bezier(.2,.8,.2,1)}
.aow::before{content:"";position:absolute;inset:0;border-radius:8px;padding:1.5px;pointer-events:none;z-index:4;background:conic-gradient(from var(--aow-sa),transparent 0 290deg,rgba(255,225,140,.95) 345deg,transparent 360deg);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:aowSpin 5s linear infinite}
@keyframes aowSpin{to{--aow-sa:360deg}}
@keyframes aowIn{from{opacity:0;transform:translateY(14px) scale(.97)}}
.aow.fx-off,.aow.fx-off::before{animation:none}
@media (prefers-reduced-motion:reduce){.aow,.aow::before{animation:none}}
.aow *{box-sizing:border-box}
.aow-head{flex:none;min-height:46px;display:flex;align-items:center;justify-content:center;position:relative;padding:6px 48px;border-bottom:1px solid var(--aow-line);background:linear-gradient(180deg,rgba(232,160,50,.16),transparent)}
.aow-title{margin:0;font-size:14px;font-weight:800;letter-spacing:3px;text-transform:uppercase;text-align:center;background:linear-gradient(180deg,#fff,#f6e08a 50%,#d4af37);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 6px rgba(212,175,55,.5))}
.aow-sub{display:block;font-size:10px;letter-spacing:2px;color:var(--aow-mute);text-align:center;-webkit-text-fill-color:var(--aow-mute)}
.aow-x{position:absolute;right:10px;top:50%;transform:translateY(-50%);width:28px;height:28px;padding:0;background:#1d160c;color:#ddd;border:1px solid var(--aow-btn-line);border-radius:4px;cursor:pointer;font-size:16px;line-height:1;font-weight:400}
.aow-x:hover{border-color:var(--aow-gold-2);color:#fff}
.aow-body{flex:1 1 auto;min-height:0;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px;scrollbar-width:thin;scrollbar-color:#9a6a1c #120d07}
.aow-foot{flex:none;display:flex;align-items:center;justify-content:center;gap:10px;padding:10px 14px;border-top:1px solid var(--aow-line);background:rgba(0,0,0,.25)}
.aow-panel{border:1px solid var(--aow-line);border-radius:8px;padding:10px 12px;background:rgba(0,0,0,.28);box-shadow:inset 0 0 26px rgba(212,175,55,.06)}
.aow-label{font-size:10px;letter-spacing:1.5px;color:var(--aow-mute);text-transform:uppercase}
.aow-gold{color:var(--aow-gold-2);font-weight:800}
.aow-bad{color:var(--aow-bad)}.aow-ok{color:var(--aow-ok)}
.aow-btn{min-height:30px;padding:0 14px;border:1px solid var(--aow-btn-line);border-radius:5px;background:linear-gradient(180deg,#2c2111,#1a1209);color:#f2e4bd;font:700 12px Arial,sans-serif;letter-spacing:.5px;cursor:pointer;transition:border-color .15s,box-shadow .15s,transform .1s}
.aow-btn:hover:not(:disabled){border-color:var(--aow-gold-2);box-shadow:0 0 10px rgba(212,175,55,.35);color:#fff}
.aow-btn:active:not(:disabled){transform:translateY(1px)}
.aow-btn:disabled{opacity:.4;cursor:not-allowed}
.aow-btn.primary{background:linear-gradient(180deg,#e2bd4e,#a47a1a);color:#1a1004;border-color:#f6e08a}
.aow-btn.danger{border-color:#9b3b32;color:#ffb3a9}
.aow-input{height:30px;padding:0 9px;border:1px solid var(--aow-line);border-radius:5px;background:rgba(0,0,0,.45);color:#f2e4bd;font:12px Arial,sans-serif;outline:none}
.aow-input:focus{border-color:var(--aow-gold-2);box-shadow:0 0 8px rgba(212,175,55,.3)}
.aow-tabs{display:flex;gap:6px;flex-wrap:wrap}
.aow-tab{min-height:28px;padding:0 14px;border:1px solid var(--aow-line);border-radius:5px 5px 0 0;background:rgba(0,0,0,.35);color:var(--aow-mute);font:700 11px Arial,sans-serif;letter-spacing:1.5px;cursor:pointer}
.aow-tab.active,.aow-tab[aria-selected="true"]{color:var(--aow-gold-2);border-color:var(--aow-gold);background:linear-gradient(180deg,rgba(212,175,55,.2),transparent)}
.aow-chip{display:inline-block;border:1px solid rgba(154,106,28,.45);border-radius:20px;padding:2px 9px;font-size:10.5px;color:#cdbd97;background:rgba(0,0,0,.3);white-space:nowrap}
.aow-row{display:grid;align-items:center;gap:10px;padding:8px 10px;border:1px solid rgba(154,106,28,.35);border-radius:6px;background:rgba(0,0,0,.25);transition:border-color .15s,background .15s}
.aow-row:hover{border-color:var(--aow-gold);background:rgba(212,175,55,.07)}
.aow-slot{display:grid;place-items:center;border:1px solid rgba(154,106,28,.5);border-radius:4px;background:linear-gradient(180deg,rgba(255,255,255,.06),transparent 45%),rgba(0,0,0,.55);box-shadow:inset 0 -6px 10px rgba(0,0,0,.35);background-repeat:no-repeat;background-position:center;background-size:contain;image-rendering:pixelated}
