/* Chesser's five portal workspaces. Size from the parent viewport, not iframe vh. */
body[data-embed=true]{margin:0;min-height:0;font-size:16px;--bg:#f6f0ff;--paper:#fffdf8;--ink:#282139;--muted:#776b87;--line:#ded1ed;--lime:#7254ca;--lilac:#eadeff;--rose:#ffe4d9;--button-ink:#fff;--panel-width:420px;--board-max:min(1000px,max(280px,calc(var(--portal-viewport-height,820px) - 200px)));color-scheme:light}
body[data-embed=true] .sidebar,body[data-embed=true] .intro,body[data-embed=true] .feature-strip,body[data-embed=true] main>footer{display:none}
body[data-embed=true] main{margin:0;padding:0 4px;max-width:none;width:100%}
/* Appearance tools only: portal navigation lives in the parent's left rail. */
body[data-embed=true] .topbar{height:31px;border:0;margin:0 0 9px;padding:0;font-size:16px;letter-spacing:1.3px}
body[data-embed=true] .topbar>span{opacity:.75}
body[data-embed=true] .topbar-actions{gap:8px}
body[data-embed=true] .topbar-actions button{font-size:16px;padding:5px 9px;border:1px solid var(--line);border-radius:7px}
body[data-embed=true] #theme{display:none}
body[data-embed=true] .workspace{display:grid;grid-template-columns:minmax(280px,1fr) var(--panel-width);align-items:start;gap:26px;width:100%;max-width:none;margin:0}
body[data-embed=true] .board-column{width:100%;max-width:var(--board-max);justify-self:center;min-width:0}
body[data-embed=true] .board{box-shadow:none;border-radius:8px}
body[data-embed=true] .board-frame{width:100%}
body[data-embed=true] .square .piece{filter:none;width:90%;height:90%}
body[data-embed=true] .player-row{padding:0 0 9px;gap:10px}
body[data-embed=true] .player-row>div{min-width:0}
body[data-embed=true] .player-row strong{font-size:18px;display:block;overflow-wrap:anywhere}
body[data-embed=true] .player-row small{font-size:14px}
body[data-embed=true] .player-row.bottom{padding:10px 0 0}
body[data-embed=true] .avatar{border-radius:11px;width:36px;height:36px;flex-shrink:0}
body[data-embed=true] .avatar.lime{color:var(--button-ink)}
body[data-embed=true] .clock{font-size:clamp(27px,3.5vw,38px);border-radius:8px;padding:4px 12px;min-width:101px;letter-spacing:-.7px}
body[data-embed=true] .clock.running{outline:2px solid var(--lime);color:var(--button-ink)}
body[data-embed=true] .control-panel{border:1px solid var(--line);border-radius:18px;box-shadow:none;min-width:0}
body[data-embed=true] .mode-tabs{padding:8px;gap:6px}
body[data-embed=true] .mode-tabs button{font-size:16px;padding:11px 5px;border-radius:10px;min-height:40px}
body[data-embed=true] .panel-body{padding:20px}
body[data-embed=true] .panel-body .eyebrow{font-size:14px;letter-spacing:.3px}
body[data-embed=true] .bot-profile{margin:15px 0 20px;gap:10px}
body[data-embed=true] .bot-profile>div{min-width:0}
body[data-embed=true] .bot-profile h2{font-size:18px;overflow-wrap:anywhere}
body[data-embed=true] .bot-profile p{font-size:16px;max-width:none}
body[data-embed=true] .bot-face{font-size:43px;width:58px;height:60px;border-radius:15px;color:var(--lime)}
body[data-embed=true] .tag{font-size:12px;padding:4px 5px}
body[data-embed=true] .difficulty-label,body[data-embed=true] .field-label{font-size:16px}
body[data-embed=true] .field-label{margin:17px 0 8px}
body[data-embed=true] .range-labels,body[data-embed=true] .segmented button{font-size:16px}
body[data-embed=true] input[type=range]{accent-color:var(--lime)}
body[data-embed=true] select,body[data-embed=true] .text-input,body[data-embed=true] textarea{font-size:16px;border-radius:9px;min-height:40px}
body[data-embed=true] .segmented button{min-height:39px}
body[data-embed=true] .segmented button.active{border-color:var(--lime)}
body[data-embed=true] .primary{color:var(--button-ink);border-radius:11px;font-size:16px;margin-top:17px;padding:14px 16px;min-height:45px}
body[data-embed=true] .secondary{font-size:16px;min-height:41px}
body[data-embed=true] .text-button{font-size:16px;min-height:37px}
body[data-embed=true] .time-categories{gap:4px}
body[data-embed=true] .time-categories button{font-size:16px;padding:10px 3px;min-height:36px}
body[data-embed=true] .time-categories button[aria-pressed=true]{border-color:var(--lime)}
body[data-embed=true] .gentle-note{padding-top:13px;margin-top:8px}
body[data-embed=true] .gentle-note p{font-size:16px}
body[data-embed=true] .gentle-note>span{color:var(--lime)}
body[data-embed=true] .notation{padding:17px 20px}
body[data-embed=true] .notation .eyebrow,body[data-embed=true] .notation #move-count{font-size:16px}
body[data-embed=true] .move-list{min-height:60px;max-height:180px;margin-top:12px}
body[data-embed=true] .move-list p{font-size:16px;line-height:1.6}
body[data-embed=true] .move-pair{font-size:16px;gap:7px;border-bottom:1px solid var(--line);margin:0;padding:3px 0}
body[data-embed=true] .move-pair button{font-size:16px;min-height:31px}
body[data-embed=true] .quick-tools{margin:12px 0 0;gap:7px}
body[data-embed=true] .quick-tools button{min-height:37px;font-size:16px;border-radius:9px}
body[data-embed=true] .board-tools{margin-top:9px;font-size:16px;gap:9px;min-height:31px;flex-wrap:wrap}
body[data-embed=true] .board-tools #board-status{font-size:16px;overflow-wrap:anywhere}
body[data-embed=true] .board-tools button{min-height:31px}
body[data-embed=true] #content-view{padding:10px 0;max-width:none;margin:0}
body[data-embed=true] .content-card p,body[data-embed=true] .lesson-copy p{font-size:16px}
body[data-embed=true] .lesson-layout,body[data-embed=true] .analysis-layout{max-width:none;grid-template-columns:minmax(280px,1fr) minmax(280px,.7fr)}
body[data-embed=true] .lesson-layout>.board-column,body[data-embed=true] .analysis-layout>.board-column{max-width:var(--board-max)}
body[data-embed=true] .eval-bar{left:-14px;width:8px}
body[data-embed=true] .eval-bar>span{display:none}
body[data-embed=true] button:focus-visible,body[data-embed=true] a:focus-visible,body[data-embed=true] input:focus-visible,body[data-embed=true] select:focus-visible,body[data-embed=true] textarea:focus-visible{outline-color:var(--lime)}
body[data-embed=true] .toast{color:var(--paper)}
/* ARCADE: playful stationery, generous rounded controls, narrow console. */
body[data-embed=true][data-skin=club]{--panel-width:380px;--bg:#f5edde}
body[data-embed=true][data-skin=club] .control-panel{border:2px solid var(--line);border-radius:24px}
body[data-embed=true][data-skin=club] .mode-tabs{background:var(--lilac);border-bottom:0;padding:10px}
body[data-embed=true][data-skin=club] .mode-tabs button.active{background:var(--paper)}
body[data-embed=true][data-skin=club] .board{border-radius:12px}
body[data-embed=true][data-skin=club] .player-row .avatar{border-radius:50%}
body[data-embed=true][data-skin=club] .clock{transform:rotate(-1deg);border:2px solid var(--line)}
body[data-embed=true][data-skin=club] .primary{border-radius:16px;box-shadow:0 4px 0 #4d338e}
body[data-embed=true][data-skin=club] .bot-face{background:#ffd986;color:#583d92;border-radius:16px;transform:rotate(-4deg)}
body[data-embed=true][data-skin=club] .notation{background:#f4ecff}
/* ARENA: navy/amber, centered board and readable right console. */
body[data-embed=true][data-skin=arena]{--bg:#111a26;--paper:#192433;--ink:#edf1f7;--muted:#9eacbf;--line:#344151;--lime:#f0b84c;--lilac:#293746;--rose:#453036;--button-ink:#111a26;--panel-width:440px;color-scheme:dark}
body[data-embed=true][data-skin=arena] .workspace{gap:24px}
body[data-embed=true][data-skin=arena] .control-panel{border-radius:4px;background:#15202d}
body[data-embed=true][data-skin=arena] .board{border-radius:3px;border:1px solid #66717e}
body[data-embed=true][data-skin=arena] .panel-body{padding:17px}
body[data-embed=true][data-skin=arena] .mode-tabs{background:#0c1420;padding:5px;gap:2px}
body[data-embed=true][data-skin=arena] .mode-tabs button{border-radius:2px;letter-spacing:.3px}
body[data-embed=true][data-skin=arena] .mode-tabs button.active{background:#f0b84c;color:#111a26}
body[data-embed=true][data-skin=arena] .clock{font-size:39px;border-radius:2px;padding:3px 15px;font-weight:800;min-width:121px}
body[data-embed=true][data-skin=arena] .clock.running{outline:0;box-shadow:inset 4px 0 0 #fff3}
body[data-embed=true][data-skin=arena] .avatar{border-radius:3px}
body[data-embed=true][data-skin=arena] .bot-profile{margin:12px 0 16px}
body[data-embed=true][data-skin=arena] .bot-face{border-radius:3px;background:#293746;color:#f0b84c;width:49px;height:52px;font-size:35px}
body[data-embed=true][data-skin=arena] .bot-profile h2{font-size:20px}
body[data-embed=true][data-skin=arena] .bot-profile p{font-size:16px}
body[data-embed=true][data-skin=arena] .primary,body[data-embed=true][data-skin=arena] .secondary,body[data-embed=true][data-skin=arena] select,body[data-embed=true][data-skin=arena] .segmented button,body[data-embed=true][data-skin=arena] .quick-tools button{border-radius:3px}
body[data-embed=true][data-skin=arena] .field-label{margin-top:14px}
body[data-embed=true][data-skin=arena] .notation{background:#101a27;padding:15px 17px}
body[data-embed=true][data-skin=arena] .move-list{max-height:210px}
/* CHESS LIBRARY: typeset pages; control panel LEFT, board RIGHT. */
body[data-embed=true][data-skin=editorial]{--bg:#f9f8f4;--paper:#fff;--ink:#181b1f;--muted:#70716d;--line:#d2d1c9;--lime:#23272b;--lilac:#ece9df;--rose:#eee0d7;--button-ink:#fff;--panel-width:400px}
body[data-embed=true][data-skin=editorial] .workspace{grid-template-columns:var(--panel-width) minmax(280px,1fr);gap:38px}
body[data-embed=true][data-skin=editorial] .board-column{grid-column:2;grid-row:1}
body[data-embed=true][data-skin=editorial] .control-panel{grid-column:1;grid-row:1;border-radius:0;border-top:4px solid var(--ink)}
body[data-embed=true][data-skin=editorial] .board{border-radius:0;border:1px solid var(--ink)}
body[data-embed=true][data-skin=editorial] .mode-tabs{padding:0;gap:0;background:#f0ede6}
body[data-embed=true][data-skin=editorial] .mode-tabs button{border-radius:0;border-right:1px solid var(--line);font-weight:700}
body[data-embed=true][data-skin=editorial] .mode-tabs button.active{background:#e5bc43;color:#181b1f}
body[data-embed=true][data-skin=editorial] .bot-face{border-radius:0;background:#e5bc43;color:#181b1f}
body[data-embed=true][data-skin=editorial] .bot-profile h2,body[data-embed=true][data-skin=editorial] .panel-body>h2,body[data-embed=true][data-skin=editorial] .lesson-copy h2{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:23px;letter-spacing:-.7px}
body[data-embed=true][data-skin=editorial] .avatar,body[data-embed=true][data-skin=editorial] .clock,body[data-embed=true][data-skin=editorial] .primary,body[data-embed=true][data-skin=editorial] .secondary,body[data-embed=true][data-skin=editorial] select,body[data-embed=true][data-skin=editorial] .segmented button,body[data-embed=true][data-skin=editorial] .quick-tools button{border-radius:0}
body[data-embed=true][data-skin=editorial] .clock.running{background:#e5bc43;border-color:#e5bc43;outline:0;color:#181b1f}
body[data-embed=true][data-skin=editorial] .notation{border-top:2px solid var(--ink)}
body[data-embed=true][data-skin=editorial] .move-pair button{font-family:Georgia,serif;font-size:16px}
/* ACADEMY: warm paper tones, spacious training card beside the board. */
body[data-embed=true][data-skin=studio]{--bg:#f3e9db;--paper:#fffbf3;--ink:#4b3629;--muted:#806958;--line:#d8c6b4;--lime:#ad5136;--lilac:#f0ddc8;--rose:#f1cebc;--button-ink:#fff;--panel-width:440px}
body[data-embed=true][data-skin=studio] .workspace{grid-template-columns:minmax(280px,1fr) var(--panel-width);gap:40px}
body[data-embed=true][data-skin=studio] .control-panel{border:0;border-radius:25px;box-shadow:0 8px 0 #e3d2bf}
body[data-embed=true][data-skin=studio] .panel-body{padding:25px 27px}
body[data-embed=true][data-skin=studio] .bot-face{width:74px;height:74px;border-radius:50%;font-size:50px;background:#f0ddc8}
body[data-embed=true][data-skin=studio] .bot-profile h2,body[data-embed=true][data-skin=studio] .panel-body>h2{font-family:Georgia,serif;font-size:24px;font-weight:400}
body[data-embed=true][data-skin=studio] .bot-profile{align-items:flex-start;margin-bottom:24px}
body[data-embed=true][data-skin=studio] .mode-tabs{padding:12px;background:#e8d6c1;border:0}
body[data-embed=true][data-skin=studio] .mode-tabs button.active{background:var(--paper)}
body[data-embed=true][data-skin=studio] .primary{border-radius:28px;justify-content:center;gap:12px}
body[data-embed=true][data-skin=studio] .gentle-note{border:0;background:#f4e6d6;border-radius:13px;padding:14px;margin-top:14px}
body[data-embed=true][data-skin=studio] .notation{border:0;background:#fbf0e2;padding:20px 27px}
body[data-embed=true][data-skin=studio] .board{border-radius:9px;box-shadow:0 5px 0 #b6a18a}
body[data-embed=true][data-skin=studio] .player-row .avatar{border-radius:50%}
/* FOCUS: centered board; horizontal console below: modes / setup / moves. */
body[data-embed=true][data-skin=dashboard]{--bg:#111c23;--paper:#192831;--ink:#e4f1f4;--muted:#9cb1bb;--line:#354750;--lime:#67d4d0;--lilac:#293e49;--rose:#3c3444;--button-ink:#11252a;--board-max:min(820px,max(280px,calc(var(--portal-viewport-height,820px) - 320px)));color-scheme:dark}
body[data-embed=true][data-skin=dashboard] .workspace{grid-template-columns:minmax(0,1fr);gap:18px}
body[data-embed=true][data-skin=dashboard] .board-column{grid-column:1;max-width:var(--board-max)}
body[data-embed=true][data-skin=dashboard] .control-panel{display:grid;grid-template-columns:144px minmax(360px,1.6fr) minmax(210px,1fr);grid-column:1;border-radius:0;border-top:2px solid var(--lime);overflow:visible}
body[data-embed=true][data-skin=dashboard] .mode-tabs{grid-column:1;grid-row:1;flex-direction:column;justify-content:flex-start;border-bottom:0;border-right:1px solid var(--line);padding:11px}
body[data-embed=true][data-skin=dashboard] .mode-tabs button{flex:0;min-height:42px;text-align:left;padding:12px;border-radius:2px}
body[data-embed=true][data-skin=dashboard] .mode-tabs button.active{background:var(--lime);color:var(--button-ink)}
body[data-embed=true][data-skin=dashboard] .panel-body{grid-column:2;grid-row:1;padding:18px 22px}
body[data-embed=true][data-skin=dashboard] .notation{grid-column:3;grid-row:1;border-top:0;border-left:1px solid var(--line);padding:18px}
body[data-embed=true][data-skin=dashboard] .notation .move-list{max-height:242px;min-height:100px}
body[data-embed=true][data-skin=dashboard] .board,body[data-embed=true][data-skin=dashboard] .avatar,body[data-embed=true][data-skin=dashboard] .clock,body[data-embed=true][data-skin=dashboard] .primary,body[data-embed=true][data-skin=dashboard] .secondary,body[data-embed=true][data-skin=dashboard] select,body[data-embed=true][data-skin=dashboard] .quick-tools button{border-radius:2px}
body[data-embed=true][data-skin=dashboard] .clock{background:transparent;border:0;font-size:32px;padding:0;font-weight:500}
body[data-embed=true][data-skin=dashboard] .clock.running{background:transparent;color:var(--lime);outline:0}
body[data-embed=true][data-skin=dashboard] .player-row{border-bottom:1px solid var(--line);padding-bottom:9px}
body[data-embed=true][data-skin=dashboard] .player-row.bottom{border-bottom:0;padding-top:9px}
body[data-embed=true][data-skin=dashboard] .bot-face{background:transparent;border:1px solid var(--line);width:44px;height:44px;border-radius:2px;font-size:30px}
body[data-embed=true][data-skin=dashboard] .bot-profile{margin:8px 0 12px}
body[data-embed=true][data-skin=dashboard] .bot-profile h2{font-size:17px}
body[data-embed=true][data-skin=dashboard] .bot-profile p{font-size:16px}
body[data-embed=true][data-skin=dashboard] #bot-panel{display:grid;grid-template-columns:minmax(145px,1fr) minmax(180px,1.1fr);gap:7px 18px;align-content:start}
body[data-embed=true][data-skin=dashboard] #bot-panel>.eyebrow{grid-column:1;grid-row:1}
body[data-embed=true][data-skin=dashboard] #bot-panel>.bot-profile{grid-column:1;grid-row:2}
body[data-embed=true][data-skin=dashboard] #bot-panel>.difficulty-label{grid-column:1;grid-row:3}
body[data-embed=true][data-skin=dashboard] #level{grid-column:1;grid-row:4;margin:0}
body[data-embed=true][data-skin=dashboard] #bot-panel>.range-labels{grid-column:1;grid-row:5}
body[data-embed=true][data-skin=dashboard] #bot-panel>.field-label:not([for]){grid-column:2;grid-row:1;margin:0}
body[data-embed=true][data-skin=dashboard] #color-picker{grid-column:2;grid-row:2;align-self:start}
body[data-embed=true][data-skin=dashboard] #bot-panel>label[for=bot-time]{grid-column:2;grid-row:3;margin:0}
body[data-embed=true][data-skin=dashboard] #bot-panel>.time-categories{grid-column:2;grid-row:4;margin:0}
body[data-embed=true][data-skin=dashboard] #bot-time{grid-column:2;grid-row:5}
body[data-embed=true][data-skin=dashboard] #bot-time-note{grid-column:2;grid-row:6;margin:0}
body[data-embed=true][data-skin=dashboard] #bot-panel>.rules-link{grid-column:2;grid-row:7;text-align:left;margin:0}
body[data-embed=true][data-skin=dashboard] #new-game{grid-column:1;grid-row:6 / 8;margin:0;align-self:start}
body[data-embed=true][data-skin=dashboard] #hint{grid-column:1;grid-row:8;text-align:left;padding:4px 0}
body[data-embed=true][data-skin=dashboard] #bot-panel>.gentle-note{grid-column:2;grid-row:8;border:0;padding:0;margin:0}
body[data-embed=true][data-skin=dashboard] .gentle-note p{font-size:16px}
html[lang=ar] body[data-embed=true] .panel-body,html[lang=ar] body[data-embed=true] .notation,html[lang=ar] body[data-embed=true] dialog{direction:rtl;text-align:right}
html[lang=ar] body[data-embed=true] .board,html[lang=ar] body[data-embed=true] .square,html[lang=ar] body[data-embed=true] .board-frame{direction:ltr}
@media(max-width:1050px){body[data-embed=true]{--panel-width:320px}body[data-embed=true][data-skin=arena]{--panel-width:350px}body[data-embed=true] .workspace{gap:21px}body[data-embed=true][data-skin=club],body[data-embed=true][data-skin=editorial]{--panel-width:300px}body[data-embed=true][data-skin=studio]{--panel-width:330px}body[data-embed=true][data-skin=studio] .workspace{gap:25px}body[data-embed=true][data-skin=studio] .panel-body{padding:21px}body[data-embed=true][data-skin=dashboard] .control-panel{grid-template-columns:120px minmax(360px,1fr)}body[data-embed=true][data-skin=dashboard] .notation{grid-column:1 / -1;grid-row:2;border-left:0;border-top:1px solid var(--line)}body[data-embed=true][data-skin=dashboard] .notation .move-list{max-height:140px;min-height:40px}}
@media(max-width:760px){body[data-embed=true] main{padding:0 2px}body[data-embed=true] .workspace,body[data-embed=true][data-skin=editorial] .workspace,body[data-embed=true][data-skin=studio] .workspace,body[data-embed=true][data-skin=dashboard] .workspace{grid-template-columns:minmax(0,1fr);gap:22px}body[data-embed=true] .board-column,body[data-embed=true][data-skin=editorial] .board-column,body[data-embed=true][data-skin=dashboard] .board-column{grid-column:1;grid-row:1;max-width:none;width:100%}body[data-embed=true] .control-panel,body[data-embed=true][data-skin=editorial] .control-panel,body[data-embed=true][data-skin=dashboard] .control-panel{grid-column:1;grid-row:2;display:block;width:100%}body[data-embed=true] .topbar>span{font-size:16px;letter-spacing:.7px}body[data-embed=true] .topbar-actions button{padding:5px;font-size:16px}body[data-embed=true] .clock,body[data-embed=true][data-skin=arena] .clock{font-size:30px;min-width:96px}body[data-embed=true] .board-tools{gap:7px}body[data-embed=true] .board-tools #undo span{display:none}body[data-embed=true] .board-tools #board-status{font-size:16px;flex:1;min-width:110px}body[data-embed=true] .lesson-layout,body[data-embed=true] .analysis-layout{grid-template-columns:1fr;gap:20px}body[data-embed=true][data-skin=dashboard] .mode-tabs{display:flex;flex-direction:row;border-right:0;border-bottom:1px solid var(--line)}body[data-embed=true][data-skin=dashboard] .mode-tabs button{flex:1;text-align:center}body[data-embed=true][data-skin=dashboard] .notation{border-left:0;border-top:1px solid var(--line)}}
@media(max-width:460px){body[data-embed=true] .topbar>span{letter-spacing:0;font-size:16px}body[data-embed=true] .player-row strong{font-size:17px}body[data-embed=true] .player-row small{font-size:14px}body[data-embed=true] .quick-tools{gap:5px}body[data-embed=true] .quick-tools button{padding:5px 7px;font-size:16px}body[data-embed=true] .square .coord{font-size:11px}body[data-embed=true] .panel-body,body[data-embed=true][data-skin=studio] .panel-body{padding:20px 16px}body[data-embed=true][data-skin=dashboard] #bot-panel{display:block}body[data-embed=true][data-skin=dashboard] #bot-panel>.field-label{margin:16px 0 8px}body[data-embed=true][data-skin=dashboard] #bot-panel>.time-categories{margin:8px 0}body[data-embed=true][data-skin=dashboard] #level{margin:12px 0 6px}body[data-embed=true][data-skin=dashboard] #new-game{margin-top:16px}body[data-embed=true][data-skin=dashboard] #bot-time-note{margin-top:7px}body[data-embed=true][data-skin=dashboard] #bot-panel>.gentle-note{margin-top:10px;padding-top:10px}}
/* Grid rearrangement must always respect the active game mode. */
@media(max-width:760px){body[data-embed=true] .quick-tools button,body[data-embed=true] .board-tools button,body[data-embed=true] .mode-tabs button,body[data-embed=true] .segmented button,body[data-embed=true] .time-categories button{min-height:44px}}
body[data-embed=true] [hidden]{display:none!important}