:root{--tml-blue:#003668;--tml-blue-2:#00569a;--tml-orange:#f39200;--tml-orange-2:#ffb22e;--tml-ink:#07325a;--tml-pale:#eef7fc;--tml-white:#fff;--tml-line:#bfd7e7;--tml-muted:#526b7e}
.tml-machine{box-sizing:border-box;width:100%;max-width:1100px;min-width:0;margin:0 auto;padding:24px;border:1px solid #c7dfed;border-radius:24px;color:var(--tml-ink);background:radial-gradient(circle at 10% 0%,#fff 0,transparent 32%),linear-gradient(145deg,#f7fcff,#dceef8);box-shadow:0 18px 48px rgba(0,54,104,.16);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;overflow:hidden;overflow-wrap:anywhere;container-type:inline-size;container-name:tml}
.tml-machine *{box-sizing:border-box}.tml-header{text-align:center}.tml-header h2{display:inline-block;margin:0;padding:8px 22px;border-radius:999px;color:var(--tml-white);background:var(--tml-blue);font-size:clamp(25px,4vw,42px);letter-spacing:-.02em;box-shadow:0 7px 0 var(--tml-orange)}.tml-header p{max-width:760px;margin:18px auto;color:var(--tml-muted);font-size:14px;line-height:1.5}
.tml-top-controls{max-width:820px;margin:0 auto 18px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.tml-top-controls label{display:grid;gap:6px;padding:12px 14px;border:1px solid var(--tml-line);border-radius:14px;background:rgba(255,255,255,.84);color:var(--tml-blue);font-size:13px;font-weight:700;box-shadow:0 5px 14px rgba(0,54,104,.06)}.tml-top-controls select{width:100%;padding:10px;border:1px solid #a9c8da;border-radius:9px;background:#fff;color:#142c3e;font:inherit;font-weight:500}
.tml-reels{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;max-width:900px;margin:24px auto 28px}.tml-reel{min-width:0;display:flex;flex-direction:column-reverse;align-items:center;justify-content:center;gap:10px;background:transparent}.tml-reel small{color:var(--tml-blue);font-size:12px;font-weight:800}.tml-reel strong{position:relative;width:min(132px,100%);aspect-ratio:1;border:7px solid var(--tml-orange);border-radius:50%;display:grid;place-items:center;color:var(--tml-blue);background:radial-gradient(circle at 33% 24%,#fff 0 22%,#f8fbfd 40%,#d9e8f0 72%,#afc8d6 100%);font-size:clamp(37px,5.5vw,60px);font-weight:950;font-variant-numeric:tabular-nums;line-height:1;box-shadow:inset -9px -12px 18px rgba(0,54,104,.16),inset 7px 7px 13px rgba(255,255,255,.9),0 10px 18px rgba(0,54,104,.19);text-shadow:0 2px 0 #fff}.tml-reel strong:after{content:"";position:absolute;left:19%;top:12%;width:25%;height:13%;border-radius:50%;background:rgba(255,255,255,.8);transform:rotate(-28deg);filter:blur(1px)}
.tml-reel.is-waiting strong{opacity:.48;filter:saturate(.5)}.tml-reel.is-spinning strong{border-color:var(--tml-orange-2);animation:tml-ball-spin .55s linear infinite;box-shadow:inset -9px -12px 18px rgba(0,54,104,.18),0 0 0 8px rgba(243,146,0,.15),0 12px 22px rgba(0,54,104,.2)}.tml-reel.is-stopped strong{animation:tml-ball-drop .38s cubic-bezier(.2,.9,.3,1.35)}
@keyframes tml-ball-spin{0%{transform:rotate(0) scale(.96)}50%{transform:rotate(180deg) scale(1.04)}100%{transform:rotate(360deg) scale(.96)}}@keyframes tml-ball-drop{0%{transform:translateY(-18px) scale(.82)}70%{transform:translateY(4px) scale(1.08)}100%{transform:translateY(0) scale(1)}}
.tml-sliders{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;max-width:820px;margin:0 auto 16px;padding:13px;border:1px solid #a9c8da;border-radius:18px;background:linear-gradient(180deg,#fff,#e8f4fa);box-shadow:inset 0 1px 0 #fff,0 7px 18px rgba(0,54,104,.08)}.tml-slider{position:relative;min-width:0;height:222px;padding:10px 5px 9px;border:1px solid var(--tml-line);border-radius:13px;background:rgba(255,255,255,.82);display:grid;grid-template-rows:32px 1fr 28px;justify-items:center;align-items:center;box-shadow:inset 0 -5px 12px rgba(0,54,104,.04)}.tml-slider b{max-width:100%;color:var(--tml-blue);font-size:12px;line-height:1.15;text-align:center;overflow-wrap:anywhere}.tml-slider output{min-width:44px;padding:4px 8px;border-radius:999px;text-align:center;color:#fff;background:var(--tml-orange);font-weight:900;font-variant-numeric:tabular-nums;line-height:1.2;box-shadow:0 3px 0 #bd5b00}.tml-slider input{width:28px;height:142px;margin:0;writing-mode:vertical-lr;direction:rtl;accent-color:var(--tml-orange);cursor:ns-resize}.tml-slider small{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.tml-options{display:flex;justify-content:center;gap:9px;flex-wrap:wrap;margin:4px auto 13px}.tml-options label{display:flex;align-items:center;gap:7px;min-height:40px;padding:8px 14px;border:1px solid #a9c8da;border-radius:999px;background:#fff;color:var(--tml-blue);font-size:13px;font-weight:700}.tml-options input{width:18px;height:18px;margin:0;accent-color:var(--tml-orange)}
.tml-spin{display:block;width:min(390px,100%);min-height:54px;margin:0 auto;padding:14px 18px;border:0;border-radius:999px;color:#fff;background:linear-gradient(135deg,var(--tml-orange),#e87300);box-shadow:0 7px 0 #b95200,0 12px 21px rgba(173,80,0,.2);font:900 17px/1.2 inherit;cursor:pointer;transition:transform .15s,box-shadow .15s}.tml-spin:hover{transform:translateY(-1px)}.tml-spin:active{transform:translateY(5px);box-shadow:0 2px 0 #b95200}.tml-spin:disabled{opacity:.62;cursor:not-allowed;transform:none}.tml-status{text-align:center;color:var(--tml-blue);font-size:13px;font-weight:700;min-height:20px}
.tml-results{max-width:900px;margin:19px auto 0;padding:17px;border:1px solid var(--tml-line);border-radius:17px;background:rgba(255,255,255,.88);box-shadow:0 7px 18px rgba(0,54,104,.07)}.tml-results h3{text-align:center;margin:0 0 6px;color:var(--tml-blue)}.tml-results>p{text-align:center;color:var(--tml-muted);font-size:12px}.tml-stat-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px}.tml-stat-grid article{min-width:0;padding:12px;border-top:4px solid var(--tml-orange);border-radius:12px;background:#edf7fc}.tml-stat-grid h4{margin:0 0 8px;color:var(--tml-blue);font-size:14px}.tml-stat-grid p{margin:5px 0;color:var(--tml-muted);font-size:11px;line-height:1.4}.tml-stat-grid b{color:var(--tml-ink)}
.tml-disclaimer{max-width:880px;margin:20px auto 0;padding:13px 15px;text-align:center;border:1px solid #a9c8da;border-radius:13px;background:#fff;color:var(--tml-muted);font-size:12px;line-height:1.55}.tml-disclaimer strong{color:#c96900}
@container tml (max-width:760px){.tml-machine{padding:16px}.tml-header h2{font-size:clamp(24px,8cqw,33px)}.tml-reels{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px 9px}.tml-reel strong{width:min(118px,100%);border-width:6px;font-size:clamp(33px,12cqw,48px)}.tml-sliders{grid-template-columns:repeat(6,minmax(0,1fr));padding:9px;gap:5px}.tml-slider{height:205px;padding-inline:2px}.tml-slider input{height:128px}.tml-slider b{font-size:10px}.tml-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@container tml (max-width:480px){.tml-machine{padding:12px;border-radius:16px}.tml-header h2{padding:7px 15px}.tml-top-controls{grid-template-columns:1fr}.tml-reels{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px 6px}.tml-reel strong{width:min(100px,100%);border-width:5px;font-size:clamp(29px,15cqw,40px)}.tml-reel small{font-size:10px}.tml-sliders{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;padding:8px}.tml-slider{height:190px;padding:7px 3px}.tml-slider input{height:114px}.tml-slider b{font-size:11px}.tml-stat-grid{grid-template-columns:1fr}.tml-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.tml-options label{justify-content:center;padding:8px}}
@media(max-width:760px){.tml-reels{grid-template-columns:repeat(3,minmax(0,1fr))}.tml-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:480px){.tml-machine{padding:12px}.tml-top-controls,.tml-stat-grid{grid-template-columns:1fr}.tml-sliders{grid-template-columns:repeat(3,minmax(0,1fr))}.tml-reels{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(prefers-reduced-motion:reduce){.tml-reel.is-spinning strong,.tml-reel.is-stopped strong{animation:none}}