/* Train of Thought. Warm "depot" look: peach page with hills behind the header, an orange train,
   Nunito throughout, a dark trophy score box, orange step pills and soft white cards.
   Everything is scoped under .tot. */
.tot{
  container-type:inline-size;
  --tot-bg:#FDF1E8; --tot-ink:#17171B; --tot-surface:#FFFFFF; --tot-rust:#E4521B; --tot-rust2:#C93D0C; --tot-tan:#FBB58A;
  --tot-cream:#FBEEDD; --tot-yel:#F7B500; --tot-yelsoft:#FFF0C2; --tot-muted:#6E4E3A; --tot-rule:#F1E1D2; --tot-good:#1F7A45; --tot-bad:#C2321A;
  --tot-display:"Nunito","Arial Rounded MT Bold",system-ui,-apple-system,"Segoe UI",sans-serif;
  --tot-body:"Nunito",system-ui,-apple-system,"Segoe UI",sans-serif;
  position:relative; box-sizing:border-box; background:var(--tot-bg); color:var(--tot-ink);
  font-family:var(--tot-body); font-size:16px; line-height:1.45; text-align:left; -webkit-tap-highlight-color:transparent;
}
.tot *,.tot *::before,.tot *::after{box-sizing:border-box}
.tot p{margin:0}
.tot h1,.tot h2,.tot h3{margin:0;color:inherit;text-transform:none;letter-spacing:normal;font-family:var(--tot-display);font-weight:800;line-height:1.1}
.tot button,.tot input{font-family:inherit;color:inherit;margin:0;text-transform:none;letter-spacing:normal;line-height:1.2}
.tot button{cursor:pointer}
.tot :focus-visible{outline:3px solid var(--tot-rust)!important;outline-offset:2px}
.tot svg{display:block}
.tot ol,.tot ul{list-style:none!important;margin:0!important;padding:0!important}
.tot li{margin:0!important;padding-left:0;background:none}
.tot li::before,.tot li::marker{content:none!important;display:none!important}
.tot mark{background:var(--tot-yelsoft);color:var(--tot-ink);font-weight:800;padding:1px 6px;border-radius:6px}
.tot-wrap{max-width:460px;margin:0 auto;padding:20px 16px 28px;min-height:600px}
.tot-loading,.tot-mute{color:var(--tot-muted);font-weight:600}
.tot-loading{padding:40px 0;text-align:center}
.tot-error{font-weight:700;color:var(--tot-bad)}

