/* Native sprites have a 22px visible strip and ten transparent rows below.
   Position the sprite and close control in the same coordinate system. */
.presentation-page .client-window .replica-titlebar {
 --replica-art-y:0px; position:absolute !important; left:6px !important; right:5px !important; top:6px !important;
 height:22px !important; min-height:22px !important; margin:0 !important; padding:0 !important;
 display:flex !important; align-items:center !important; justify-content:center !important;
 border:0 !important; background:url('assets/ui/game/pattern_titlebar_left.png') left var(--replica-art-y)/32px 32px no-repeat,url('assets/ui/game/pattern_titlebar_right.png') right var(--replica-art-y)/32px 32px no-repeat !important;
 color:#dedbd3 !important; text-shadow:none; z-index:3;
}
.presentation-page .client-window .replica-titlebar::before { content:''; position:absolute; top:var(--replica-art-y); height:32px; left:32px; right:32px; background:url('assets/ui/game/pattern_titlebar_center.png') left top/32px 32px repeat-x; pointer-events:none; }
.presentation-page .client-window .replica-titlebar .replica-title-label { font:400 10px/14px Tahoma,Verdana,Arial,sans-serif !important; position:relative !important; top:0; left:auto !important; right:auto !important; margin:0 !important; padding:0 !important; color:inherit; text-align:center; pointer-events:none; }
.presentation-page .client-window .replica-titlebar .game-close { position:absolute !important; top:calc(var(--replica-art-y) + 3px) !important; right:3px !important; width:15px !important; height:15px !important; min-height:0 !important; margin:0 !important; padding:0 !important; border:0 !important; background:url('assets/ui/game/public_close_button_01.png') center/15px 15px no-repeat !important; }
.presentation-page .client-window .replica-titlebar .game-close:hover { background-image:url('assets/ui/game/public_close_button_02.png') !important; }
.presentation-page .client-window .replica-titlebar .game-close:active { background-image:url('assets/ui/game/public_close_button_03.png') !important; }
.presentation-page .client-window .replica-board-top { position:absolute; top:-6px; left:-6px; right:-6px; height:32px; pointer-events:none; background:url('assets/ui/game/pattern_board_corner_lefttop.png') left top/32px 32px no-repeat,url('assets/ui/game/pattern_board_corner_righttop.png') right top/32px 32px no-repeat; }
/* The board border already draws the top edge. Repeating it here produced the
   extra horizontal rule above the title bar on the other replicas. */
