.ok-root{--tw-base:clamp(30px,min(4.2vw,6vh),54px);--tw:var(--tw-base);--felt-1:#3a2c86;--felt-2:#241a5c;--felt-3:#120c33;--wood-1:#8b6cff;--wood-2:#2a1f5e;--wood-3:#151034;--rim-glow:rgba(167,139,250,.35);--rack-1:#3b2f6e;--rack-2:#271d52;--rack-3:#1a1340;--rack-edge:#0d0a24;--lip-1:#f3c759;--lip-2:#c6922a;--lip-3:#7a5513;--room-bg:radial-gradient(ellipse 60% 50% at 20% 0%,rgba(168,85,247,.35),transparent 70%),radial-gradient(ellipse 50% 45% at 90% 20%,rgba(236,72,153,.22),transparent 70%),radial-gradient(ellipse 70% 50% at 50% 110%,rgba(37,99,235,.35),transparent 70%),linear-gradient(180deg,#160f3a,#0e0a28 55%,#080619);--c-r:#d3262c;--c-y:#dc9700;--c-b:#1d5cc4;--c-k:#1a1a1a;font-family:var(--font-sans),system-ui,sans-serif;user-select:none;-webkit-user-select:none;touch-action:manipulation}.ok-root[data-theme=klasik]{--felt-1:#1f7a52;--felt-2:#11553a;--felt-3:#0a3a27;--wood-1:#8a5a32;--wood-2:#6b4224;--wood-3:#4a2b15;--rim-glow:rgba(255,210,150,.15);--rack-1:#a06a3c;--rack-2:#82512b;--rack-3:#6b4021;--rack-edge:#3d2410;--lip-1:#c48a52;--lip-2:#8f5a30;--lip-3:#5e3719;--room-bg:radial-gradient(ellipse 70% 55% at 50% 45%,rgba(255,196,120,.13),transparent 70%),radial-gradient(ellipse 120% 80% at 50% 120%,rgba(0,0,0,.6),transparent 60%),linear-gradient(180deg,#2a1a10,#1b110a 50%,#120b06)}.ok-room-bg{background:var(--room-bg)}.ok-room-bg-legacy{background:radial-gradient(ellipse 70% 55% at 50% 45%,rgba(255,196,120,.13),transparent 70%),radial-gradient(ellipse 120% 80% at 50% 120%,rgba(0,0,0,.6),transparent 60%),linear-gradient(180deg,#2a1a10,#1b110a 50%,#120b06)}.ok-tile{--h:calc(var(--tw) * 1.42);position:relative;width:var(--tw);height:var(--h);border-radius:calc(var(--tw) * .13);background:linear-gradient(175deg,#fffefa,#fbf6e8 45%,#efe5cb);box-shadow:inset 0 1px 0 #fff,inset 0 -2px 0 rgba(120,95,40,.12),0 1px 0 #d7c9a3,0 2px 0 #c1b086,0 3px 0 #a7966b,0 5px 9px rgba(0,0,0,.38);display:flex;flex-direction:column;align-items:center;padding-top:calc(var(--tw) * .14);flex-shrink:0;transition:transform .14s ease,box-shadow .14s ease,opacity .14s;cursor:grab}.ok-tile[data-static="1"]{cursor:default}.ok-tile:after{content:"";position:absolute;inset:2px 3px auto 3px;height:32%;border-radius:calc(var(--tw) * .1) calc(var(--tw) * .1) 40% 40%;background:linear-gradient(180deg,hsla(0,0%,100%,.85),hsla(0,0%,100%,0));pointer-events:none}.ok-num{font-family:Arial Black,Segoe UI Black,Impact,system-ui,sans-serif;font-weight:900;font-size:calc(var(--tw) * .6);line-height:1;letter-spacing:-.04em;color:var(--tc);text-shadow:0 1px 0 hsla(0,0%,100%,.7),0 -1px 0 rgba(0,0,0,.12);position:relative;z-index:1}.ok-pip{margin-top:calc(var(--tw) * .1);width:calc(var(--tw) * .24);height:calc(var(--tw) * .24);border-radius:50%;background:radial-gradient(circle at 35% 30%,color-mix(in srgb,var(--tc) 55%,#fff),var(--tc) 60%);box-shadow:inset 0 -1px 1px rgba(0,0,0,.3)}.ok-tile[data-c=r]{--tc:var(--c-r)}.ok-tile[data-c=y]{--tc:var(--c-y)}.ok-tile[data-c=b]{--tc:var(--c-b)}.ok-tile[data-c=k]{--tc:var(--c-k)}.ok-fake{margin-top:calc(var(--tw) * .08);width:calc(var(--tw) * .7);height:calc(var(--tw) * .7);color:#16733f;filter:drop-shadow(0 1px 0 rgba(255,255,255,.6))}.ok-joker-badge{position:absolute;top:2px;right:2px;width:calc(var(--tw) * .3);height:calc(var(--tw) * .3);color:#d4a017;filter:drop-shadow(0 0 2px rgba(212,160,23,.7));z-index:2}.ok-tile[data-joker="1"]{background:linear-gradient(175deg,#fffdf0,#fbf1d2 45%,#f0dfa8);box-shadow:inset 0 0 0 1.5px rgba(212,160,23,.55),inset 0 1px 0 #fff,0 1px 0 #d7c9a3,0 2px 0 #c1b086,0 3px 0 #a7966b,0 5px 9px rgba(0,0,0,.38)}.ok-tile[data-selected="1"]{transform:translateY(calc(var(--tw) * -.28));box-shadow:inset 0 0 0 2px #22c55e,0 1px 0 #d7c9a3,0 2px 0 #c1b086,0 3px 0 #a7966b,0 10px 18px rgba(0,0,0,.45),0 0 14px rgba(34,197,94,.55)}.ok-tile[data-new="1"]:before{content:"";position:absolute;inset:-3px;border-radius:calc(var(--tw) * .16);border:2px solid #fbbf24;animation:ok-pulse 1.2s ease-in-out 3;pointer-events:none}.ok-tile[data-dim="1"]{opacity:.25}.ok-tile[data-hint="1"]{box-shadow:inset 0 0 0 2px #38bdf8,0 2px 0 #c1b086,0 5px 9px rgba(0,0,0,.38)}@keyframes ok-pulse{0%,to{opacity:0}50%{opacity:1}}.ok-back{width:var(--tw);height:calc(var(--tw) * 1.42);border-radius:calc(var(--tw) * .13);background:radial-gradient(circle at 50% 50%,hsla(0,0%,100%,.18) 0 18%,transparent 19%),repeating-linear-gradient(45deg,hsla(0,0%,100%,.06) 0 3px,transparent 3px 6px),linear-gradient(170deg,#f4ecd6,#d9cba6);box-shadow:inset 0 0 0 2px #e9dfc4,inset 0 0 0 calc(var(--tw) * .12) #1a6b46,0 2px 0 #a7966b,0 4px 6px rgba(0,0,0,.35)}.ok-table{position:relative;border-radius:42px;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 .22 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>"),radial-gradient(ellipse 70% 65% at 50% 45%,var(--felt-1) 0,var(--felt-2) 60%,var(--felt-3) 100%);box-shadow:inset 0 0 0 2px hsla(0,0%,100%,.05),inset 0 0 70px rgba(0,0,0,.55),0 0 0 12px var(--wood-2),0 0 0 14px var(--wood-3),0 0 40px 14px var(--rim-glow),0 0 0 15px rgba(255,210,150,.15),0 30px 60px rgba(0,0,0,.6)}.ok-table:before{content:"";inset:-14px;border-radius:54px;background:repeating-linear-gradient(100deg,hsla(0,0%,100%,.04) 0 2px,transparent 2px 9px,rgba(0,0,0,.06) 9px 11px,transparent 11px 19px);z-index:-1}.ok-felt-logo,.ok-table:before{position:absolute;pointer-events:none}.ok-felt-logo{inset:0;display:grid;place-items:center;font-family:var(--font-display),system-ui;font-weight:800;font-size:clamp(60px,12vw,180px);color:hsla(0,0%,100%,.035);letter-spacing:-.05em}.ok-rack{--gap:calc(var(--tw) * 0.06);position:relative;padding:calc(var(--tw) * .18) calc(var(--tw) * .3) calc(var(--tw) * .12);border-radius:14px 14px 18px 18px;background:repeating-linear-gradient(178deg,hsla(0,0%,100%,.05) 0 2px,transparent 2px 7px,rgba(0,0,0,.07) 7px 9px,transparent 9px 15px),linear-gradient(180deg,var(--rack-1) 0,var(--rack-2) 40%,var(--rack-3) 100%);box-shadow:inset 0 2px 0 rgba(255,220,170,.35),inset 0 -4px 0 rgba(0,0,0,.3),0 18px 30px rgba(0,0,0,.55),0 4px 0 var(--rack-edge)}.ok-rack-row{position:relative;display:grid;grid-template-columns:repeat(15,var(--tw));gap:var(--gap);padding-bottom:calc(var(--tw) * .16);margin-bottom:calc(var(--tw) * .08)}.ok-rack-row:after{content:"";position:absolute;left:calc(var(--tw) * -.2);right:calc(var(--tw) * -.2);bottom:0;height:calc(var(--tw) * .22);border-radius:4px;background:linear-gradient(180deg,var(--lip-1) 0,var(--lip-2) 50%,var(--lip-3) 100%);box-shadow:0 3px 5px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,230,190,.5);z-index:3;pointer-events:none}.ok-slot{position:relative;width:var(--tw);height:calc(var(--tw) * 1.42);border-radius:calc(var(--tw) * .13)}.ok-slot[data-over="1"]:before{content:"";position:absolute;inset:0;border-radius:inherit;background:rgba(251,191,36,.25);box-shadow:inset 0 0 0 2px rgba(251,191,36,.8)}.ok-group-ok{position:absolute;height:4px;border-radius:4px;top:calc(var(--tw) * -.12);z-index:4}.ok-ghost{position:fixed;z-index:1000;pointer-events:none;transform:translate(-50%,-60%) rotate(-3deg) scale(1.08);filter:drop-shadow(0 14px 18px rgba(0,0,0,.5))}.ok-drop-hot{outline:2px dashed rgba(251,191,36,.9);outline-offset:3px;background-color:rgba(251,191,36,.12)!important}.ok-drop-target{outline:2px solid rgba(56,189,248,.85);outline-offset:2px;box-shadow:0 0 18px rgba(56,189,248,.45)}.ok-turn-ring{animation:ok-glow 1.6s ease-in-out infinite}@keyframes ok-glow{0%,to{box-shadow:0 0 0 3px rgba(250,204,21,.9),0 0 16px rgba(250,204,21,.5)}50%{box-shadow:0 0 0 3px rgba(250,204,21,.5),0 0 30px rgba(250,204,21,.8)}}.ok-wall-stack{position:relative;cursor:default}.ok-wall-stack[data-active="1"]{cursor:pointer;animation:ok-bob 1.4s ease-in-out infinite}@keyframes ok-bob{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}.ok-scroll::-webkit-scrollbar{width:6px;height:6px}.ok-scroll::-webkit-scrollbar-thumb{background:hsla(0,0%,100%,.18);border-radius:6px}.ok-drop-in{animation:ok-drop-in .35s cubic-bezier(.2,.9,.3,1.2) both}@keyframes ok-drop-in{0%{transform:translate(var(--fx,0),var(--fy,0)) scale(1.25) rotate(-10deg);opacity:0}to{transform:rotate(2deg);opacity:1}}.ok-fade-in{animation:ok-fade-in .4s ease both}@keyframes ok-fade-in{0%{opacity:0;transform:translateY(8px)}}.ok-neon-bg{background:radial-gradient(ellipse 55% 45% at 15% 5%,rgba(168,85,247,.45),transparent 70%),radial-gradient(ellipse 45% 40% at 85% 15%,rgba(236,72,153,.28),transparent 70%),radial-gradient(ellipse 70% 55% at 60% 105%,rgba(37,99,235,.45),transparent 70%),radial-gradient(ellipse 40% 30% at 10% 90%,rgba(16,185,129,.18),transparent 70%),linear-gradient(180deg,#170f3d,#0e0a2a 60%,#080619);background-attachment:fixed}.ok-glass{background:linear-gradient(160deg,hsla(0,0%,100%,.09),hsla(0,0%,100%,.03));border:1px solid hsla(0,0%,100%,.1);box-shadow:inset 0 1px 0 hsla(0,0%,100%,.08),0 20px 50px -20px rgba(0,0,0,.6);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}.ok-card{background:linear-gradient(165deg,rgba(49,34,110,.92),rgba(17,12,44,.95));border-color:rgba(196,181,253,.18)!important}.ok-cta{color:#2a1700;background:linear-gradient(180deg,#ffd34d,#f5a70b);box-shadow:inset 0 1px 0 hsla(0,0%,100%,.6),inset 0 -2px 0 rgba(150,80,0,.35),0 10px 30px -8px rgba(245,167,11,.6);transition:transform .15s ease,box-shadow .15s ease,filter .15s}.ok-cta:hover:not(:disabled){transform:translateY(-1px);filter:brightness(1.05);box-shadow:inset 0 1px 0 hsla(0,0%,100%,.6),inset 0 -2px 0 rgba(150,80,0,.35),0 14px 36px -8px rgba(245,167,11,.75)}.ok-gold-text{background:linear-gradient(180deg,#ffe08a,#f5a70b 70%,#d97706);-webkit-background-clip:text;background-clip:text;color:transparent}.ok-float{animation:ok-float 7s ease-in-out infinite}@keyframes ok-float{0%,to{translate:0 0}50%{translate:0 -14px}}.ok-hero-art{perspective:1100px}.ok-table-mini{transform:rotateX(18deg) rotate(-4deg);border-radius:28px;padding:18px 18px 24px;background:radial-gradient(ellipse 70% 60% at 50% 40%,#3a2c86,#1b1447 80%);box-shadow:0 0 0 8px #2a1f5e,0 0 0 10px #151034,0 0 60px 10px rgba(167,139,250,.35),0 40px 60px -20px rgba(0,0,0,.7)}.ok-rack-mini{margin:0 auto;width:fit-content;padding:10px 12px 12px;border-radius:14px;background:linear-gradient(180deg,#3b2f6e,#1a1340);box-shadow:inset 0 2px 0 hsla(0,0%,100%,.12),0 4px 0 #0d0a24,0 18px 30px -8px rgba(0,0,0,.6);border-bottom:4px solid #c6922a}.ok-mode-card{transition:transform .2s ease,border-color .2s ease}.ok-mode-card:hover{transform:translateY(-4px);border-color:rgba(253,224,71,.45)}