@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800;900&family=DM+Sans:wght@400;500;600;700;800&display=swap');
:root {
    color-scheme:dark;
    --tp-bg:#090c16;
    --tp-panel:#111725;
    --tp-line:#263043;
    --tp-muted:#94a3b9;
    --tp-text:#f2f5fc;
    --tp-cyan:#68ecdf;
    --tp-gold:#f9d67b;
    --tp-purple:#c39aff
}

* {
    box-sizing:border-box
}

body.tp-body {
    margin:0;
    background:radial-gradient(ellipse at 17% 35%,#17243b66,transparent 48%),var(--tp-bg);
    color:var(--tp-text);
    font:14px/1.5 'DM Sans',system-ui,sans-serif
}

button,input {
    font:inherit
}

button,a,input {
    touch-action:manipulation
}

button {
    cursor:pointer
}

button:disabled {
    cursor:wait;
    opacity:.5
}

button:focus-visible,a:focus-visible,summary:focus-visible {
    outline:3px solid var(--tp-cyan);
    outline-offset:4px
}

button {
    color:inherit
}

a {
    color:inherit;
    text-decoration:none
}

[hidden] {
    display:none!important
}

.tp-app {
    max-width:1424px;
    padding:0 42px;
    margin:auto
}

.tp-nav {
    position:relative;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    height:78px;
    border-bottom:1px solid #ffffff0d;
    font-size:12px
}

.tp-back {
    color:#b6c0d0
}

.tp-back span {
    margin-right:9px;
    font-size:18px
}

.tp-network {
    display:flex;
    align-items:center;
    gap:14px;
    font-weight:600
}

.tp-pill {
    display:flex;
    gap:6px;
    align-items:center;
    font-size:9px;
    letter-spacing:1px;
    background:#1a2530;
    color:#91aabd;
    padding:5px 8px;
    border-radius:4px
}

.tp-pill i,.tp-live-light {
    display:inline-block;
    flex-shrink:0;
    width:6px;
    height:6px;
    background:var(--tp-cyan);
    border-radius:50%;
    box-shadow:0 0 9px #68ecdf66
}

.tp-tools {
    display:flex;
    gap:7px
}

.tp-icon-button {
    background:transparent;
    border:1px solid #2a3242;
    padding:7px 10px;
    border-radius:6px;
    font-size:11px;
    color:#afbbcd
}

.tp-icon-button:hover {
    background:#ffffff0a;
    color:#fff
}

.tp-heading {
    padding:33px 0 27px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px
}

.tp-eyebrow {
    font-size:10px;
    font-weight:700;
    letter-spacing:2px;
    color:var(--tp-muted);
    margin:0 0 8px
}

.tp-heading .tp-eyebrow {
    color:var(--tp-cyan);
    display:flex;
    gap:8px;
    align-items:center
}

.tp-heading .tp-eyebrow span {
    display:inline-block;
    width:16px;
    height:2px;
    background:var(--tp-cyan)
}

h1 {
    font-family:'Barlow Condensed',Impact,'Arial Narrow',sans-serif;
    font-weight:800;
    letter-spacing:-1.7px;
    line-height:.95;
    font-size:62px;
    margin:10px 0 12px
}

h1 em {
    font-style:normal;
    color:var(--tp-cyan)
}

.tp-title-dot {
    color:var(--tp-gold)
}

.tp-subtitle {
    font-size:12px;
    color:#909db2;
    margin:0
}

.tp-session {
    display:flex;
    align-items:flex-start;
    gap:9px;
    margin-top:15px;
    padding:12px 17px;
    border:1px solid #253244;
    border-radius:8px;
    background:#11172580
}

.tp-session>.tp-live-light {
    margin-top:6px
}

.tp-session strong {
    display:block;
    font-size:12px;
    font-weight:600
}

.tp-session small {
    display:block;
    font-size:10px;
    color:var(--tp-muted);
    margin-top:3px
}

.tp-layout {
    display:grid;
    grid-template-columns:minmax(0,1fr) 374px;
    gap:24px;
    align-items:start
}

.tp-stage {
    position:relative;
    overflow:hidden;
    border:1px solid #2e3c51;
    border-radius:13px;
    background:#0b111e;
    box-shadow:0 15px 70px #0005
}

.tp-stage-top {
    height:43px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    border-bottom:1px solid #233146;
    padding:0 21px;
    font-size:9px;
    letter-spacing:1.5px;
    color:#9aaec5;
    background:linear-gradient(90deg,#192534,#101927)
}

.tp-stage-top>span:first-child {
    display:flex;
    align-items:center;
    gap:9px
}

.tp-stage-top strong {
    font-weight:700;
    color:#e4ebf5
}

.tp-stage-top>span:last-child {
    font-size:8px;
    color:#71b7b1;
    letter-spacing:1.3px
}

.tp-canvas-wrap {
    position:relative;
    background:radial-gradient(ellipse at center,#1b3249 0,#080e18 80%);
    padding:0 9px
}

.tp-canvas-wrap canvas {
    display:block;
    width:100%;
    height:auto;
    aspect-ratio:840/920;
    max-height:750px;
    object-fit:contain
}

.tp-stage-bottom {
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:14px 20px;
    border-top:1px solid #253144;
    background:#111a29;
    gap:12px
}

.tp-stage-bottom>span:first-child {
    display:flex;
    align-items:center;
    gap:8px;
    font-size:10px;
    color:#b4bdd0
}

.tp-stage-bottom>span:first-child strong {
    color:#e2cdfc
}

.tp-stage-bottom>span:last-child {
    font-size:7px;
    letter-spacing:1.3px;
    color:#65758d
}

.tp-mystery-dot {
    display:grid;
    place-items:center;
    width:26px;
    height:26px;
    flex-shrink:0;
    border:1px solid #c898ff88;
    background:radial-gradient(circle at 30% 20%,#b474ea,#4b2a86);
    color:#f2d6ff;
    border-radius:50%;
    font-style:normal;
    font-weight:800;
    font-size:15px;
    box-shadow:0 0 12px #9b58ee25
}

.tp-stage-bottom .tp-mystery-dot {
    width:20px;
    height:20px;
    font-size:11px
}

.tp-console {
    background:linear-gradient(140deg,#151d2c,#0e1420 70%);
    border:1px solid #293447;
    border-radius:13px;
    padding:23px
}

.tp-turn-heading {
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:19px
}

.tp-turn-heading .tp-eyebrow {
    font-size:9px;
    letter-spacing:1.7px;
    margin:0
}

.tp-small-pill {
    font-size:8px;
    font-weight:800;
    letter-spacing:1px;
    background:#1d3935;
    color:#8fdfc8;
    border-radius:3px;
    padding:4px 7px
}

.tp-player {
    display:flex;
    gap:12px;
    align-items:center;
    margin-bottom:23px
}

.tp-avatar {
    display:grid;
    place-items:center;
    flex-shrink:0;
    width:43px;
    height:43px;
    background:#26394b;
    border:1px solid #3d5867;
    border-radius:11px;
    font-weight:700;
    color:#9bcec8
}

.tp-player small {
    font-size:8px;
    letter-spacing:1.5px;
    color:#8392aa
}

.tp-player h2 {
    font-size:16px;
    line-height:1.4;
    overflow-wrap:anywhere;
    margin:3px 0 0;
    max-width:240px;
    font-weight:700
}

.tp-stats {
    display:grid;
    grid-template-columns:1fr 1fr;
    background:#080e19a8;
    border:1px solid #293343;
    border-radius:8px;
    margin-bottom:23px;
    padding:16px 0
}

.tp-stats>div {
    padding:0 15px
}

.tp-stats>div+div {
    border-left:1px solid #263144
}

.tp-stats>div>span {
    display:block;
    font-size:8px;
    letter-spacing:1px;
    color:#9aa9bd
}

.tp-stats b {
    color:var(--tp-gold);
    font-size:11px
}

.tp-stats strong {
    display:block;
    font-size:36px;
    line-height:1.4;
    font-weight:700;
    font-variant-numeric:tabular-nums;
    letter-spacing:-1px
}

.tp-stats strong span {
    font-size:13px;
    color:#53637b;
    letter-spacing:0
}

.tp-stats>div:nth-child(2)>strong {
    color:var(--tp-gold)
}

.tp-stats small {
    font-size:9px;
    color:#7f8ea4
}

.tp-coin-dots {
    display:flex;
    gap:5px;
    height:16px;
    align-items:center
}

.tp-coin-dots i {
    display:block;
    height:10px;
    width:10px;
    border-radius:50%;
    border:1px solid #4b453b;
    background:#25282b
}

.tp-coin-dots i.is-earned {
    background:linear-gradient(135deg,#ffe4a1,#ad772b);
    border-color:#e9be6d;
    box-shadow:0 0 6px #f9d67b22
}

.tp-coin-dots i.is-spent {
    background:#806b43;
    opacity:.4
}

.tp-coin-dots i.is-free:not(.is-spent) {
    background:linear-gradient(135deg,#c6ffe6,#43bba9);
    border-color:#8debd2;
    box-shadow:0 0 6px #68ecdf33;
}

#tpCoinAllowance {
    display:block;
    margin-top:4px;
    font-size:8px;
}

.tp-panel {
    margin:0 0 22px
}

.tp-panel h3 {
    font-size:23px;
    line-height:1.25;
    letter-spacing:-.6px;
    margin:5px 0 10px;
    font-weight:700
}

.tp-panel>p:not(.tp-eyebrow):not(.tp-note) {
    font-size:12px;
    line-height:1.7;
    color:#a2afc1;
    margin:0 0 16px
}

.tp-panel label:not(.tp-check) {
    display:block;
    font-size:11px;
    color:#c2ccda;
    margin:18px 0 7px
}

.tp-panel input:not([type=checkbox]) {
    width:100%;
    height:46px;
    color:#fff;
    background:#090e18;
    border:1px solid #334055;
    border-radius:6px;
    padding:0 12px;
    outline:0
}

.tp-panel input:focus {
    border-color:var(--tp-cyan);
    box-shadow:0 0 0 3px #68ecdf12
}

.tp-panel input::placeholder {
    font-size:12px;
    color:#66758b
}

.tp-buyin {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
    margin:17px 0;
    padding-bottom:15px;
    border-bottom:1px solid #263144
}

.tp-buyin>span {
    font-size:10px;
    color:#8f9fb5
}

.tp-buyin strong {
    display:block;
    color:#f2d394;
    font-size:16px;
    margin-top:3px
}

.tp-buyin small {
    font-size:10px;
    font-weight:400;
    color:#98a6bb
}

.tp-machine-setting {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    font-size:10px;
    color:#8f9fb5;
    margin:-3px 0 17px;
}

.tp-machine-setting strong {
    color:var(--tp-cyan);
    font-weight:600;
}

.tp-check {
    display:flex;
    gap:9px;
    align-items:center;
    font-size:10px;
    color:#aab6c7;
    margin:0 0 18px;
    cursor:pointer
}

.tp-check input {
    width:15px;
    height:15px;
    margin:0;
    accent-color:var(--tp-cyan)
}

.tp-button {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:15px;
    width:100%;
    border-radius:6px;
    padding:14px 16px;
    min-height:46px;
    border:1px solid transparent;
    font-size:12px;
    font-weight:800;
    transition:background .2s,box-shadow .2s,transform .2s
}

.tp-button--primary {
    background:linear-gradient(110deg,#a5f5cf,#68e6d7);
    color:#0d3029;
    box-shadow:0 4px 20px #5be0c312
}

.tp-button--primary:hover:not(:disabled) {
    box-shadow:0 5px 25px #68e6d730;
    transform:translateY(-1px)
}

.tp-button--primary>span:last-child:not(:first-child) {
    margin-left:auto
}

.tp-button--secondary {
    background:#192334;
    border-color:#354459
}

.tp-note {
    font-size:9px!important;
    color:#72849d!important;
    text-align:center;
    line-height:1.6!important;
    margin:11px 0 0!important
}

.tp-mystery-card {
    display:flex;
    align-items:flex-start;
    gap:11px;
    background:linear-gradient(120deg,#2a203e88,#18172988);
    padding:14px 12px;
    border:1px solid #473052;
    border-radius:8px
}

.tp-tower-card,.tp-galaxy-win {
    display:flex;
    align-items:flex-start;
    gap:12px;
    padding:16px 13px;
    margin-bottom:12px;
    border:1px solid #5a5184;
    border-radius:9px;
    background:radial-gradient(ellipse at top left,#52408a55,transparent 65%),linear-gradient(120deg,#162b4299,#24203d99)
}

.tp-galaxy-orbit {
    display:grid;
    place-items:center;
    flex-shrink:0;
    width:31px;
    height:31px;
    margin-top:3px;
    border:1px solid #bdacfb;
    border-radius:50%;
    color:#f8e8b3;
    font-size:21px;
    background:radial-gradient(ellipse at center,#94e9ff66,#7970c933 48%,#1a274e);
    box-shadow:0 0 20px #8979fc33,inset 0 0 8px #b29ff355
}

.tp-tower-card strong { font-size:11px; color:#e4dcff }
.tp-tower-card p { font-size:10px; color:#b2b5d3; line-height:1.7; margin:5px 0 0 }
.tp-galaxy-win { border-color:#b5a5f3; margin:18px 0; box-shadow:0 0 24px #9e7ef51a }
.tp-galaxy-win strong { display:block; font-size:17px; color:#f4e5ff }
.tp-galaxy-win p { font-size:12px; line-height:1.7; margin:5px 0; color:#e1e4fa; overflow-wrap:anywhere }
.tp-galaxy-win small { font-size:10px; color:#aaadd0 }
.tp-stage-bottom>.tp-tower-status { color:#c3b6f8; font-size:8px; text-align:right }
.tp-stage-bottom>.tp-tower-status.is-collected { color:#7f899f }

.tp-mystery-card .tp-mystery-dot {
    width:28px;
    height:28px;
    margin-top:2px
}

.tp-mystery-card strong {
    font-size:10px;
    color:#e1c7f4
}

.tp-mystery-card p {
    font-size:10px;
    color:#9c8eb1;
    line-height:1.7;
    margin:4px 0 0
}

.tp-board-note {
    display:flex;
    gap:9px;
    margin-top:18px;
    color:#788ba3
}

.tp-board-note>span {
    font-size:24px;
    color:#4c6a7d;
    line-height:1.2
}

.tp-board-note p {
    font-size:10px;
    margin:0;
    line-height:1.7
}

.tp-board-note strong {
    display:block;
    font-weight:500;
    color:#a5b4c7
}

.tp-underbar {
    display:flex;
    justify-content:space-between;
    gap:25px;
    margin:22px 0;
    padding:19px 28px;
    border:1px solid #222d3d;
    border-radius:9px;
    background:#11172466
}

.tp-underbar>div {
    display:flex;
    gap:12px;
    align-items:center
}

.tp-underbar>div>span {
    font-family:'Barlow Condensed',Impact,sans-serif;
    font-size:29px;
    color:#46596c
}

.tp-underbar p {
    font-size:10px;
    color:#7f91a7;
    line-height:1.8;
    margin:0
}

.tp-underbar strong {
    display:block;
    font-size:11px;
    color:#c2cddb;
    font-weight:500
}

.tp-footer {
    display:flex;
    gap:24px;
    justify-content:space-between;
    align-items:flex-start;
    margin:0 0 30px;
    font-size:11px;
    color:#8496af
}

.tp-footer details {
    flex:1
}

.tp-footer summary {
    cursor:pointer;
    width:fit-content
}

.tp-footer summary span {
    margin-left:10px;
    font-size:9px;
    color:#5b708a
}

.tp-text-button {
    background:none;
    border:0;
    padding:0;
    color:#7b88a0;
    font-size:10px
}

.tp-text-button:hover {
    color:#ddd
}

.tp-history {
    padding-top:15px
}

.tp-history-row {
    display:flex;
    justify-content:space-between;
    border-bottom:1px solid #202a39;
    padding:8px 0;
    gap:14px
}

.tp-history-row>span {
    overflow-wrap:anywhere
}

.tp-history-row b {
    color:var(--tp-gold);
    white-space:nowrap
}

.tp-question-top {
    display:flex;
    justify-content:space-between;
    align-items:center
}

.tp-question-top p {
    margin:0;
    color:var(--tp-cyan);
    font-size:9px
}

.tp-timer {
    display:flex;
    align-items:baseline;
    gap:4px;
    color:var(--tp-cyan)
}

.tp-timer strong {
    font-size:32px;
    line-height:1;
    font-variant-numeric:tabular-nums
}

.tp-timer small {
    font-size:8px;
    letter-spacing:1px
}

.tp-timer.is-urgent {
    color:#ff7d91
}

.tp-progress {
    height:3px;
    background:#283448;
    margin:14px 0 21px;
    overflow:hidden;
    border-radius:3px
}

.tp-progress span {
    display:block;
    width:100%;
    height:100%;
    background:var(--tp-cyan);
    transform-origin:left
}

.tp-question {
    font-size:23px!important;
    line-height:1.4!important;
    margin-bottom:10px!important
}

.tp-answer-hint {
    font-size:10px!important
}

.tp-answers {
    display:grid;
    gap:8px
}

.tp-answer {
    display:flex;
    align-items:center;
    gap:10px;
    background:#101a29;
    border:1px solid #354258;
    border-radius:6px;
    text-align:left;
    padding:12px;
    font-size:12px;
    min-height:49px
}

.tp-answer:hover:not(:disabled) {
    background:#1b3a3c;
    border-color:#68ecdf
}

.tp-answer span {
    display:grid;
    place-items:center;
    width:23px;
    height:23px;
    border:1px solid #3c4e65;
    border-radius:4px;
    color:#9eafc4;
    font-size:10px;
    flex-shrink:0
}

.tp-feedback-icon {
    display:grid;
    place-items:center;
    width:50px;
    height:50px;
    border:1px solid #588e75;
    border-radius:50%;
    background:#214c3b;
    color:#b7f5bc;
    font-size:28px;
    margin:0 0 15px
}

.tp-feedback-icon.is-miss {
    background:#402330;
    color:#efa3b7;
    border-color:#8a4e65
}

.tp-lanes {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:8px;
    margin:21px 0 14px
}

.tp-lanes button {
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    border:1px solid #34465b;
    border-radius:7px;
    height:66px;
    font-weight:700;
    background:#0b1422;
    font-size:23px;
    color:#8a9cb1
}

.tp-lanes button small {
    font-size:7px;
    font-weight:500;
    letter-spacing:1.5px;
    margin-bottom:3px
}

.tp-lanes button[aria-pressed=true] {
    color:var(--tp-cyan);
    background:#16342f;
    border-color:#64dcc0;
    box-shadow:inset 0 0 20px #68ecdf0b
}

.tp-drop-button {
    font-size:14px;
    padding:16px
}

.tp-drop-button>span:last-child {
    margin-left:0!important
}

.tp-drop-coin {
    display:grid;
    place-items:center;
    width:25px;
    height:25px;
    border:2px solid #246556;
    border-radius:50%;
    font-size:19px;
    line-height:1
}

.tp-panel--bonus {
    text-align:center
}

.tp-panel--bonus .tp-eyebrow {
    color:var(--tp-purple)
}

.tp-bonus-coin {
    display:grid;
    place-items:center;
    width:62px;
    height:62px;
    background:radial-gradient(circle at 30% 25%,#d5adff,#5b2590);
    border:3px double #e3b6ff;
    border-radius:50%;
    margin:0 auto 18px;
    font-size:37px;
    font-weight:800;
    box-shadow:0 0 38px #b271ef33
}

.tp-bonus-choices {
    display:flex;
    justify-content:center;
    gap:26px;
    margin:23px 0
}

.tp-bonus-choices button {
    width:82px;
    height:82px;
    font-size:44px;
    border-radius:50%;
    border:5px double #c897f0;
    background:radial-gradient(circle at 35% 25%,#b078d8,#361853);
    box-shadow:0 6px 0 #291237,0 10px 20px #0004;
    color:#eed7ff;
    font-weight:800;
    transition:transform .2s,box-shadow .2s
}

.tp-bonus-choices button:hover:not(:disabled) {
    transform:translateY(-4px);
    box-shadow:0 10px 0 #291237,0 10px 30px #a75bea55
}

.tp-result-prize {
    padding:16px 0 21px
}

.tp-result-prize>span {
    font-size:34px;
    color:var(--tp-gold)
}

.tp-result-prize strong {
    font-size:57px;
    letter-spacing:-2px;
    line-height:1.2;
    color:var(--tp-gold);
    overflow-wrap:anywhere
}

.tp-result-prize small {
    display:block;
    font-size:8px;
    color:#a89777;
    letter-spacing:2px;
    margin-top:7px
}

.tp-error {
    padding:12px;
    background:#432735;
    color:#ffcede;
    border:1px solid #92556c;
    border-radius:6px;
    font-size:11px;
    margin:0 0 15px
}

.tp-error button {
    background:none;
    border:0;
    text-decoration:underline;
    display:block;
    font-size:11px;
    padding:8px 0 0
}

.tp-dialog {
    border:1px solid #3a4d66;
    background:#141e2e;
    color:var(--tp-text);
    border-radius:13px;
    max-width:470px;
    padding:28px;
    width:calc(100% - 32px);
    box-shadow:0 20px 100px #0009
}

.tp-dialog::backdrop {
    background:#020611c9;
    backdrop-filter:blur(7px)
}

.tp-dialog h2 {
    font-size:27px;
    margin:8px 0
}

.tp-dialog p:not(.tp-eyebrow) {
    color:#a6b6ca;
    font-size:13px;
    line-height:1.7
}

.tp-dialog form>div {
    display:flex;
    gap:10px;
    margin-top:22px
}

.tp-dialog .tp-button {
    font-size:10px;
    padding:12px 10px
}

.tp-sr-only {
    position:absolute;
    width:1px;
    height:1px;
    padding:0;
    margin:-1px;
    overflow:hidden;
    clip:rect(0,0,0,0);
    white-space:nowrap;
    border:0
}

.tp-gate {
    max-width:600px;
    margin:20vh auto;
    padding:30px
}

.tp-gate h1 {
    font-size:48px;
    line-height:1.05
}

.tp-gate>p {
    color:#a3b3c9;
    margin-bottom:25px
}

.tp-gate .tp-button {
    width:fit-content
}

@media(min-width:1500px) {
    .tp-app {
        max-width:1464px
    }
    .tp-layout {
        grid-template-columns:minmax(0,1fr) 396px;
        gap:30px
    }
    .tp-console {
        padding:27px
    }
    .tp-canvas-wrap canvas {
        max-height:800px
    }
}

@media(max-width:1100px) {
    .tp-app {
        padding:0 24px
    }
    .tp-layout {
        grid-template-columns:minmax(0,1fr) 340px;
        gap:18px
    }
    .tp-console {
        padding:18px
    }
    .tp-network {
        font-size:11px;
        gap:8px
    }
    .tp-stage-bottom>span:last-child {
        display:none
    }
    .tp-heading h1 {
        font-size:55px
    }
    .tp-stage-top {
        padding:0 13px
    }
    .tp-stage-top>span:last-child {
        font-size:7px;
        letter-spacing:.7px
    }
    .tp-canvas-wrap {
        padding:0
    }
    .tp-tools {
        gap:5px
    }
}

@media(max-width:800px) {
    .tp-app {
        padding:0 17px;
        max-width:620px
    }
    .tp-nav {
        height:64px;
        gap:10px
    }
    .tp-network {
        display:none
    }
    .tp-tools {
        gap:6px
    }
    .tp-icon-button {
        font-size:10px;
        padding:6px 8px
    }
    .tp-heading {
        padding:26px 0 22px;
        align-items:flex-start
    }
    .tp-heading h1 {
        font-size:49px;
        letter-spacing:-1px
    }
    .tp-heading .tp-eyebrow {
        font-size:8px;
        letter-spacing:1.7px
    }
    .tp-subtitle {
        font-size:10px
    }
    .tp-session {
        padding:8px;
        margin-top:3px;
        gap:6px;
        border:0;
        background:none
    }
    .tp-session strong {
        font-size:8px;
        white-space:nowrap
    }
    .tp-session small {
        display:none
    }
    .tp-session .tp-live-light {
        width:5px;
        height:5px;
        margin-top:4px
    }
    .tp-layout {
        grid-template-columns:1fr;
        gap:18px
    }
    .tp-canvas-wrap canvas {
        max-height:580px
    }
    .tp-console {
        padding:22px
    }
    .tp-player h2 {
        max-width:none
    }
    .tp-panel h3 {
        font-size:24px
    }
    .tp-underbar {
        padding:16px 13px;
        gap:8px;
        margin:18px 0
    }
    .tp-underbar>div {
        gap:6px;
        align-items:flex-start
    }
    .tp-underbar>div>span {
        font-size:22px
    }
    .tp-underbar p {
        font-size:8px
    }
    .tp-underbar strong {
        font-size:9px
    }
    .tp-footer {
        flex-direction:column;
        gap:20px
    }
    .tp-footer details {
        width:100%
    }
    .tp-stage-bottom {
        padding:12px 16px
    }
    .tp-stats {
        padding:15px 0
    }
    .tp-stats>div {
        padding:0 22px
    }
    .tp-question {
        font-size:24px!important
    }
}

@media(prefers-reduced-motion:reduce) {
    *,*::before,*::after {
        scroll-behavior:auto!important;
        transition:none!important;
        animation:none!important
    }
}

.tp-bonus-result {
    background:#332341;
    border:1px solid #8c61a6;
    border-radius:7px;
    padding:12px;
    margin:0 0 17px;
    color:#ead1ff;
    font-size:12px;
    line-height:1.6
}

.tp-audio-mix > summary {
    display:flex;
    align-items:center;
    cursor:pointer;
    list-style:none;
}

.tp-audio-mix > summary::-webkit-details-marker {
    display:none;
}

.tp-audio-mix[open] > summary {
    color:var(--tp-cyan);
    border-color:#4a9189;
}

.tp-audio-panel {
    position:absolute;
    z-index:10;
    right:0;
    top:calc(100% - 4px);
    width:292px;
    max-width:100%;
    padding:18px;
    border:1px solid #36516a;
    border-radius:9px;
    background:#152032;
    box-shadow:0 12px 45px #0009;
}

.tp-audio-panel > strong {
    font-size:13px;
}

.tp-audio-panel p {
    font-size:11px;
    line-height:1.6;
    color:#a7b8cc;
    margin:8px 0 14px;
}

.tp-audio-panel label {
    display:flex;
    justify-content:space-between;
    gap:12px;
    font-size:11px;
    margin:14px 0 7px;
}

.tp-audio-panel output {
    color:var(--tp-cyan);
    font-variant-numeric:tabular-nums;
}

.tp-audio-panel input {
    display:block;
    width:100%;
    margin:0;
    accent-color:var(--tp-cyan);
    cursor:pointer;
}

.tp-audio-panel #tpAudioStatus {
    font-size:10px;
    margin:15px 0 0;
    color:#83b4ac;
}

@media(max-width:800px) {
    .tp-nav {
        flex-wrap:wrap;
        justify-content:space-between;
        height:auto;
        min-height:64px;
        padding:14px 0;
    }

    .tp-tools {
        margin-left:auto;
    }
}