/* Tunnista luku 2.0: scoped to its own Academy external-game screen.
 * Deliberately no html/body, Archive projector, shared navigation or scroll locks.
 */
#ukf-maka-view[data-screen="games"] .ukf-maka-game-library:has([data-maka-external-game="tunnista-luku"]){grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:760px){#ukf-maka-view[data-screen="games"] .ukf-maka-game-library:has([data-maka-external-game="tunnista-luku"]){grid-template-columns:1fr}}
.ukf-tl-app{--tl-bg:#101123;--tl-card:#1d1b35;--tl-border:rgba(189,165,241,.27);--tl-muted:#c0bad0;--tl-accent:#a62fe5;position:relative;width:100%;min-width:0;color:#fff;font-family:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;box-sizing:border-box}
.ukf-tl-app *, .ukf-tl-app *::before,.ukf-tl-app *::after{box-sizing:border-box}
.ukf-tl-app [hidden]{display:none!important}
.ukf-tl-app button{font-family:inherit;color:#fff;cursor:pointer;line-height:1.25}
.ukf-tl-app button:disabled{opacity:.6;cursor:wait}
.ukf-tl-app .tl-screen{width:100%;min-width:0}
.ukf-tl-app .tl-panel{border:1px solid var(--tl-border);border-radius:26px;background:linear-gradient(137deg,rgba(37,31,63,.97),rgba(16,18,38,.98));padding:32px}
.ukf-tl-app .tl-hero{position:relative;overflow:hidden;display:flex;gap:20px;align-items:center;padding:30px 38px;border:1px solid var(--tl-border);border-radius:26px;background:linear-gradient(110deg,#1f1d39,#0f1124);margin-bottom:24px}
.ukf-tl-app .tl-hero::after{content:'';position:absolute;right:-2%;top:-50%;width:180px;height:150px;background:radial-gradient(circle,rgba(135,53,228,.32),transparent 68%);pointer-events:none}
.ukf-tl-app .tl-icon{display:grid;place-items:center;width:80px;height:80px;flex:0 0 80px;border-radius:22px;background:linear-gradient(145deg,#a242ec,#ce2bb4);font-size:40px}
.ukf-tl-app h2,.ukf-tl-app h3,.ukf-tl-app p{margin:0}
.ukf-tl-app .tl-hero h2{font-size:clamp(26px,3.2vw,44px);font-weight:800;line-height:1.14}
.ukf-tl-app .tl-hero p,.ukf-tl-app .tl-panel>p{margin-top:7px;color:var(--tl-muted);font-size:clamp(14px,1.5vw,18px);line-height:1.46}
.ukf-tl-app .tl-dashboard{display:grid;grid-template-columns:minmax(240px,.38fr) minmax(0,1fr);gap:26px}
.ukf-tl-app .tl-side{display:flex;flex-direction:column;gap:18px}
.ukf-tl-app .tl-side-card{display:grid;grid-template-columns:55px minmax(0,1fr);grid-template-rows:auto auto;column-gap:10px;text-align:left;align-content:center;min-height:146px;border:1px solid var(--tl-border);border-radius:22px;padding:22px;background:linear-gradient(130deg,#20203a,#141528)}
.ukf-tl-app .tl-side-card>span{grid-row:span 2;align-self:center;font-size:34px}
.ukf-tl-app .tl-side-card strong{font-size:19px}
.ukf-tl-app .tl-side-card small{color:var(--tl-muted);font-size:13px}
.ukf-tl-app .tl-part-panel{padding:27px}
.ukf-tl-app .tl-kicker{display:block;margin-bottom:7px;color:#d9b8fb;font-size:12px;font-weight:850;letter-spacing:.13em}
.ukf-tl-app .tl-panel h3{font-size:clamp(23px,2.2vw,31px)}
.ukf-tl-app .tl-part-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-top:24px}
.ukf-tl-app .tl-part{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;min-width:0;min-height:138px;border:1px solid var(--tl-border);border-radius:20px;background:rgba(255,255,255,.045);padding:12px 8px;text-align:center}
.ukf-tl-app .tl-part>span{font-size:29px}
.ukf-tl-app .tl-part strong{font-size:15px}
.ukf-tl-app .tl-part small{font-size:11px;line-height:1.28;color:#cbc3d7;overflow-wrap:anywhere}
.ukf-tl-app .tl-part.is-selected{border:2px solid #a63feb;background:rgba(140,49,209,.17)}
.ukf-tl-app .tl-part.is-selected::after{content:'';position:absolute;top:10px;right:10px;width:10px;height:10px;border-radius:50%;background:#ae4bf7;box-shadow:0 0 13px #ae4bf7}
.ukf-tl-app .tl-center-actions{display:flex;justify-content:center;margin-top:20px}
.ukf-tl-app .tl-primary,.ukf-tl-app .tl-secondary{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:11px 22px;border-radius:999px;border:1px solid rgba(210,176,252,.37);font-size:16px;font-weight:750;white-space:normal;text-align:center}
.ukf-tl-app .tl-primary{border-color:transparent;background:linear-gradient(105deg,#8328dc,#cc2cb0);box-shadow:0 13px 22px rgba(110,35,200,.15)}
.ukf-tl-app .tl-secondary{background:rgba(255,255,255,.048)}
.ukf-tl-app .tl-wide{display:flex;width:100%;margin-top:22px}
.ukf-tl-app .tl-level-panel{width:min(1400px,100%);margin:0 auto;text-align:center;padding:40px}
.ukf-tl-app .tl-level-panel>h2{font-size:clamp(29px,4vw,52px)}
.ukf-tl-app .tl-level-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:30px}
.ukf-tl-app .tl-level{display:flex;flex-direction:column;text-align:left;align-items:stretch;gap:16px;border:1px solid var(--tl-border);border-radius:23px;background:rgba(255,255,255,.04);padding:25px;min-height:245px}
.ukf-tl-app .tl-level>strong{font-size:24px}
.ukf-tl-app .tl-tags{display:flex;flex-wrap:wrap;gap:7px}
.ukf-tl-app .tl-tags small{display:block;border-radius:999px;background:rgba(255,255,255,.075);padding:6px 9px;font-size:13px;color:var(--tl-muted);line-height:1.3}
.ukf-tl-app .tl-coin-note{color:#f2d3ff;font-size:14px;font-weight:800;margin-top:auto}
.ukf-tl-app .tl-intro{width:min(900px,100%);margin:0 auto;padding:40px 45px;text-align:center}
.ukf-tl-app .tl-intro-book{display:block;font-size:46px;margin-bottom:14px}
.ukf-tl-app .tl-intro h2{font-size:clamp(30px,4vw,48px)}
.ukf-tl-app .tl-intro>p{line-height:1.5;font-size:clamp(14px,1.7vw,18px);margin:12px auto 20px;max-width:720px}
.ukf-tl-app .tl-selected{padding:12px;border-radius:14px;background:rgba(132,59,201,.12);border:1px solid rgba(191,115,239,.3);color:#ddc5f2}
.ukf-tl-app .tl-rule-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;width:min(680px,100%);margin:24px auto}
.ukf-tl-app .tl-rule-grid>div{display:flex;align-items:center;gap:13px;border:1px solid rgba(191,167,227,.25);border-radius:15px;padding:14px 17px;background:rgba(255,255,255,.045);text-align:left;color:#e7e3ef;font-size:15px}
.ukf-tl-app .tl-rule-grid>div>span:first-child{font-size:21px}
.ukf-tl-app .tl-status{min-height:0;color:#ffc2c7}
.ukf-tl-app .tl-intro-actions{display:flex;justify-content:center;gap:12px;width:min(620px,100%);margin:16px auto 0}
.ukf-tl-app .tl-intro-actions>*{flex:1 1 0;min-width:0}
/* Active game: same HUD -> progress -> question hierarchy as Puuttuva sana.
   No global overflow changes. Excerpts are selected within a short length range. */
.ukf-tl-app .tl-play-screen{position:relative;display:flex;flex-direction:column;gap:10px;max-height:calc(100dvh - 96px);min-height:0}
.ukf-tl-app .tl-report-trigger{position:absolute;top:-61px;left:50%;transform:translateX(-50%);z-index:15;width:min(310px,52vw);min-height:40px;border:1px solid rgba(199,164,244,.3);border-radius:999px;background:#1e1d39;color:#fff;font-size:13px;font-weight:750}
.ukf-tl-app .tl-hud{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.ukf-tl-app .tl-hud>div{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:66px;padding:8px 4px;border:1px solid var(--tl-border);border-radius:21px;background:rgba(26,26,49,.9);text-align:center}
.ukf-tl-app .tl-hud small{font-size:13px;color:var(--tl-muted)}
.ukf-tl-app .tl-hud strong{font-size:27px;color:white;line-height:1.15}
.ukf-tl-app .tl-progress{height:10px;min-height:10px;border-radius:999px;background:rgba(210,206,240,.11);overflow:hidden}
.ukf-tl-app .tl-progress>span{display:block;height:100%;width:0;background:linear-gradient(90deg,#982deb,#d12db2);border-radius:inherit;transition:width .22s ease}
.ukf-tl-app .tl-question{display:flex;flex-direction:column;justify-content:center;gap:20px;flex:0 1 auto;min-height:0;border:1px solid rgba(203,156,255,.43);border-radius:30px;background:radial-gradient(circle at 92% 0,rgba(109,44,173,.23),transparent 40%),linear-gradient(150deg,#1b1a32,#101225);padding:clamp(15px,2.7vw,35px)}
.ukf-tl-app .tl-excerpt{margin:0;padding:18px 20px;border:1px solid rgba(178,132,225,.58);border-left:4px solid #7839e0;border-radius:19px;background:#15182a;color:#fff;text-align:center;font-size:clamp(19px,1.33vw,22px);font-style:normal;font-weight:500;line-height:1.40;overflow-wrap:anywhere}
.ukf-tl-app .tl-answers{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.ukf-tl-app .tl-choice{display:flex;align-items:center;gap:14px;min-width:0;min-height:92px;text-align:left;background:rgba(255,255,255,.045);border:1px solid rgba(197,175,235,.23);border-radius:22px;padding:13px 18px}
.ukf-tl-app .tl-choice:hover,.ukf-tl-app .tl-choice:focus-visible{border-color:#a665f0;background:rgba(125,57,197,.12)}
.ukf-tl-app .tl-choice-letter{display:grid;place-items:center;flex:0 0 51px;width:51px;height:51px;border-radius:16px;background:#402a6d;color:#fff;font-size:23px;font-weight:800}
.ukf-tl-app .tl-choice-label{display:flex;flex-direction:column;gap:4px;min-width:0}
.ukf-tl-app .tl-choice-label strong{font-size:clamp(14px,1.25vw,19px);line-height:1.26;overflow-wrap:anywhere}
.ukf-tl-app .tl-choice-label small{font-size:clamp(12px,1.13vw,15px);line-height:1.25;color:#ccc3dc}
.ukf-tl-app .tl-feedback{text-align:center;border-top:1px solid rgba(204,184,243,.2);padding-top:14px}
.ukf-tl-app .tl-feedback>strong{font-size:clamp(21px,2.6vw,29px)}
.ukf-tl-app .tl-feedback .tl-ok{color:#40dfa4}
.ukf-tl-app .tl-feedback .tl-wrong{color:#ff738d}
.ukf-tl-app .tl-feedback p{margin:10px auto 16px;color:#ccc3d9;font-size:clamp(13px,1.3vw,17px);line-height:1.45}
.ukf-tl-app .tl-feedback-actions{display:flex;justify-content:center;gap:10px}
.ukf-tl-app .tl-feedback-actions>*{min-width:140px;min-height:44px}
.ukf-tl-app .tl-network{text-align:center;padding:14px}.ukf-tl-app .tl-network p{margin-bottom:15px;color:#ffc3ce}
/* Reader only: ONE scroll surface (the Academy viewport). The host controls float independently. */
.ukf-tl-app .tl-reader-screen{height:auto;min-height:calc(100dvh - 90px);overflow:visible}
.ukf-tl-app .tl-reader{display:flex;flex-direction:column;position:relative;overflow:visible;height:auto;min-height:calc(100dvh - 90px);border:0;border-radius:0;background:transparent}
.ukf-tl-app .tl-reader-loading,.ukf-tl-app .tl-reader-error{display:grid;place-items:center;position:absolute;inset:0;text-align:center;font-size:17px;font-weight:700;padding:22px;background:#0b1222}
.ukf-tl-app .tl-reader-error{color:#ff7c92}
.ukf-tl-app .tl-reader-scroll{position:relative;overflow:visible;height:auto;padding:clamp(20px,5vw,60px) clamp(18px,6vw,85px);color:#f2effd;font-family:Georgia,'Times New Roman',serif}

.ukf-tl-app .tl-book-heading{text-align:center;margin-bottom:34px}.ukf-tl-app .tl-book-heading>span{font:800 12px system-ui,sans-serif;letter-spacing:.15em;color:#d6b9fc}
.ukf-tl-app .tl-book-heading h2{font-size:clamp(28px,4vw,44px);line-height:1.22;margin:15px auto;color:#fff}
.ukf-tl-app .tl-book-section{margin-bottom:32px}.ukf-tl-app .tl-book-section h3{font-size:clamp(23px,3vw,32px);margin-bottom:22px;color:#fff}
.ukf-tl-app .tl-book-paragraph{font-size:clamp(16px,1.9vw,21px);line-height:1.72;margin:0 0 18px;overflow-wrap:anywhere}
.ukf-tl-app .tl-book-paragraph.is-target{background:rgba(123,50,206,.15);border-radius:12px;padding:8px;margin-left:-8px;border-left:3px solid #a653ee}
.ukf-tl-app .tl-book-ref{display:inline-block;vertical-align:baseline;font:800 12px system-ui,sans-serif;background:linear-gradient(110deg,#7830de,#ae36e5);color:#fff;padding:4px 8px;border-radius:8px;margin-right:8px}
.ukf-tl-app .tl-book-text p{display:inline}.ukf-tl-app .tl-book-text a{color:#d8b8ff}
/* Leaderboard, results and overlays */
.ukf-tl-app .tl-center{text-align:center;max-width:800px;margin:auto}
/* Result: the same layout hierarchy as the Academy / Puuttuva sana result view. */
.ukf-tl-app .tl-end-screen{display:flex;flex-direction:column;gap:10px;width:min(920px,100%);margin:0 auto}
.ukf-tl-app .tl-end-card{border:1px solid var(--tl-border);border-radius:25px;background:radial-gradient(circle at 48% 0,rgba(143,55,178,.24),transparent 80%),linear-gradient(145deg,#231831,#15162a);text-align:center;padding:clamp(18px,3.1vw,38px)}
.ukf-tl-app .tl-end-kicker{display:block;font-size:12px;letter-spacing:.14em;color:#d7baf3;font-weight:850;margin-bottom:8px}
.ukf-tl-app .tl-end-card h2{font-size:clamp(27px,3.2vw,42px);line-height:1.12;margin:0 0 18px}
.ukf-tl-app .tl-end-score{border:1px solid rgba(191,166,239,.25);border-radius:19px;padding:clamp(14px,2.1vw,23px) 12px;background:rgba(107,62,147,.13)}
.ukf-tl-app .tl-end-score>strong{display:block;font-size:clamp(38px,5.4vw,68px);line-height:1.08;font-weight:850}
.ukf-tl-app .tl-end-score>p{font-size:clamp(14px,1.6vw,19px);font-weight:750;margin:5px 0 0;color:#dcc1ec}
.ukf-tl-app .tl-result-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:17px auto;width:min(640px,100%)}
.ukf-tl-app .tl-result-grid>div{padding:12px 8px;border-radius:13px;background:rgba(255,255,255,.045);min-width:0}
.ukf-tl-app .tl-result-grid small{display:block;color:var(--tl-muted);font-size:12px}
.ukf-tl-app .tl-result-grid strong{font-size:21px;display:block;margin-top:3px}
.ukf-tl-app .tl-save-status{color:#4cdeae;font-weight:750;font-size:14px;margin-top:15px}
.ukf-tl-app .tl-end-coins{color:#ebd5ff;font-size:13px;font-weight:750}
.ukf-tl-app .tl-end-actions{width:min(640px,100%);margin:0 auto;display:grid;gap:8px}
.ukf-tl-app .tl-end-actions>button,.ukf-tl-app .tl-end-share-button{width:100%;min-height:49px}
.ukf-tl-app .tl-end-share{display:grid;gap:5px;margin-bottom:8px}
.ukf-tl-app .tl-end-share small{color:#cfc6dd;text-align:center}
.ukf-tl-app .tl-end-share small:not(:empty){padding:3px 5px}
.ukf-tl-app .tl-overlay{position:fixed;inset:0;z-index:110000;display:flex;align-items:center;justify-content:center;padding:78px 16px 12px;background:rgba(4,6,18,.78);backdrop-filter:blur(7px)}
.ukf-tl-app .tl-dialog{position:relative;display:flex;flex-direction:column;gap:16px;width:min(550px,100%);max-height:calc(100dvh - 102px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:#7851aa #171428;border:1px solid #645087;border-radius:23px;background:linear-gradient(135deg,#27213f,#13162a);box-shadow:0 24px 65px rgba(0,0,0,.45);padding:30px;color:#fff}
.ukf-tl-app .tl-dialog h2{font-size:24px}.ukf-tl-app .tl-dialog p{color:#ccc4d8}
.ukf-tl-app .tl-dialog-actions{display:flex;gap:10px}.ukf-tl-app .tl-dialog-actions>*{flex:1 1 0;min-width:0}
.ukf-tl-app .tl-dialog-close{position:absolute;right:12px;top:12px;width:38px;height:38px;display:grid;place-items:center;border:1px solid var(--tl-border);border-radius:50%;background:#211c36;color:#fff;font-size:28px}
.ukf-tl-app .tl-dialog label{display:grid;gap:7px;font-size:13px;font-weight:700;text-align:left}
.ukf-tl-app .tl-dialog select,.ukf-tl-app .tl-dialog textarea{width:100%;border:1px solid var(--tl-border);border-radius:12px;background:#101224;color:#fff;padding:12px;font:inherit}
@media(max-width:1100px){.ukf-tl-app .tl-part-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){
 .ukf-tl-app .tl-dashboard{grid-template-columns:minmax(0,1fr);gap:14px}
 .ukf-tl-app .tl-side{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .ukf-tl-app .tl-side-card{min-height:105px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;padding:12px}
 .ukf-tl-app .tl-side-card>span{font-size:26px}.ukf-tl-app .tl-side-card small{display:none}
 .ukf-tl-app .tl-hero{padding:19px 18px;gap:15px}.ukf-tl-app .tl-icon{width:60px;height:60px;flex-basis:60px;font-size:29px}
 .ukf-tl-app .tl-part-panel,.ukf-tl-app .tl-level-panel{padding:22px 18px}
 .ukf-tl-app .tl-part-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 .ukf-tl-app .tl-part{min-height:100px}.ukf-tl-app .tl-part small{font-size:10px}
 .ukf-tl-app .tl-level-grid{grid-template-columns:1fr;gap:10px;margin-top:18px}
 .ukf-tl-app .tl-level{min-height:0;padding:18px;gap:12px}
 .ukf-tl-app .tl-intro{padding:24px 16px}
 .ukf-tl-app .tl-rule-grid{gap:7px;margin:16px auto}
 .ukf-tl-app .tl-rule-grid>div{padding:11px 9px;font-size:12px;gap:6px}
 .ukf-tl-app .tl-rule-grid>div>span:first-child{font-size:17px}
 .ukf-tl-app .tl-intro-actions{gap:7px;margin-top:8px}
 .ukf-tl-app .tl-intro-actions>*{min-height:43px;padding:9px 6px;font-size:12px}
 .ukf-tl-app .tl-play-screen{gap:7px;max-height:calc(100dvh - 94px)}
 .ukf-tl-app .tl-report-trigger{top:-61px;width:min(235px,54vw);min-height:39px;font-size:12px}
 .ukf-tl-app .tl-hud{gap:6px}.ukf-tl-app .tl-hud>div{min-height:50px;padding:5px 2px;border-radius:12px}
 .ukf-tl-app .tl-hud small{font-size:10px}.ukf-tl-app .tl-hud strong{font-size:18px}
 .ukf-tl-app .tl-progress{height:6px;min-height:6px}
 .ukf-tl-app .tl-question{gap:11px;border-radius:22px;padding:13px 11px}
 .ukf-tl-app .tl-excerpt{font-size:clamp(14px,3.9vw,16px);padding:11px 9px;line-height:1.35;border-radius:16px}
 .ukf-tl-app .tl-answers{grid-template-columns:1fr;gap:7px}
 .ukf-tl-app .tl-choice{min-height:50px;border-radius:15px;gap:9px;padding:7px 9px}
 .ukf-tl-app .tl-choice-letter{width:32px;height:32px;flex-basis:32px;font-size:16px;border-radius:10px}
 .ukf-tl-app .tl-choice-label{gap:2px}.ukf-tl-app .tl-choice-label strong{font-size:clamp(11px,3.5vw,14px)}
 .ukf-tl-app .tl-choice-label small{font-size:clamp(10px,3.0vw,12px)}
 .ukf-tl-app .tl-feedback p{font-size:13px;margin:7px 0 12px}
 .ukf-tl-app .tl-feedback-actions{flex-direction:row;gap:8px}.ukf-tl-app .tl-feedback-actions>*{min-width:0;flex:1 1 0;min-height:42px;font-size:13px;padding:8px 10px}
 .ukf-tl-app .tl-reader-screen{height:auto;min-height:calc(100dvh - 72px)}
 .ukf-tl-app .tl-reader-scroll{padding:25px 16px}
 .ukf-tl-app .tl-result-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
 .ukf-tl-app .tl-end-card{padding:14px 12px}.ukf-tl-app .tl-end-card h2{margin-bottom:12px}
 .ukf-tl-app .tl-result-grid>div{padding:8px 4px}.ukf-tl-app .tl-result-grid small{font-size:10px}.ukf-tl-app .tl-result-grid strong{font-size:17px}
 .ukf-tl-app .tl-dialog{padding:24px 18px}
}
@media(max-width:370px){
 .ukf-tl-app .tl-panel{border-radius:21px}.ukf-tl-app .tl-intro{padding:14px 10px}
 .ukf-tl-app .tl-intro-book{font-size:35px;margin-bottom:6px}
 .ukf-tl-app .tl-intro h2{font-size:28px}
 .ukf-tl-app .tl-intro>p{margin:7px auto 11px;font-size:12px;line-height:1.36}
 .ukf-tl-app .tl-selected{padding:9px;font-size:12px}
 .ukf-tl-app .tl-rule-grid{margin:12px auto}
 .ukf-tl-app .tl-choice{min-height:47px;padding:6px 7px}
 .ukf-tl-app .tl-excerpt{font-size:14px;padding:8px;line-height:1.32}
 .ukf-tl-app .tl-question{gap:8px;padding:10px 9px}
 .ukf-tl-app .tl-hud>div{min-height:46px}
}
@media(max-height:600px){
 .ukf-tl-app .tl-play-screen{gap:5px}
 .ukf-tl-app .tl-question{padding:9px;gap:6px}
 .ukf-tl-app .tl-hud>div{min-height:44px}
 .ukf-tl-app .tl-excerpt{font-size:13px;line-height:1.30;padding:7px}
 .ukf-tl-app .tl-choice{min-height:43px;padding:5px 8px}
 .ukf-tl-app .tl-answers{gap:6px}
 .ukf-tl-app .tl-intro-book{font-size:29px;margin-bottom:4px}
 .ukf-tl-app .tl-intro>p{font-size:12px;margin:7px auto}
 .ukf-tl-app .tl-rule-grid{margin:9px auto}
}

@media(max-width:370px){.ukf-tl-app .tl-end-screen{gap:6px}.ukf-tl-app .tl-end-card{padding:10px 9px}.ukf-tl-app .tl-end-kicker{font-size:10px;margin-bottom:4px}.ukf-tl-app .tl-end-card h2{font-size:27px;margin-bottom:8px}.ukf-tl-app .tl-end-score{padding:10px 6px}.ukf-tl-app .tl-end-score>strong{font-size:36px}.ukf-tl-app .tl-end-score>p{font-size:12px}.ukf-tl-app .tl-result-grid{gap:4px;margin:9px auto}.ukf-tl-app .tl-result-grid>div{padding:6px 3px}.ukf-tl-app .tl-save-status{margin-top:6px;font-size:12px}.ukf-tl-app .tl-end-actions{gap:5px}.ukf-tl-app .tl-end-actions>button,.ukf-tl-app .tl-end-share-button{min-height:39px;font-size:13px}.ukf-tl-app .tl-end-share{margin-bottom:3px}}
/* Fit the end-of-game action loop in the existing Academy viewport. */
@media (min-width:761px){
 .ukf-tl-app .tl-end-card{padding:18px 26px}
 .ukf-tl-app .tl-end-card h2{font-size:35px;margin-bottom:10px}
 .ukf-tl-app .tl-end-score{padding:12px}
 .ukf-tl-app .tl-end-score>strong{font-size:52px}
 .ukf-tl-app .tl-result-grid{margin:11px auto;gap:6px}
 .ukf-tl-app .tl-result-grid>div{padding:8px 6px}
 .ukf-tl-app .tl-result-grid strong{font-size:19px}
 .ukf-tl-app .tl-save-status{margin-top:8px}
 .ukf-tl-app .tl-end-actions{gap:6px}
 .ukf-tl-app .tl-end-actions>button,.ukf-tl-app .tl-end-share-button{min-height:42px}
 .ukf-tl-app .tl-end-share{margin-bottom:4px}
}
@media (max-width:760px){
 .ukf-tl-app .tl-end-screen{gap:6px}
 .ukf-tl-app .tl-end-card{padding:11px 10px}
 .ukf-tl-app .tl-end-kicker{margin-bottom:4px;font-size:10px}
 .ukf-tl-app .tl-end-card h2{font-size:29px;margin-bottom:9px}
 .ukf-tl-app .tl-end-score{padding:10px 7px}
 .ukf-tl-app .tl-end-score>strong{font-size:37px}
 .ukf-tl-app .tl-end-score>p{font-size:12px}
 .ukf-tl-app .tl-result-grid{margin:10px auto;gap:5px}
 .ukf-tl-app .tl-result-grid>div{padding:6px 4px}
 .ukf-tl-app .tl-result-grid small{font-size:10px}
 .ukf-tl-app .tl-result-grid strong{font-size:17px}
 .ukf-tl-app .tl-save-status{margin-top:7px;font-size:12px}
 .ukf-tl-app .tl-end-actions{gap:5px}
 .ukf-tl-app .tl-end-actions>button,.ukf-tl-app .tl-end-share-button{min-height:41px;font-size:13px}
 .ukf-tl-app .tl-end-share{margin-bottom:2px}
}
@media (max-width:370px){
 .ukf-tl-app .tl-end-card{padding:8px 7px}
 .ukf-tl-app .tl-end-card h2{font-size:25px;margin-bottom:6px}
 .ukf-tl-app .tl-end-score{padding:7px 6px}
 .ukf-tl-app .tl-end-score>strong{font-size:32px}
 .ukf-tl-app .tl-result-grid{margin:6px auto;gap:4px}
 .ukf-tl-app .tl-result-grid>div{padding:4px 2px}
 .ukf-tl-app .tl-result-grid strong{font-size:15px}
 .ukf-tl-app .tl-save-status{margin-top:4px}
 .ukf-tl-app .tl-end-actions>button,.ukf-tl-app .tl-end-share-button{min-height:36px;font-size:12px}
}


/* 2.0.5: Balanced excerpt typography, scoped to Tunnista luku only.
   More prominent than the answer titles, but not oversized on desktop;
   readable and compact on phones, including short-height devices. */
#ukf-ma-projector #ukf-maka-view .ukf-tl-app blockquote.tl-excerpt{
  font-family:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif !important;
  font-size:clamp(19px,1.33vw,22px) !important;
  font-style:normal !important;
  font-weight:500 !important;
  line-height:1.40 !important;
  letter-spacing:normal !important;
}
@media(max-width:760px){
  #ukf-ma-projector #ukf-maka-view .ukf-tl-app blockquote.tl-excerpt{
    font-size:clamp(14px,3.9vw,16px) !important;
    line-height:1.35 !important;
  }
}
@media(max-width:370px){
  #ukf-ma-projector #ukf-maka-view .ukf-tl-app blockquote.tl-excerpt{
    font-size:14px !important;
    line-height:1.32 !important;
  }
}
@media(max-height:600px) and (max-width:760px){
  #ukf-ma-projector #ukf-maka-view .ukf-tl-app blockquote.tl-excerpt{
    font-size:13px !important;
    line-height:1.30 !important;
  }
}
/* 2.0.6: The Academy is the only scrollport. Sticky is anchored to that
   scrollport; unlike fixed within a transformed projector/game wrapper, it
   does not drift to the end of the whole long chapter. This button remains
   wholly inside the reader screen (no DOM portals or shared controls). */
.ukf-tl-app .tl-reader-screen{display:flex;flex-direction:column}
.ukf-tl-app .tl-reader-scroll{padding-bottom:120px}
.ukf-tl-app .tl-reader-back-float{
  position:sticky;
  order:-1;
  align-self:center;
  flex:0 0 auto;
  top:calc(100dvh - 74px - env(safe-area-inset-bottom,0px));
  bottom:auto;
  left:auto;
  right:auto;
  inset-inline-start:auto;
  transform:none;
  margin:0 0 -52px;
  z-index:35;
  width:min(340px,calc(100vw - 48px));
  min-height:52px;
  padding:12px 24px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(205,169,250,.55);
  border-radius:999px;
  background:linear-gradient(110deg,#28243f,#302347);
  color:#fff;
  font-family:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  font-size:16px;
  font-weight:750;
  line-height:1.25;
  box-shadow:0 9px 34px rgba(1,0,12,.7),0 0 12px rgba(119,49,202,.2);
  cursor:pointer;
}
.ukf-tl-app .tl-reader-back-float:hover,
.ukf-tl-app .tl-reader-back-float:focus-visible{
  border-color:#c388ff;
  background:linear-gradient(110deg,#522a8c,#6b308d);
}
@media(max-width:760px){
  .ukf-tl-app .tl-reader-scroll{padding-bottom:110px}
  .ukf-tl-app .tl-reader-back-float{
    margin-bottom:-46px;
    width:min(290px,calc(100vw - 54px));
    min-height:46px;
    font-size:14px;
  }
}

/* 2.0.8 – Leaderboard: same information hierarchy as the Academy quiz.
   All styles are scoped to this external game: no shared projector, Academy
   leaderboard, navigation or overflow rules are changed. */
.ukf-tl-app .tl-board-panel{width:min(1180px,100%);max-width:none;margin:0 auto;padding:clamp(22px,3vw,42px)}
.ukf-tl-app .tl-board-head{text-align:center;margin-bottom:22px}
.ukf-tl-app .tl-board-head h2{font-size:clamp(30px,4vw,44px);line-height:1.16;margin:4px 0 7px;font-weight:800}
.ukf-tl-app .tl-board-head p{font-size:clamp(14px,1.5vw,18px);color:var(--tl-muted);line-height:1.4}
.ukf-tl-app .tl-board-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:0 0 17px}
.ukf-tl-app .tl-board-tab{min-width:0;padding:12px 9px;border:1px solid var(--tl-border);border-radius:13px;background:rgba(255,255,255,.035);font-size:15px;font-weight:750;color:#d9d0e9}
.ukf-tl-app .tl-board-tab:hover,.ukf-tl-app .tl-board-tab:focus-visible{border-color:#b378ea;background:rgba(135,52,209,.16)}
.ukf-tl-app .tl-board-tab.is-active{background:linear-gradient(120deg,rgba(135,49,214,.40),rgba(201,45,167,.20));border-color:rgba(205,138,255,.8);color:#fff}
.ukf-tl-app .tl-board-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:16px}
.ukf-tl-app .tl-board-stat{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-width:0;min-height:80px;padding:13px 8px;text-align:center;background:rgba(255,255,255,.04);border:1px solid var(--tl-border);border-radius:15px}
.ukf-tl-app .tl-board-stat small{font-size:12px;color:var(--tl-muted);line-height:1.3}
.ukf-tl-app .tl-board-stat strong{font-size:24px;line-height:1.18;font-weight:800}
.ukf-tl-app .tl-board-ranking{display:grid;gap:10px}
.ukf-tl-app .tl-board-ranking-row{display:grid;grid-template-columns:54px minmax(0,1fr) minmax(240px,auto);align-items:center;gap:12px;min-width:0;padding:16px 18px;border:1px solid var(--tl-border);border-radius:17px;background:rgba(255,255,255,.035)}
.ukf-tl-app .tl-board-medal{display:block;text-align:center;font-size:24px;font-weight:750;line-height:1.2}
.ukf-tl-app .tl-board-player{display:flex;flex-direction:column;gap:4px;min-width:0}
.ukf-tl-app .tl-board-player-name{font-size:18px;font-weight:800;line-height:1.25;overflow-wrap:anywhere}
.ukf-tl-app .tl-board-player-result{font-size:13px;color:#e7d7f7;font-weight:750;line-height:1.35}
.ukf-tl-app .tl-board-player-part{font-size:12px;color:#c6afd9;line-height:1.3;overflow-wrap:anywhere}
.ukf-tl-app .tl-board-row-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;min-width:240px}
.ukf-tl-app .tl-board-row-metric{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0;min-height:62px;padding:8px 10px;border:1px solid var(--tl-border);border-radius:13px;background:rgba(255,255,255,.04);text-align:center}
.ukf-tl-app .tl-board-row-metric small{font-size:10px;line-height:1.25;color:var(--tl-muted)}
.ukf-tl-app .tl-board-row-metric b{font-size:13px;line-height:1.35;color:#fff}
.ukf-tl-app .tl-board-empty{text-align:center;color:var(--tl-muted);padding:28px 10px}
.ukf-tl-app .tl-board-panel>.tl-wide{margin-top:20px}
@media(max-width:950px){
  .ukf-tl-app .tl-board-ranking-row{grid-template-columns:42px minmax(0,1fr);gap:9px 12px;padding:14px}
  .ukf-tl-app .tl-board-row-metrics{grid-column:1/-1;min-width:0}
}
@media(max-width:640px){
  .ukf-tl-app .tl-board-panel{padding:20px 17px}
  .ukf-tl-app .tl-board-head{text-align:left;margin-bottom:18px}
  .ukf-tl-app .tl-board-tabs{grid-template-columns:1fr;gap:8px;margin-bottom:16px}
  .ukf-tl-app .tl-board-tab{padding:10px}
  .ukf-tl-app .tl-board-stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .ukf-tl-app .tl-board-stat{min-height:64px;padding:9px 4px}
  .ukf-tl-app .tl-board-stat small{font-size:10px}
  .ukf-tl-app .tl-board-stat strong{font-size:17px}
  .ukf-tl-app .tl-board-ranking-row{grid-template-columns:34px minmax(0,1fr);padding:12px;gap:8px}
  .ukf-tl-app .tl-board-medal{font-size:22px}
  .ukf-tl-app .tl-board-player-name{font-size:15px}
  .ukf-tl-app .tl-board-player-result{font-size:12px}
  .ukf-tl-app .tl-board-player-part{font-size:11px}
  .ukf-tl-app .tl-board-row-metrics{gap:7px}
  .ukf-tl-app .tl-board-row-metric{min-height:54px;padding:7px 4px}
}
@media(max-width:350px){
  .ukf-tl-app .tl-board-panel{padding:17px 12px}
  .ukf-tl-app .tl-board-stat strong{font-size:16px}
  .ukf-tl-app .tl-board-ranking-row{padding:10px}
}