/* Special Title, 716 x 550 at 1x. Positions follow the supplied client captures. */
.presentation-page #titles .st-window { padding:0; border:0; border-image:none; border-radius:0; background:none; box-shadow:none; overflow:visible; color:#e0e0e0; text-shadow:1px 1px #000; }
.presentation-page #titles .st-window::before { content:''; position:absolute; inset:0; pointer-events:none; background:url('assets/game-ui/titles/board.svg') 0 0/716px 550px no-repeat; }
.presentation-page #titles .st-window :is(div,span,p,h3,label,input,select,button,output,footer) { box-sizing:border-box; font:10px/1.2 Tahoma,Verdana,sans-serif; letter-spacing:0; text-transform:none; }
.presentation-page #titles .st-window .title-window-bar { position:absolute; top:5px; left:15px; right:7px; height:22px; min-height:0; margin:0; padding:0 36px 0 24px; background:url('assets/game-ui/titles/title-texture.png') repeat-x; color:#dedbd3; border:0; }
.presentation-page #titles .st-window .game-close { top:2px; right:0; width:18px; height:18px; background-image:url('assets/game-ui/titles/close.png'); }
.presentation-page #titles .st-window .game-close:hover { background-image:url('assets/ui/game/public_close_button_02.png'); }
.presentation-page #titles .st-window .game-close:active { background-image:url('assets/ui/game/public_close_button_03.png'); }
.presentation-page #titles .st-panel { position:absolute; border:1px solid #77766f; outline:1px solid #090909; outline-offset:-3px; padding:0; background:#080a06 url('assets/game-ui/titles/panel-texture.png') repeat; }
.presentation-page #titles .st-panel > h3 { position:absolute; left:2px; right:2px; top:2px; height:20px; display:flex; align-items:center; justify-content:center; padding:0; margin:0; background:url('assets/game-ui/titles/panel-title.png') repeat-x; color:#c2c2c2; font:12px/1 Tahoma,Verdana,sans-serif; }
.presentation-page #titles .st-frames { left:9px; top:32px; width:278px; height:509px; }
.presentation-page #titles .st-preview { left:297px; top:32px; width:410px; height:172px; }
.presentation-page #titles .st-style { left:297px; top:214px; width:410px; height:327px; }
.presentation-page #titles .st-filters { position:absolute; left:6px; top:28px; right:6px; height:24px; display:flex; gap:2px; }
.presentation-page #titles .st-filters button { flex:1; height:24px; border:0; border-bottom:2px solid transparent; border-radius:0; background:#121110; color:#fee3ae; padding:0; }
.presentation-page #titles .st-filters button:hover { background:#1e1912; }
.presentation-page #titles .st-filters button[aria-pressed=true] { background:#2e261a; color:#f6a800; border-bottom-color:#f6a800; }
.presentation-page #titles .st-list { position:absolute; left:6px; top:56px; width:256px; height:382px; overflow-x:hidden; overflow-y:scroll; overscroll-behavior:contain; scrollbar-width:none; padding:0; }
.presentation-page #titles .st-list::-webkit-scrollbar { display:none; }
.presentation-page #titles .st-scrollbar { position:absolute; left:264px; top:56px; width:8px; height:382px; background:#39352e; border:1px solid #544d44; touch-action:none; }
.presentation-page #titles .st-scrollbar i { position:absolute; top:0; left:0; right:0; background:#918b82; border:1px solid #aaa299; }
.presentation-page #titles .st-frame-row { position:relative; display:block; width:256px; height:46px; margin:0 0 2px; padding:0; border:0; border-radius:0; text-align:left; background:#18140f; color:#e0e0e0; }
.presentation-page #titles .st-frame-row::before { content:''; position:absolute; left:0; top:2px; bottom:2px; width:3px; background:#4a4436; }
.presentation-page #titles .st-frame-row:hover { background:#241d15; }
.presentation-page #titles .st-frame-row[aria-pressed=true] { background:#30261a; }
.presentation-page #titles .st-frame-row[aria-pressed=true]::before { background:#c8a24a; }
.presentation-page #titles .st-thumbnail { position:absolute; left:8px; top:3px; width:60px; height:40px; display:flex; align-items:center; justify-content:center; background:#0d0b08; border:1px solid #3a3937; }
.presentation-page #titles .st-thumbnail img { position:static; display:block; max-width:58px; max-height:38px; width:auto; height:auto; object-fit:contain; opacity:1; filter:none; }
.presentation-page #titles .st-frame-name { position:absolute; left:76px; top:8px; right:2px; white-space:nowrap; }
.presentation-page #titles .st-frame-status { position:absolute; left:76px; top:25px; color:#6acf6a; }
.presentation-page #titles .st-active { color:#f6a800 !important; }
.presentation-page #titles .st-empty { margin:20px 4px 0; text-align:center; color:#8c8c8c; }
.presentation-page #titles .st-window .st-frames footer { position:absolute; left:10px; right:10px; bottom:0; display:block; height:26px; padding:7px 0 0; border:0; border-top:1px solid #3a3937; text-align:center; color:#c8a24a; }
.presentation-page #titles .st-preview-box { position:absolute; left:5px; top:28px; width:398px; height:114px; background:#100d0a; border:1px solid #3a3937; }
.presentation-page #titles .st-preview-group { position:absolute; left:0; right:0; display:flex; justify-content:center; }
.presentation-page #titles .st-title-frame { position:relative; flex:none; background:none; }
.presentation-page #titles .st-title-frame > img { position:absolute; inset:0; display:block; width:100%; height:100%; max-width:none; max-height:none; object-fit:contain; opacity:1; filter:none; }
.presentation-page #titles .st-text-position { position:absolute; left:50%; top:51.04%; transform:translate(-50%,-50%); width:max-content; max-width:390px; text-align:center; }
.presentation-page #titles .st-window .st-title-text, .presentation-page #titles .character-title-preview .st-title-text { display:block; white-space:pre; font-size:13px; font-weight:bold; line-height:16px; color:var(--st-colour); text-shadow:1px 1px #000; }
.presentation-page #titles .st-player-name { position:absolute; left:0; right:0; color:white; height:16px; text-align:center; padding-top:2px; }
.presentation-page #titles .st-status { position:absolute; top:147px; left:4px; right:4px; margin:0; height:15px; text-align:center; color:#6acf6a; }
.presentation-page #titles .st-controls { position:absolute; left:9px; right:10px; top:28px; }
.presentation-page #titles .st-style-row { position:relative; height:27px; display:block; margin:0; padding:0; }
.presentation-page #titles .st-style-row > label { position:absolute; left:0; top:4px; width:100px; color:#c8a24a; white-space:nowrap; }
.presentation-page #titles .st-style-row > :is(input,select,.st-extras,.st-swatch) { position:absolute; left:100px; top:0; margin:0; }
.presentation-page #titles .st-style-row > input[type=text] { width:236px; height:20px; padding:2px 4px; color:#e0e0e0; background:#0d0b08; border:1px solid #3a3937; border-radius:0; }
.presentation-page #titles .st-style-row select { width:190px; height:20px; min-height:0; padding:1px 20px 1px 4px; border:1px solid #3a3937; border-radius:0; appearance:none; background:#0d0b08 url('assets/game-ui/titles/arrow.png') right 4px center/11px 7px no-repeat; color:#e0e0e0; }
.presentation-page #titles .st-style-row select option { background:#17140e; color:#e0e0e0; }
.presentation-page #titles .st-style-row select:disabled { color:#5a5650; opacity:1; }
.presentation-page #titles .st-counter { position:absolute; top:4px; right:2px; color:#8c8c8c; }
.presentation-page #titles .st-style-row > input[type=range] { top:5px; width:258px; height:9px; border:1px solid #68635b; border-radius:2px; background:#211c16; box-shadow:inset 0 0 0 2px #100d0a; }
.presentation-page #titles .st-style-row > input[type=range]::-webkit-slider-thumb { appearance:none; width:15px; height:15px; border:1px solid #b49b7d; border-radius:4px; background:#a68b6e; box-shadow:inset 0 0 2px #d1b69a; }
.presentation-page #titles .st-speed-value { position:absolute; left:368px; top:4px; color:#f6a800; }
.presentation-page #titles .st-window .st-off { color:#5a5650; }
.presentation-page #titles .st-swatch { border:1px solid #3a3937; width:34px; height:18px; top:1px; padding:0; border-radius:0; }
.presentation-page #titles .st-hex { position:absolute; left:140px; top:4px; color:#e0e0e0; }
.presentation-page #titles .st-color2 { position:absolute; left:224px; top:1px; display:flex; align-items:center; gap:5px; color:#c8a24a; height:18px; }
.presentation-page #titles .st-color2 .st-swatch { position:static; width:25px; }
.presentation-page #titles .st-color2 > span:last-child { color:#e0e0e0; font-size:9px; }
.presentation-page #titles .st-extras { display:grid; grid-template-columns:112px 112px 68px; grid-auto-rows:27px; width:292px; }
.presentation-page #titles .st-extras label { display:flex; align-items:center; height:16px; color:#e0e0e0; white-space:nowrap; }
.presentation-page #titles .st-extras input { appearance:none; width:15px; height:15px; margin:0 5px 0 0; border:1px solid #6e6c63; background:linear-gradient(135deg,#27251e,#0d0b08); box-shadow:inset 0 0 0 2px #0d0b08; border-radius:0; }
.presentation-page #titles .st-extras input:checked::after { content:'✓'; top:-1px; color:#e1cc96; font-size:13px; }
.presentation-page #titles .st-extras label:last-child { grid-column:1 / 4; }
.presentation-page #titles .st-actions { position:absolute; left:9px; right:10px; bottom:0; height:38px; border-top:1px solid #3a3937; display:flex; align-items:center; justify-content:center; gap:12px; }
.presentation-page #titles .st-actions button { width:86px; height:19px; border:0; padding:0; border-radius:0; background:url('assets/ui/game/public_large_button_01.png') center/100% 100% no-repeat; color:#e0e0e0; }
.presentation-page #titles .st-actions button:hover { background-image:url('assets/ui/game/public_large_button_02.png'); }
.presentation-page #titles .st-actions button:active { background-image:url('assets/ui/game/public_large_button_03.png'); }
.presentation-page #titles .st-actions button:disabled { color:#5a5650; opacity:1; background-image:url('assets/ui/game/public_large_button_01.png'); }
.presentation-page #titles .st-palette { position:absolute; z-index:40; left:407px; top:300px; width:190px; padding:8px; border:1px solid #82765c; background:#100d0a; box-shadow:0 2px 8px #000; }
.presentation-page #titles .st-palette-heading { color:#c8a24a; margin-bottom:8px; }
.presentation-page #titles .st-palette-colours { display:grid; grid-template-columns:repeat(6,24px); gap:5px; margin-bottom:8px; }
.presentation-page #titles .st-palette-colours button { width:24px; height:22px; padding:0; border:1px solid #82765c; border-radius:0; }
.presentation-page #titles .st-palette input { width:80px; margin-left:4px; }
.presentation-page #titles [hidden] { display:none !important; }
.presentation-page #titles .character-title-preview { flex-direction:column; gap:2px; }
.presentation-page #titles .st-render-name { color:#fff; font:11px/16px Tahoma,Verdana,sans-serif; text-shadow:1px 1px #000; }
.presentation-page #titles .st-title-text[data-effect=wave] { background:linear-gradient(90deg,var(--st-colour) 0%,var(--st-colour2) 50%,var(--st-colour) 100%); background-size:200% 100%; background-clip:text; color:transparent; text-shadow:none; animation:st-sweep var(--st-speed) linear infinite; }
.presentation-page #titles .st-title-text[data-direction=rtl] { animation-direction:reverse; }
.presentation-page #titles .st-title-text[data-direction=middle_out] { background-image:radial-gradient(ellipse,var(--st-colour2),var(--st-colour)); animation-direction:alternate; }
.presentation-page #titles .st-title-text[data-direction=ends_in] { background-image:radial-gradient(ellipse,var(--st-colour),var(--st-colour2)); animation-direction:alternate-reverse; }
.presentation-page #titles .st-title-text[data-effect=pulse] { animation:st-pulse var(--st-speed) ease-in-out infinite; }
.presentation-page #titles .st-title-text[data-typewriter=true] { clip-path:inset(0); animation:st-type var(--st-speed) steps(20,end) infinite; }
.presentation-page #titles .st-title-text[data-typewriter=true][data-effect=wave] { animation:st-type var(--st-speed) steps(20,end) infinite,st-sweep var(--st-speed) linear infinite; }
.presentation-page #titles .st-title-text[data-typewriter=true][data-effect=pulse] { animation:st-type var(--st-speed) steps(20,end) infinite,st-pulse var(--st-speed) ease-in-out infinite; }
.presentation-page #titles .st-title-text[data-outline=true] { -webkit-text-stroke:.5px var(--st-colour2); paint-order:stroke fill; }
.presentation-page #titles [data-shake=true] { animation:st-shake calc(var(--st-speed) / 6) steps(2,end) infinite; }
.presentation-page #titles [data-float=true] { animation:st-float var(--st-speed) ease-in-out infinite; }
.presentation-page #titles .st-title-frame[data-frame-effect=glow] > img { filter:drop-shadow(0 0 4px var(--st-colour)); }
.presentation-page #titles .st-title-frame[data-frame-effect=color_glow] > img { filter:drop-shadow(0 0 5px var(--st-colour2)); }
.presentation-page #titles .st-title-frame[data-frame-effect=breathe] > img { animation:st-frame-breathe 3s ease-in-out infinite; }
.presentation-page #titles .st-title-frame[data-frame-effect=heartbeat] > img { animation:st-heartbeat 1.5s ease-in-out infinite; }
.presentation-page #titles .st-title-frame[data-frame-effect=flash] > img { animation:st-frame-flash 2s steps(1) infinite; }
@keyframes st-sweep { to { background-position:200% 0; } }
@keyframes st-pulse { 50% { color:var(--st-colour2); opacity:.6; } }
@keyframes st-type { 0% { clip-path:inset(0 100% 0 0); } 75%,100% { clip-path:inset(0); } }
@keyframes st-shake { 25% { transform:translate(1px,-1px); } 75% { transform:translate(-1px,1px); } }
@keyframes st-float { 50% { transform:translateY(-4px); } }
@keyframes st-frame-breathe { 50% { opacity:.35; } }
@keyframes st-heartbeat { 15%,40% { filter:drop-shadow(0 0 5px var(--st-colour)); } 25%,50% { filter:none; } }
@keyframes st-frame-flash { 50% { filter:brightness(1.7) drop-shadow(0 0 4px var(--st-colour)); } }
@media(prefers-reduced-motion:reduce) { .presentation-page #titles .st-window *, .presentation-page #titles .character-title-preview * { animation:none !important; } }