:root{--background:#091321;--surface:#101e31;--panel:#182b43;--button:#203956;--border:#435d7b;--silver:#c0c7d1;--text:#eff3f9;--muted:#b9c5d3;--light:#efd9b9;--dark:#b58965}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,system-ui,"Segoe UI",Arial,sans-serif;background:var(--background);color:var(--text)}button{font:inherit;cursor:pointer}a{text-decoration:none;color:inherit}
.site-header{background:#0b192c;border-bottom:1px solid #5a718c;box-shadow:0 6px 24px #0209146e}.site-inner{max-width:1440px;margin:auto;min-height:79px;display:flex;justify-content:space-between;align-items:center;gap:14px;padding:0 15px}.logo{display:flex;align-items:center;gap:8px;white-space:nowrap;font-weight:850;font-size:clamp(1.25rem,1.7vw,1.6rem)}.logo img{width:55px;height:55px;object-fit:contain;filter:drop-shadow(0 0 5px #aecfe45c)}.wordmark{letter-spacing:-.055em}.name-jere{color:#fff;-webkit-text-stroke:.65px #102c54;text-shadow:0 1px 5px #588cca66}.name-chess{color:#070e19;-webkit-text-stroke:1px #d7e0eb;text-shadow:1px 1px 0 #c0c7d1,0 0 12px #99bae080}.site-tabs{display:flex;align-self:end;gap:3px}.site-tabs a{font-size:.86rem;font-weight:580;padding:13px 12px 12px;border:1px solid #40536b;border-bottom:1px solid #526780;border-radius:9px 9px 0 0;background:#17283d;color:#aebdd0;white-space:nowrap}.site-tabs a.selected{background:var(--background);border-color:#7890ae;border-bottom-color:var(--background);color:#f4f8ff;box-shadow:inset 0 2px #c0c7d1;font-weight:750}.site-tabs a:hover{background:#294560;color:#fff}
.game-shell{max-width:1100px;margin:0 auto;padding:22px 15px 45px}.match-layout{display:grid;grid-template-columns:minmax(0,660px) minmax(240px,300px);gap:20px;align-items:start;justify-content:center}.game-panel{min-width:0}.board-frame{position:relative;max-width:620px;margin:0 auto}.chess-board{display:grid;grid-template-columns:repeat(8,1fr);width:100%;aspect-ratio:1;border:1px solid #526b89}.square{position:relative;border:0;border-radius:0;display:flex;justify-content:center;align-items:center;padding:0;min-width:0;aspect-ratio:1;line-height:1;touch-action:manipulation}.square.light{background:var(--light)}.square.dark{background:var(--dark)}.square.selected{box-shadow:inset 0 0 0 4px #d0b74e}.square.hint::after{content:"";width:22%;height:22%;border-radius:50%;background:#273f5a80;position:absolute}.square.capture-hint::after{content:"";inset:3%;border-radius:50%;border:5px solid #28486b88;position:absolute}.square.last{box-shadow:inset 0 0 0 3px #b8c96d66}.piece{font-size:clamp(27px,5.5vw,64px);font-family:"DejaVu Sans","Segoe UI Symbol",serif;position:relative;z-index:2;font-weight:400}.piece.w{color:#fffdfa;-webkit-text-stroke:1px #202731;text-shadow:0 1px 2px #222}.piece.b{color:#1c232b;-webkit-text-stroke:1px #d1d6db;text-shadow:0 1px 1px #303946}.coord{position:absolute;z-index:3;font-size:clamp(8px,1vw,12px);font-weight:700;pointer-events:none;opacity:.8}.rank{top:3px;left:4px}.file{bottom:3px;right:4px}.light .coord{color:#906a44}.dark .coord{color:#f6dbb4}
.player-line{display:flex;align-items:center;justify-content:space-between;min-height:58px;padding:8px 4px;max-width:620px;margin:auto}.player-right{display:flex;align-items:center;gap:8px}.player-name{font-size:.98rem;font-weight:680}.clock{background:var(--button);border:1px solid var(--border);border-radius:7px;padding:8px 13px;font-variant-numeric:tabular-nums;font-size:1.2rem}.clock.active{border-color:#c0c7d1;background:#335778}.clock.urgent{background:#74373f}.controls{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:15px 0}.controls button,.back-link{background:var(--button);color:var(--text);border:1px solid #526b89;border-radius:7px;padding:9px 12px}.controls button:hover,.back-link:hover{background:#335778}.status{text-align:center;min-height:25px;color:var(--silver);font-size:.9rem;margin:8px 0}.side-panel{border:1px solid var(--border);background:var(--panel);border-radius:12px;padding:17px;min-height:300px}.match-info{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;padding-bottom:15px;border-bottom:1px solid var(--border);font-size:.87rem;color:var(--silver)}.match-info strong{color:var(--text)}.side-panel h2{font-size:1.02rem;margin:20px 0 10px}.move-history{min-height:160px;max-height:450px;overflow:auto;display:grid;align-content:start;gap:4px;padding:8px;background:#10243a;border:1px solid var(--border);border-radius:8px}.move-row{display:grid;grid-template-columns:36px 1fr 1fr;gap:6px;font-size:.9rem}.move-row span{padding:5px}.move-row span:first-child{color:var(--silver)}.muted,.small-info{font-size:.81rem;color:var(--muted)}.small-info{line-height:1.6}.back-link{display:inline-block;font-size:.84rem;margin-top:8px}
.promotion[hidden]{display:none!important}.promotion{position:absolute;inset:0;background:#061526d1;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:15px;z-index:10}.promotion-header{font-weight:750}.promotion-options{display:flex;gap:8px}.promotion-options button{border:1px solid var(--silver);border-radius:9px;background:var(--panel);color:var(--text);font-size:44px;padding:8px;width:70px;height:75px}.promotion-options button:hover{background:#335778}.promotion #promotionCancel{background:var(--button);color:var(--text);border:1px solid var(--border);border-radius:7px;padding:10px 18px}
@media(max-width:850px){.site-inner{flex-wrap:wrap;justify-content:center;padding:7px}.site-tabs{max-width:100%;overflow-x:auto;align-self:auto}.match-layout{grid-template-columns:minmax(0,660px)}.side-panel{min-height:0}.game-shell{padding-top:12px}}@media(max-width:480px){.site-inner{align-items:start}.logo img{width:42px;height:42px}.site-tabs a{padding:9px;font-size:.78rem}.piece{font-size:clamp(22px,10vw,45px)}.promotion-options button{width:57px;height:65px;font-size:35px}}

/* Personalización visual de Jugar: mismos temas y sets que Análisis. */
.piece-asset{display:block;width:86%;height:86%;object-fit:contain;position:relative;z-index:2;pointer-events:none;user-select:none}
#gameAppearanceToggle{width:38px;height:38px;border:1px solid #526b89;background:#203956;color:#eff3f9;border-radius:7px;font-size:21px;line-height:1;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}
.game-appearance-panel[hidden]{display:none!important}
.game-appearance-panel{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:9px auto 0;max-width:620px;padding:12px;border:1px solid #526b89;background:#182b43;border-radius:9px}
.game-appearance-panel label{display:flex;flex-direction:column;gap:5px;font-size:12px;color:#c0c7d1}
.game-appearance-panel select{min-width:0;width:100%;padding:9px;background:#101e31;color:#eff3f9;border:1px solid #526b89;border-radius:6px}
.move-row span .san-piece{font-size:1.13em;margin-right:1px;display:inline-block;vertical-align:baseline}
.san-w{color:#fff;text-shadow:-1px 0 #1a2632,1px 0 #1a2632,0 1px #1a2632}
.san-b{color:#10151b;text-shadow:-1px 0 #dbe3ed,1px 0 #dbe3ed,0 1px #dbe3ed,0 -1px #dbe3ed}
.promotion-options button{display:flex;align-items:center;justify-content:center;padding:3px}
.promotion-options .piece-asset{height:90%;width:90%}
@media(max-width:480px){.game-appearance-panel{grid-template-columns:1fr}}

/* Menú anclado debajo de la tuerca junto al reloj de Stockfish. */
.appearance-anchor{position:relative;display:flex;align-items:center}
.appearance-anchor .game-appearance-panel{position:absolute;top:calc(100% + 9px);right:0;left:auto;width:min(340px,calc(100vw - 30px));max-width:none;margin:0;z-index:60;box-shadow:0 14px 36px #020812d9;grid-template-columns:1fr}
.appearance-anchor .game-appearance-panel::before{content:"";position:absolute;right:13px;top:-7px;width:12px;height:12px;background:#182b43;border-left:1px solid #526b89;border-top:1px solid #526b89;transform:rotate(45deg)}


/* Pop-up de resultado: victoria / derrota / empate */
.result-modal[hidden]{display:none!important}
.result-modal{position:fixed;inset:0;z-index:120;display:grid;place-items:center;padding:18px}
.result-backdrop{position:absolute;inset:0;background:#04101bcc;backdrop-filter:blur(4px)}
.result-dialog{position:relative;z-index:1;width:min(560px,100%);background:linear-gradient(180deg,#14273f,#0c192b);border:1px solid #5a7390;border-radius:18px;box-shadow:0 24px 70px #01060fcc;padding:26px 24px 22px}
.result-close{position:absolute;top:14px;right:14px;width:38px;height:38px;border-radius:10px;border:1px solid #5a7390;background:#203956;color:#eff3f9;font-size:24px;line-height:1}
.result-close:hover,.result-actions button:hover,.result-actions a:hover{background:#335778}
.result-badge{display:inline-flex;align-items:center;justify-content:center;padding:8px 12px;border-radius:999px;border:1px solid var(--result-accent,#7ea3d1);background:color-mix(in srgb,var(--result-accent,#7ea3d1) 16%, transparent);color:#eff6ff;font-size:.85rem;font-weight:700;letter-spacing:.02em;margin-bottom:12px}
.result-dialog h2{margin:0 0 10px;font-size:clamp(1.55rem,3vw,2rem);color:#fff}
.result-message{margin:0 0 18px;color:#d6dfeb;line-height:1.55;font-size:1rem}
.result-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:18px}
.result-card{border:1px solid #57708b;border-radius:14px;background:#10243a;padding:14px 15px;display:grid;gap:8px}
.result-card span{font-size:.82rem;color:#bcc9d7;text-transform:uppercase;letter-spacing:.06em}
.result-card strong{font-size:1.2rem;color:#fff}
.result-actions{display:flex;flex-wrap:wrap;gap:10px}
.result-actions button,.result-actions a{display:inline-flex;align-items:center;justify-content:center;min-width:160px;min-height:44px;padding:10px 14px;border-radius:10px;border:1px solid #5a7390;background:#203956;color:#eff3f9;font-weight:700}
.result-actions #resultRematch{background:var(--result-accent,#335778);border-color:var(--result-accent,#5a7390);color:#08131f}
.result-actions #resultRematch:hover{filter:brightness(1.05)}
.result-modal.is-victory{--result-accent:#5fd296}
.result-modal.is-defeat{--result-accent:#ef6a78}
.result-modal.is-draw{--result-accent:#8cb5e2}
.result-modal.is-victory .result-dialog{border-color:#4eb37f}
.result-modal.is-defeat .result-dialog{border-color:#d05b67}
.result-modal.is-draw .result-dialog{border-color:#6f8faf}
@media(max-width:560px){.result-dialog{padding:22px 16px 18px}.result-grid{grid-template-columns:1fr}.result-actions{flex-direction:column}.result-actions button,.result-actions a{width:100%;min-width:0}}

/* Ventanas centradas, con acciones simétricas */
.result-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.result-actions button,.result-actions a{min-width:0;width:100%;min-height:46px;text-align:center}
.result-actions #resultDismiss{grid-column:1/-1}
.resign-modal[hidden]{display:none!important}
.resign-modal{position:fixed;inset:0;z-index:140;display:grid;place-items:center;padding:18px}
.resign-backdrop{position:absolute;inset:0;background:#04101bcc;backdrop-filter:blur(4px)}
.resign-dialog{position:relative;z-index:1;width:min(450px,100%);border-radius:18px;background:linear-gradient(180deg,#14273f,#0c192b);border:1px solid #7890ae;box-shadow:0 24px 70px #01060fcc;padding:28px 24px 23px;text-align:center}
.resign-dialog h2{margin:0 0 12px;color:#eff3f9;font-size:1.55rem}
.resign-dialog p{margin:0 0 24px;color:#c5d1df;line-height:1.55}
.resign-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.resign-actions button{width:100%;min-height:46px;border-radius:10px;border:1px solid #6b83a0;background:#203956;color:#eff3f9;font-weight:700;padding:10px}
.resign-actions #resignConfirm{background:#9f3f4d;border-color:#e17483;color:#fff}
.resign-actions button:hover{filter:brightness(1.14)}
@media(max-width:560px){.result-actions{grid-template-columns:1fr}.result-actions #resultDismiss{grid-column:auto}.resign-dialog{padding:23px 16px}.resign-actions{gap:8px}.resign-actions button{font-size:.9rem}}

/* Paso 3: configurador local, accesible desde la partida sin volver a Inicio. */
.setup-overlay[hidden],.setup-custom[hidden],.setup-warning[hidden]{display:none!important}
.setup-overlay{position:fixed;inset:0;z-index:150;display:grid;place-items:center;padding:15px}
.setup-backdrop{position:absolute;inset:0;background:#04101bd8;backdrop-filter:blur(5px)}
.setup-dialog{position:relative;z-index:1;width:min(520px,100%);max-height:calc(100dvh - 30px);overflow-y:auto;padding:24px 22px;background:#101e31;color:#eff3f9;border:1px solid #7088a5;border-radius:15px;box-shadow:0 20px 70px #000b}
.setup-dialog h2{font-size:1.36rem;margin:0 40px 20px 0}
.setup-dialog h3{font-size:1rem;margin:20px 0 11px}
.setup-close{position:absolute;right:15px;top:15px;background:#203956;border:1px solid #526a89;color:#eff3f9;font-size:24px;border-radius:8px;width:35px;height:35px}
.setup-modes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.setup-modes button{background:#182b43;border:1px solid #526a89;color:#d2dfec;border-radius:10px;padding:12px 5px}
.setup-modes button[aria-pressed=true]{background:#27496a;border-color:#ced9e6;box-shadow:inset 0 0 0 1px #a1b8ce;color:#fff;font-weight:750}
.setup-modes .setup-wide{grid-column:1/-1}
.setup-custom{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:11px}
.setup-custom label{display:flex;flex-direction:column;gap:6px;font-size:.83rem;color:#bccbdd}
.setup-dialog input[type=number],.setup-dialog select{background:#182b43;border:1px solid #617994;border-radius:8px;color:#eff3f9;padding:11px;width:100%;min-width:0;font:inherit}
.setup-level{display:flex;justify-content:space-between;align-items:center;gap:12px}.setup-level strong{font-size:.94rem;color:#d2dfec}
.setup-dialog input[type=range]{width:100%;accent-color:#9ab8dc}
.setup-summary{margin:19px 0 10px;background:#182b43;border:1px solid #506d8c;border-radius:9px;padding:13px;text-align:center;color:#d4e0ed;font-size:.9rem}
.setup-warning{color:#e6c49b;font-size:.86rem;text-align:center;margin:9px 0}
.setup-start{display:block;width:100%;padding:13px;border-radius:9px;background:#435d7b;color:#fff;border:1px solid #a5bad1;font-weight:750;margin-top:13px}
.setup-start:hover{background:#547696}.setup-error{color:#ffb9be;text-align:center;min-height:1em;margin:8px 0 0;font-size:.83rem}
@media(max-width:480px){.setup-dialog{padding:20px 15px}.setup-modes button{padding:10px 3px}}

/* El botón de análisis solo se muestra tras finalizar la partida. */
#analyzeFinished[hidden],#resultAnalyze[hidden]{display:none!important}

/* Ajuste de simetría v4.1: dos filas equilibradas al terminar la partida. */
.result-actions #resultDismiss{grid-column:auto}
.result-actions:has(#resultAnalyze[hidden]) #resultDismiss{grid-column:1/-1}
@media(max-width:560px){.result-actions{grid-template-columns:repeat(2,minmax(0,1fr))}.result-actions #resultDismiss{grid-column:auto}.result-actions:has(#resultAnalyze[hidden]) #resultDismiss{grid-column:1/-1}.result-actions button{font-size:.85rem;padding:9px 6px}}

/* Silencio global: mismo estilo de los controles de Jugar. */
#gameSoundToggle{min-width:43px;display:inline-flex;justify-content:center;align-items:center}#gameSoundToggle[aria-pressed="false"]{opacity:.75}

/* Historial alineado: numeración + columnas idénticas para blancas y negras. */
.move-history{scrollbar-gutter:stable;}
.move-row{display:grid;grid-template-columns:28px minmax(0,1fr) minmax(0,1fr);column-gap:8px;align-items:center;width:100%;font-variant-numeric:tabular-nums;}
.move-row>span{padding:5px 0;min-width:0;}
.move-row>span:first-child{color:var(--silver);text-align:right;padding-right:4px;}
.move-row>span:not(:first-child){display:flex;align-items:center;justify-content:flex-start;white-space:nowrap;overflow:hidden;gap:3px;}
.move-row .san-piece{display:inline-flex;align-items:center;justify-content:center;flex:0 0 18px;width:18px;min-width:18px;margin:0;font-family:"Segoe UI Symbol","DejaVu Sans",serif;font-size:17px;font-weight:400;line-height:1;vertical-align:middle;text-shadow:none;}
.move-row .san-text{overflow:hidden;text-overflow:ellipsis;min-width:0;}
.move-row .san-w{color:#f8fafc;-webkit-text-stroke:0px transparent;text-shadow:none;}
.move-row .san-b{color:#131c2a;-webkit-text-stroke:.35px #c6d3e2;text-shadow:none;}
@media(max-width:480px){.move-row{grid-template-columns:25px minmax(0,1fr) minmax(0,1fr);column-gap:5px;}.move-row .san-piece{flex-basis:16px;width:16px;min-width:16px;font-size:15px;}}


/* Historial Jugar: cuadrícula idéntica en estructura al panel de Análisis. */
#moveHistory.move-history{
 display:grid;grid-template-columns:32px minmax(0,1fr) minmax(0,1fr);
 gap:0;align-content:start;align-items:stretch;padding:0;
 min-height:160px;max-height:450px;overflow-y:auto;overflow-x:hidden;
 border:1px solid #435b76;border-radius:7px;background:#101f33;
 scrollbar-gutter:stable;
}
#moveHistory .history-number,#moveHistory .history-move{
 display:flex;align-items:center;min-width:0;min-height:29px;
 padding:4px 5px;border:0;border-bottom:1px solid #7992ad20;
 font-size:13px;line-height:1.25;color:#e8eff8;
 white-space:nowrap;overflow:hidden;
}
#moveHistory .history-number{
 justify-content:center;background:#102238;color:#adbed2;
 font-size:12px;font-variant-numeric:tabular-nums;
}
#moveHistory .history-move{background:#1c314b;gap:2px}
#moveHistory .history-move.black-turn{background:#172a42}
#moveHistory .history-move.active{background:#375676;outline:1px solid #b7cbe0;outline-offset:-1px}
#moveHistory .history-move.empty{opacity:.75}
#moveHistory .history-move .san-piece{
 display:inline-flex;align-items:center;justify-content:center;
 flex:0 0 15px;width:15px;margin:0 2px 0 0;
 font-family:'DejaVu Sans','Segoe UI Symbol',serif;
 font-size:16px;font-weight:400;line-height:1;
}
#moveHistory .history-move .san-w{color:#fff;text-shadow:none;-webkit-text-stroke:0}
#moveHistory .history-move .san-b{color:#080a0d;text-shadow:0 0 2px #c9d1d9,0 1px 2px #c9d1d9;-webkit-text-stroke:0}
#moveHistory .history-move .san-text{overflow:hidden;text-overflow:ellipsis;min-width:0}
#moveHistory .move-empty{grid-column:1/-1;padding:12px}
@media(max-width:480px){#moveHistory.move-history{grid-template-columns:29px minmax(0,1fr) minmax(0,1fr)}#moveHistory .history-number,#moveHistory .history-move{padding:4px}#moveHistory .history-move .san-piece{width:14px;flex-basis:14px;font-size:15px}}

/* Arrastre visual: no altera la selección por clic ni los temas/piezas existentes. */
#gameBoard{touch-action:none;user-select:none;-webkit-user-select:none}
#gameBoard .square{touch-action:none}
#gameBoard .square.drag-source>.piece,#gameBoard .square.drag-source>.piece-asset{opacity:.18}
.drag-piece-ghost{position:fixed;transform:translate(-50%,-50%);z-index:1000;pointer-events:none;display:flex;justify-content:center;align-items:center;filter:drop-shadow(0 7px 8px #0008)}
.drag-piece-ghost .piece-asset{width:86%;height:86%;object-fit:contain}
.drag-piece-ghost .piece{font-size:clamp(27px,5.5vw,64px)}
@media(max-width:480px){.drag-piece-ghost .piece{font-size:clamp(22px,10vw,45px)}}

/* Capa de anotaciones: no intercepta clics ni modifica el tablero. */
#gameBoard{position:relative}
#gameBoard .sf-annotation-layer{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:8;overflow:visible}

/* JereChess ID · historial de partidas terminado */
.jere-game-history{border-top:1px solid #526b89;margin-top:18px;padding-top:10px}.jere-game-history h2{margin:12px 0 8px}.jere-game-history p{color:#bdcad9;font-size:12px}.jere-history-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 0;border-bottom:1px solid #35485f;font-size:12px}.jere-history-row button{color:#e8f3ff;background:#243f5b;border:1px solid #627c99;border-radius:6px;padding:6px 9px;cursor:pointer}