.presentation-page .client-window .replica-board-top::before { content:none; }
.presentation-page .client-window:is([data-replica=rune],[data-replica=prestige],[data-replica=titles],[data-replica=skillcolor]) .replica-board-top { display:none; }
.presentation-page .client-window[data-replica=prestige] .prestige-portrait { left:11px; top:11px; width:48px; height:48px; }
.presentation-page .client-window[data-replica=prestige] .prestige-portrait-frame { position:absolute; left:7px; top:7px; width:53px; height:53px; pointer-events:none; }
/* tab_menu_01 is one continuous 439x21 image, scaled once across a header. */
.presentation-page .client-window :is(.client-strip,.native-panel-title,.game-panel-title,.title-panel-heading),
.presentation-page #titles .st-panel > h3 {
 background:url('assets/ui/game/tab_menu_01.png') center/100% 21px no-repeat !important;
 color:#c2c2c2; border:0; box-shadow:none; text-align:center;
}
.presentation-page #titles .st-window::before { background:url('assets/game-ui/titles/board-r17.png') 0 0/716px 582px no-repeat; }
.presentation-page #titles .st-frames { height:541px; }
.presentation-page #titles .st-style { height:359px; }
.presentation-page #titles .st-list,.presentation-page #titles .st-scrollbar { height:430px; }
.presentation-page #titles .st-frame-row { margin-bottom:2px; }
.presentation-page #titles .st-preset { position:absolute; left:9px; right:10px; bottom:38px; height:32px; border-top:1px solid #3a3937; display:flex; gap:4px; align-items:center; }
.presentation-page #titles .st-preset label { width:97px; flex:none; color:#c8a24a; }
.presentation-page #titles .st-preset select { position:relative; top:-.5px; width:140px; flex:none; height:20px; padding:1px 15px 1px 4px; appearance:none; background:#0d0b08 url('assets/game-ui/titles/arrow.png') right 4px center/11px 7px no-repeat; border:1px solid #3a3937; font-size:10px; }
.presentation-page #titles .st-preset button { position:relative; top:-1px; flex:none; width:43px; height:21px; min-width:0; border:0; padding:0; border-radius:0; color:#e0e0e0; background:url('assets/ui/game/public_small_button_01.png') center/43px 21px no-repeat; }
.presentation-page #titles .st-preset button:first-of-type { margin-left:5px; }
.presentation-page #titles .st-preset button:hover { background-image:url('assets/ui/game/public_small_button_02.png'); }
.presentation-page #titles .st-preset button:active { background-image:url('assets/ui/game/public_small_button_03.png'); }
.presentation-page #titles .st-preset button:disabled { opacity:.45; }
.presentation-page #titles .st-title-text[data-effect=shimmer] { color:transparent; background:linear-gradient(100deg,var(--st-colour) 10%,var(--st-colour) 35%,#fffbd4 48%,var(--st-colour) 60%,var(--st-colour) 90%); background-size:250% 100%; background-clip:text; text-shadow:none; animation:st-sweep var(--st-speed) linear infinite; }
.presentation-page #titles .st-title-text[data-effect=rainbow] { color:transparent; background:linear-gradient(90deg,#f44,#ff4,#4f8,#4cf,#d4f,#f44); background-size:200% 100%; background-clip:text; text-shadow:none; animation:st-sweep var(--st-speed) linear infinite; }
.presentation-page #titles .st-title-text[data-effect=twinkle] { animation:st-twinkle var(--st-speed) steps(4) infinite; }
.presentation-page #titles .st-title-text[data-effect=gradient] { color:transparent; background:linear-gradient(90deg,var(--st-colour),var(--st-colour2)); background-clip:text; text-shadow:none; }
.presentation-page #titles .st-title-text[data-effect=fire] { color:#ffe16a; text-shadow:0 -2px 3px #ff6a00,0 -4px 6px #f22; animation:st-twinkle var(--st-speed) ease-in-out infinite; }
.presentation-page #titles .st-title-text[data-effect=neon] { text-shadow:0 0 4px var(--st-colour),0 0 8px var(--st-colour); animation:st-twinkle var(--st-speed) ease-in-out infinite; }
.presentation-page #titles .st-title-text[data-effect=glitch] { animation:st-glitch var(--st-speed) steps(1) infinite; }
.presentation-page #titles .st-title-text[data-effect=breathe] { animation:st-frame-breathe var(--st-speed) ease-in-out infinite; }
.presentation-page #titles .st-title-frame[data-frame-effect=heartbeat] > img { transform-origin:center; animation:st-heartbeat 1.5s ease-in-out infinite; }
@keyframes st-heartbeat { 0%,50%,100% { transform:scale(1); filter:none; } 15%,40% { transform:scale(1.02); filter:brightness(1.08) drop-shadow(0 0 1px var(--st-colour)); } 25% { transform:scale(1); } }
@keyframes st-twinkle { 40%,80% { opacity:.55; } 55%,90% { opacity:1; } }
@keyframes st-glitch { 12%,15% { transform:translateX(1px); text-shadow:-1px 0 #f44,1px 0 #4ff; } 16%,100% { transform:none; } }
.presentation-page .replica-notice { position:absolute; z-index:60; left:50%; bottom:48px; transform:translateX(-50%); width:max-content; max-width:90%; padding:9px 14px; border:1px solid #8d8060; outline:1px solid #111; outline-offset:-3px; background:#11100ef5; color:#f6c35a; text-align:center; font:10px/1.4 Tahoma,sans-serif; }
.presentation-page .replica-notice input { display:block; width:100%; margin-top:5px; }
.presentation-page .replica-save-dialog { position:absolute; z-index:60; left:50%; top:50%; transform:translate(-50%,-50%); width:260px; padding:16px; border:1px solid #9a8b69; outline:1px solid #111; outline-offset:-3px; background:#12100ff5; color:#e5c988; }
.presentation-page .replica-save-dialog label { display:block; }
.presentation-page .replica-save-dialog input { display:block; width:100%; margin:10px 0; }
.presentation-page .replica-save-dialog > div { display:flex; gap:10px; justify-content:center; }
.presentation-page .replica-save-dialog button { width:86px; height:20px; padding:0; border:0; color:#e0e0e0; background:url('assets/ui/game/public_large_button_01.png') center/100% 100% no-repeat; }
@media(prefers-reduced-motion:reduce) { .presentation-page #titles .st-title-text,.presentation-page #titles .st-title-frame > img { animation:none !important; } }
/* Keep UI glyphs light. No inherited outline, shadow or synthetic bold. */
.presentation-page .client-window,
.presentation-page .client-window * {
 font-weight:400 !important; font-synthesis:none; text-shadow:none !important;
 -webkit-text-stroke:0; -webkit-font-smoothing:antialiased; font-smooth:never;
 text-rendering:optimizeSpeed;
}
.presentation-page .client-window :is(h2,h3,h4,h5,p,span,small,strong,b,em,label,input,select,button,output,div) { font-family:Tahoma,Verdana,Arial,sans-serif; }
.presentation-page .client-window[data-replica=prestige] .prestige-client-footer { left:4px; top:375px; width:253px; height:37px; background:url('assets/game-ui/prestige/windows_char_tab_01.png') 0 0/253px 37px no-repeat; }
/* The tab sprite includes its own bottom board edge. */
.presentation-page .client-window[data-replica=prestige]::before { clip-path:inset(0 0 39px 0); }
.presentation-page #titles .st-frame-name { font-size:11px; }
.presentation-page #titles .st-window .st-frames footer { font-size:9px; }
.presentation-page #titles .st-actions { left:10px; border-top:0; gap:12px; }
.presentation-page #titles .st-actions button { position:relative; top:.5px; width:88px; height:21px; background-size:88px 21px; }
.presentation-page #titles .st-window .st-frames footer { left:10px; right:10px; }