/* Start */
.tot-splash{display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px;padding:22px 6px 10px}
.tot-icon{width:84px;height:84px}
.tot .tot-name{font-size:40px;letter-spacing:-.01em}
.tot-sub{font-family:var(--tot-display);font-weight:600;font-size:19px;line-height:1.4;max-width:30ch}
.tot-pills{display:flex;flex-direction:column;gap:10px;width:100%;max-width:240px;margin-top:6px}
.tot .tot-pill{height:52px;border-radius:999px!important;border:1px solid var(--tot-ink)!important;background:transparent!important;color:var(--tot-ink)!important;font:700 16px var(--tot-body)!important;padding:0 22px!important;box-shadow:none!important;text-decoration:none}
.tot .tot-pill.solid{background:var(--tot-ink)!important;color:#FFFFFF!important}
.tot .tot-pill:disabled{opacity:.6}
.tot-dateline{font-size:15px;margin-top:4px}
.tot-how{width:100%;max-width:320px;text-align:left;font-size:15px}
.tot-how summary{cursor:pointer;font-weight:700;text-align:center;list-style:none}
.tot-how summary::-webkit-details-marker{display:none}
.tot-howlist{display:flex;flex-direction:column;gap:8px;margin-top:10px;background:var(--tot-surface);border-radius:14px;padding:14px}
.tot-howlist div{display:flex;gap:10px}
.tot-howlist strong{width:22px;height:22px;flex:0 0 auto;border-radius:50%;background:var(--tot-ink);color:#fff;display:grid;place-items:center;font-size:12px}

/* Game */
.tot-game{display:flex;flex-direction:column;gap:14px}
.tot-head{display:flex;justify-content:space-between;align-items:center;gap:12px}
.tot-d{font-size:14px;font-weight:500;color:var(--tot-muted)}
.tot .tot-title{font-size:26px;display:flex;align-items:center;gap:8px;margin-top:2px}
.tot-icon-sm{width:32px;height:32px;flex:0 0 auto}
.tot-pts{background:var(--tot-ink);color:#fff;border-radius:14px;padding:8px 14px;text-align:right;min-width:92px}
.tot-pts small{display:block;font-size:12px;font-weight:600;opacity:.85}
.tot-pts b{display:block;font-size:30px;font-weight:800;line-height:1.05;font-variant-numeric:tabular-nums}
.tot-pts b i{font-style:normal;font-size:15px;font-weight:600;opacity:.7;margin-left:1px}
.tot-pts.pop b{animation:tot-pop .3s}
@keyframes tot-pop{50%{transform:scale(1.12)}}
.tot-card{background:var(--tot-surface);border-radius:18px;box-shadow:0 10px 30px -18px rgba(18,18,18,.35)}

/* The yard */
.tot-yardcard{overflow:hidden}
.tot-yard{position:relative;height:104px;overflow:hidden;background:linear-gradient(#FFF8EE 0 78%,#E6D3B8 78%)}
.tot-rail{position:absolute;left:0;right:0;bottom:16px;height:8px;background:repeating-linear-gradient(90deg,#9B7458 0 7px,transparent 7px 16px) 0 2px/100% 6px no-repeat,linear-gradient(var(--tot-ink),var(--tot-ink)) 0 0/100% 2px no-repeat}
.tot-train{--tot-cw:7.4;position:absolute;left:10px;bottom:22px;display:flex;align-items:flex-end}
.tot-eng{flex:0 0 auto;width:60px;height:40px}
.tot-eng svg{width:60px;height:40px;overflow:visible}
.tot-ew{transform-box:fill-box;transform-origin:center}
.tot-car{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;transition:transform 1s cubic-bezier(.2,.6,.25,1),width .5s ease}
.tot-box{width:100%;height:30px;display:grid;place-items:center;padding:0 4px;border:2.5px solid var(--tot-ink);border-radius:6px;font:800 10.5px var(--tot-body);letter-spacing:.03em;text-transform:uppercase;background:#fff;white-space:nowrap;overflow:hidden}
.tot-car.num .tot-box{font-size:13px}
.tot-car.p3 .tot-box{background:var(--tot-rust);color:#fff}
.tot-car.p2 .tot-box{background:var(--tot-tan)}
.tot-car.p1 .tot-box{background:#fff}
.tot-car.p0 .tot-box{background:#E3DACD;color:#8F826F}
.tot-car.e .tot-box{background:transparent;border-style:dashed;border-color:#BFA88E;color:#A88F74}
.tot-wheels{display:flex;justify-content:space-around;width:100%;margin-top:-1px}
.tot-wh{width:11px;height:11px;border-radius:50%;background:var(--tot-ink);position:relative}
.tot-wh::after{content:"";position:absolute;left:50%;top:2px;bottom:2px;width:2px;margin-left:-1px;background:var(--tot-yel)}
.tot-car.e .tot-wh{background:transparent;border:2px dashed #BFA88E}
.tot-car.e .tot-wh::after{display:none}
.tot-cpl{flex:0 0 auto;width:5px;height:4px;background:var(--tot-ink);margin-bottom:16px}
.tot-train.moving .tot-wh,.tot-train.moving .tot-ew{animation:tot-spin .45s linear infinite}
@keyframes tot-spin{to{transform:rotate(-360deg)}}
.tot-train.bump{animation:tot-bump .35s ease-out}
@keyframes tot-bump{30%{translate:4px 0}60%{translate:-2px 0}}
.tot-car.wobble{animation:tot-wobble .4s}
@keyframes tot-wobble{25%{transform:rotate(-5deg)}75%{transform:rotate(5deg)}}
.tot-puff{position:absolute;width:11px;height:11px;border-radius:50%;background:#fff;border:2px solid #DCCBB4;pointer-events:none;animation:tot-puff 1.3s ease-out forwards}
@keyframes tot-puff{from{opacity:.95;transform:translate(0,0) scale(.6)}to{opacity:0;transform:translate(24px,-30px) scale(2)}}
.tot-sign{position:absolute;top:8px;padding:5px 10px;background:var(--tot-ink);color:#fff;border-radius:999px;font:700 11.5px var(--tot-body);white-space:nowrap;transform:translateX(-50%);transition:left .5s,opacity .25s;opacity:0;pointer-events:none}
.tot-sign.on{opacity:1}
.tot-chain{padding:10px 14px;border-top:1px solid var(--tot-rule);font-size:13px;font-weight:600;color:var(--tot-muted);line-height:1.45;min-height:40px}
.tot-chain b{color:var(--tot-ink)}

.tot-steps{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px}
.tot-steps span{height:28px;border-radius:999px;background:var(--tot-tan);display:grid;place-items:center;font-weight:700;font-size:13px;color:var(--tot-muted)}
.tot-steps span.d{background:var(--tot-ink);color:#fff}
.tot-steps span.n{background:#fff;color:var(--tot-ink);box-shadow:inset 0 0 0 2px var(--tot-ink)}

/* Question */
.tot-q{padding:16px 18px 18px;display:flex;flex-direction:column;gap:13px}
.tot-q.shake{animation:tot-shake .3s}
@keyframes tot-shake{25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
.tot-qk{display:flex;justify-content:space-between;font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--tot-rust)}
.tot-qk span:last-child{color:var(--tot-muted)}
.tot-qt{font-size:19px;line-height:1.42;font-weight:500}
.tot-boxes{display:flex;flex-wrap:wrap;column-gap:calc(var(--bx,26px) * .9);row-gap:7px}
.tot-w{display:flex;gap:3px}

.tot-bx{width:var(--bx,26px);height:calc(var(--bx,26px) * 1.3);border:2px solid var(--tot-ink);border-radius:5px;background:#fff;display:grid;place-items:center;font:800 calc(var(--bx,26px) * .62) var(--tot-body)}
.tot-boxes.done .tot-bx{background:var(--tot-yelsoft)}
.tot-hint{display:flex;gap:10px;padding:10px 12px;background:var(--tot-yelsoft);border-radius:12px;font-size:15.5px;line-height:1.4}
.tot-hint strong{font-size:12px;font-weight:800;letter-spacing:.1em;color:#7A5A00;padding-top:2px}
.tot-lbl{display:block;font-size:14px;font-weight:600;color:var(--tot-muted);margin-bottom:6px}
.tot-row{display:flex;gap:8px}
.tot .tot-row input{flex:1;min-width:0;height:54px;padding:0 20px!important;border:2px solid var(--tot-ink)!important;border-radius:999px!important;font:500 18px var(--tot-body)!important;background:#fff!important;color:var(--tot-ink)!important;box-shadow:none!important;margin:0}
.tot .tot-row input:focus{outline:none!important;box-shadow:0 0 0 4px var(--tot-tan)!important}
.tot .tot-go{height:54px;padding:0 24px!important;border:0!important;border-radius:999px!important;background:var(--tot-ink)!important;color:#fff!important;font:700 17px var(--tot-body)!important;box-shadow:none!important}
.tot-mc{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.tot .tot-choice{min-height:50px;padding:8px 12px!important;border:1px solid var(--tot-ink)!important;border-radius:999px!important;background:#fff!important;font:700 14.5px var(--tot-body)!important;color:var(--tot-ink)!important;box-shadow:none!important}
.tot .tot-choice.right{background:var(--tot-rust)!important;color:#fff!important;border-color:var(--tot-rust)!important}
.tot .tot-choice.wrong{background:#F1ECE4!important;color:#999!important;text-decoration:line-through}
.tot .tot-choice:disabled{cursor:default}
.tot-msg{font-size:14.5px;font-weight:700}
.tot-msg:empty{display:none}
.tot-msg.bad{color:var(--tot-bad)}
.tot-msg.ok{color:var(--tot-good)}
.tot-ladder{display:flex;gap:6px}
.tot-ladder span{flex:1;text-align:center;padding:7px 0;border-radius:999px;font-size:12.5px;font-weight:700;color:var(--tot-muted);background:#F6EEE3}
.tot-ladder span.on{background:var(--tot-ink);color:#fff}

/* End */
.tot-end{padding:22px 18px;display:flex;flex-direction:column;gap:12px;align-items:center;text-align:center}
.tot-end h3{font-size:28px}
.tot-big{font-size:56px;font-weight:800;line-height:1;font-variant-numeric:tabular-nums}
.tot-big small{font-size:22px;color:var(--tot-muted);font-weight:600}
.tot-grid{display:flex;align-items:center}
.tot-grid b{width:30px;height:22px;border:2px solid var(--tot-ink);border-radius:5px;font:800 11px var(--tot-body);display:grid;place-items:center;background:#fff}
.tot-grid b.p3{background:var(--tot-rust);color:#fff}
.tot-grid b.p2{background:var(--tot-tan)}
.tot-grid b.p0{background:#E3DACD}
.tot-grid i{width:5px;height:3px;background:var(--tot-ink)}
.tot-note{font-size:15px;color:var(--tot-muted)}
.tot-note b{color:var(--tot-ink)}
.tot-endbtns{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;width:100%}
.tot-endbtns .tot-pill{height:46px;flex:1 1 120px;max-width:180px}
.tot .tot-last{font-weight:700;color:var(--tot-rust);text-decoration:underline}
.tot-board{padding:16px 18px}
.tot-bh{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:6px}
.tot-bh h3{font-size:20px}
.tot-bh span{font-size:13.5px;color:var(--tot-muted);font-weight:600}
.tot-board li{display:grid;grid-template-columns:26px minmax(0,1fr) auto auto;gap:10px;align-items:baseline;padding:9px 0;border-bottom:1px solid var(--tot-rule)}
.tot-board li:last-child{border-bottom:0}
.tot-board li.me{background:#FBF1E6;box-shadow:inset 4px 0 0 var(--tot-rust);padding-left:8px}
.tot-board .r{font-weight:800;color:var(--tot-muted)}
.tot-board .nm{font-weight:800;letter-spacing:.08em}
.tot-board .s{font-size:13px;color:var(--tot-muted);font-weight:600}
.tot-board .p{font-weight:800;font-variant-numeric:tabular-nums}
.tot-initials{background:var(--tot-yelsoft);border-radius:14px;padding:12px;margin:8px 0;display:flex;flex-direction:column;gap:8px;font-size:14.5px}
.tot .tot-initials input{text-transform:uppercase;letter-spacing:.2em;font-weight:800!important}
.tot-review{padding:4px 18px}
.tot-review summary{cursor:pointer;font-weight:700;padding:12px 0;list-style:none}
.tot-review summary::-webkit-details-marker{display:none}
.tot-review summary::after{content:" \203A"}
.tot-review ol{display:flex;flex-direction:column;gap:12px;padding:4px 0 16px!important}
.tot-review li{display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px}
.tot-review .n{width:26px;height:20px;border:2px solid var(--tot-ink);border-radius:5px;display:grid;place-items:center;font:800 11px var(--tot-body);margin-top:2px}
.tot-review p{font-size:15px}
.tot-review .a{color:var(--tot-rust)}

/* Stats and archive */
.tot.tot-layer{background:none;container-type:normal}
.tot-modal{position:fixed;inset:0;z-index:99999;background:rgba(18,18,18,.45);display:flex;align-items:flex-end;justify-content:center;padding:16px}
@media (min-width:600px){.tot-modal{align-items:center}}
.tot-sheet{background:var(--tot-bg);color:var(--tot-ink);border-radius:20px;width:100%;max-width:440px;max-height:85vh;overflow:auto;font-family:var(--tot-body)}
.tot-mh{display:flex;justify-content:space-between;align-items:center;padding:16px 18px 8px}
.tot-mh h3{font:800 24px var(--tot-display);margin:0}
.tot .tot-x{width:40px;height:40px;border-radius:50%!important;border:1px solid var(--tot-ink)!important;background:transparent!important;font-size:22px!important;line-height:1!important;padding:0!important;color:var(--tot-ink)!important}
.tot-mb{padding:8px 18px 20px}
.tot-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));gap:8px}
.tot-stats div{background:#fff;border-radius:14px;padding:12px 8px;text-align:center}
.tot-stats b{display:block;font-size:24px;font-weight:800}
.tot-stats span{font-size:12.5px;color:var(--tot-muted);font-weight:600}
.tot-arch{display:flex;flex-direction:column;gap:6px}
.tot .tot-arch button{width:100%;display:grid;grid-template-columns:auto auto minmax(0,1fr) auto;gap:10px;align-items:center;text-align:left;background:#fff!important;border:0!important;border-radius:12px!important;padding:12px 14px!important;font:500 14.5px var(--tot-body)!important;color:var(--tot-ink)!important;box-shadow:none!important}
.tot-arch .no{font-weight:800}
.tot-arch .dt{color:var(--tot-muted)}
.tot-arch .fs{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tot-arch .tag{background:var(--tot-rust);color:#fff;border-radius:999px;padding:2px 9px;font-size:12px;font-weight:800}
.tot-arch .tag.soft{background:var(--tot-tan);color:var(--tot-ink)}
/* ---------- Depot look ---------- */
.tot{background:linear-gradient(180deg,#FFF6EE 0,var(--tot-bg) 320px)}
.tot h1,.tot h2,.tot h3{font-weight:900;letter-spacing:-.01em}
.tot-card{border-radius:22px;border:1.5px solid #fff;box-shadow:0 2px 0 rgba(160,90,40,.06),0 14px 34px -18px rgba(150,70,20,.35)}

/* Header with hills and clouds */
.tot-head{position:relative;z-index:0;padding:4px 0 2px}
.tot-head::before{content:"";position:absolute;z-index:-1;right:min(150px,26%);bottom:-6px;width:min(460px,62%);height:100%;pointer-events:none;opacity:.95;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 460 120' preserveAspectRatio='xMidYMax meet'%3E%3Cpath d='M0 120C60 112 110 82 170 74S270 30 320 34s90 56 140 86z' fill='%23EED3BC'/%3E%3Cpath d='M70 120c40-10 70-28 110-30s70 16 110 30z' fill='%23E6C4A8' opacity='.7'/%3E%3Cg fill='%23F6C9A3'%3E%3Cellipse cx='92' cy='34' rx='26' ry='11'/%3E%3Cellipse cx='108' cy='24' rx='18' ry='13'/%3E%3Cellipse cx='120' cy='36' rx='22' ry='9'/%3E%3C/g%3E%3C/svg%3E") right bottom/contain no-repeat}
.tot-d{font-weight:700}
.tot .tot-title{font-weight:900;gap:12px}
.tot-tname{position:relative;display:inline-block;padding-bottom:6px}
.tot-tname::after{content:"";position:absolute;left:2%;right:22%;bottom:-2px;height:9px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 12' preserveAspectRatio='none'%3E%3Cpath d='M3 9C60 2 140 1 197 6' fill='none' stroke='%23E4521B' stroke-width='4' stroke-linecap='round'/%3E%3C/svg%3E") 0 0/100% 100% no-repeat}
.tot-icon-sm{border-radius:22%;box-shadow:0 6px 14px -6px rgba(200,70,10,.6)}
.tot-pts{display:flex;align-items:center;gap:12px;background:linear-gradient(180deg,#2A2A30,#141417);border-radius:18px;padding:8px 16px 8px 12px;box-shadow:0 10px 22px -12px rgba(0,0,0,.55)}
.tot-pts>div{text-align:left}
.tot-pts small{font-weight:700}
.tot-pts b{font-weight:900}
.tot-trophy{width:34px;height:34px;flex:0 0 auto}

/* Yard */
.tot-yard{background:linear-gradient(#FFF7EF 0 74%,#F2DCC7 74%)}
.tot-rail{background:repeating-linear-gradient(90deg,#7A4A2B 0 8px,transparent 8px 15px) 0 3px/100% 6px no-repeat,linear-gradient(#4A2C1A,#4A2C1A) 0 0/100% 3px no-repeat}
.tot-box{border-radius:8px;font-weight:900}
.tot-car.e .tot-box{border-color:#B58A6A;color:#8A5A3A;font-size:15px;border-width:2.5px}
.tot-car.e .tot-wh{border-color:#B58A6A}
.tot-car.p3 .tot-box{background:var(--tot-rust)}
.tot-car.p2 .tot-box{background:var(--tot-tan)}
.tot-chain{font-weight:700;color:var(--tot-muted);border-top-color:var(--tot-rule)}
.tot-eng svg .tot-smoke{animation:tot-smoke 3s ease-in-out infinite}
@keyframes tot-smoke{50%{transform:translate(1px,-2px)}}

/* Steps */
.tot-steps span{background:linear-gradient(180deg,#FFC08F,#F99A5E);color:#5A2E14;font-weight:900;box-shadow:inset 0 -2px 0 rgba(160,60,10,.18)}
.tot-steps span.d{background:var(--tot-ink);color:#fff;box-shadow:none}
.tot-steps span.n{background:#fff;color:var(--tot-ink);box-shadow:inset 0 0 0 2.5px var(--tot-ink)}

/* Question */
.tot-qk{align-items:center;letter-spacing:.06em}
.tot-carno{display:flex;align-items:center;gap:8px}
.tot-carno svg{width:34px;height:24px}
.tot-carno b{background:var(--tot-rust);color:#fff;border-radius:999px;padding:5px 12px;font-weight:900}
.tot-qk span.tot-worth{display:flex;align-items:center;gap:6px;background:var(--tot-cream);color:var(--tot-ink);border-radius:999px;padding:5px 12px;font-weight:900}
.tot-worth svg{width:16px;height:16px}
.tot-qt{font-weight:900;line-height:1.3;letter-spacing:-.005em}
.tot-boxes{column-gap:calc(var(--bx,26px) * 1.3)}
.tot-bx{border-width:2.5px;border-radius:8px;font-weight:900;box-shadow:inset 0 -3px 0 rgba(0,0,0,.04)}
.tot-lbl{font-weight:800}
.tot .tot-row input{border:2.5px solid var(--tot-rust)!important;font-weight:700!important}
.tot .tot-row input::placeholder{font-style:italic;font-weight:600;color:#8C7464;opacity:1}
.tot .tot-row input:focus{box-shadow:0 0 0 4px rgba(228,82,27,.18)!important}
.tot .tot-go{display:flex;align-items:center;gap:8px;background:linear-gradient(180deg,#F26A2A,#D9440F)!important;font-weight:900!important;box-shadow:0 8px 16px -8px rgba(217,68,15,.8)!important}
.tot-go svg{width:22px;height:22px}
.tot .tot-choice{border:2px solid var(--tot-ink)!important;font-weight:800!important}
.tot-ladder{gap:8px}
.tot-ladder span{display:flex;align-items:center;justify-content:center;gap:6px;padding:8px 6px;background:var(--tot-cream);color:var(--tot-muted);font-weight:800}
.tot-ladder span.on{background:var(--tot-ink);color:#fff}
.tot-ladder svg{width:16px;height:16px;flex:0 0 auto}
.tot-hint{background:var(--tot-yelsoft);border-radius:14px}
.tot .tot-pill{font-weight:800!important;border-width:2px!important}
.tot .tot-pill.solid{background:linear-gradient(180deg,#F26A2A,#D9440F)!important;border-color:#D9440F!important}

/* Admin replay strip (only admins see it) */
.tot-admin{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:10px 14px;border:2px dashed #C9A88C;border-radius:16px;font-size:13.5px;color:var(--tot-muted)}
.tot-admin span{background:var(--tot-ink);color:#fff;border-radius:999px;padding:2px 10px;font-weight:900;font-size:11.5px;letter-spacing:.08em;text-transform:uppercase}
.tot .tot-replay{border:2px solid var(--tot-ink)!important;background:#fff!important;color:var(--tot-ink)!important;border-radius:999px!important;padding:7px 16px!important;font:800 14px var(--tot-body)!important;box-shadow:none!important}
.tot-admin em{font-style:normal}

/* Desktop: a wider train and bigger type when there's room. [train_of_thought width="1000"] changes the cap. */
@container (min-width:760px){
  .tot-wrap{max-width:var(--tot-max,920px);padding:30px 32px 40px}
  .tot-game{gap:18px}
  .tot-splash{gap:18px;padding:40px 6px 20px}
  .tot-icon{width:104px;height:104px}
  .tot .tot-name{font-size:56px}
  .tot-sub{font-size:22px;max-width:36ch}
  .tot-pills{max-width:300px}
  .tot-how{max-width:440px;font-size:16px}
  .tot-icon-sm{width:40px;height:40px}
  .tot-pts{padding:10px 18px;min-width:110px}
  .tot-yard{height:132px}
  .tot-train{--tot-cw:8.8;bottom:22px}
  .tot-eng,.tot-eng svg{width:80px;height:53px}
  .tot-box{height:36px;font-size:12.5px}
  .tot-car.num .tot-box{font-size:15px}
  .tot-wh{width:13px;height:13px}
  .tot-chain{padding:12px 20px;font-size:14.5px}
  .tot-steps span{height:32px;font-size:14px}
  .tot-q{padding:24px 30px 28px;gap:16px}
  .tot-qk{font-size:13px}
  .tot-qt{font-size:28px;line-height:1.28}
  .tot-trophy{width:44px;height:44px}
  .tot-pts{padding:10px 22px 10px 16px;gap:14px}
  .tot .tot-title{font-size:40px}
  .tot-ladder span{padding:12px 6px;font-size:15px}
  .tot-ladder svg{width:20px;height:20px}
  .tot-carno b,.tot-qk span.tot-worth{padding:7px 16px;font-size:14px}
  .tot-carno svg{width:40px;height:28px}
  .tot-steps span{height:40px;font-size:17px}
  .tot-hint{font-size:17px;padding:12px 16px}
  .tot .tot-row input{height:60px;font-size:20px!important}
  .tot .tot-go{height:60px;padding:0 32px!important;font-size:18px!important}
  .tot-mc{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
  .tot .tot-choice{min-height:56px;font-size:15.5px!important}
  .tot-end{padding:32px 30px;gap:14px}
  .tot-end h3{font-size:36px}
  .tot-big{font-size:72px}
  .tot-grid b{width:40px;height:28px;font-size:13px}
  .tot-board{padding:20px 30px}
  .tot-review{padding:6px 30px}
  .tot-review p{font-size:16px}
}
@container (max-width:520px){
  .tot-head::before{right:0;width:70%;opacity:.55}
  .tot .tot-go{padding:0 18px!important}
  .tot-go svg{display:none}
  .tot-pts{padding:8px 12px 8px 10px;gap:8px}
  .tot-trophy{width:26px;height:26px}
  .tot-pts b{font-size:26px}
  .tot .tot-row input{padding:0 16px!important;font-size:16px!important}
  .tot-ladder span{font-size:12px;gap:4px;padding:8px 4px}
  .tot-ladder svg{width:13px;height:13px}
}
@container (max-width:380px){.tot .tot-name{font-size:34px}.tot .tot-title{font-size:22px}.tot-pts b{font-size:26px}.tot-trophy{display:none}.tot-ladder span{font-size:11.5px;gap:4px}.tot-ladder svg{width:13px;height:13px}.tot-carno svg{display:none}}
@media (prefers-reduced-motion:reduce){.tot-car{transition:none!important}.tot *{animation:none!important}}