:root{--iz-primary:#6d5dfc;--iz-secondary:#11c5c6;--iz-bg:#090e1a;--iz-panel:#121a2b;--iz-border:rgba(255,255,255,.09)}*{box-sizing:border-box}body{min-height:var(--iznel-viewport-height,100dvh);background:radial-gradient(circle at 10% 0,rgba(109,93,252,.17),transparent 34%),radial-gradient(circle at 90% 20%,rgba(17,197,198,.10),transparent 28%),var(--iz-bg);color:#f6f7fb}.fw-black{font-weight:900;letter-spacing:-.04em}.glass-nav{background:rgba(9,14,26,.82);backdrop-filter:blur(14px);border-bottom:1px solid var(--iz-border)}.brand-mark{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:11px;background:linear-gradient(135deg,var(--iz-primary),var(--iz-secondary));box-shadow:0 8px 24px rgba(109,93,252,.35)}.hero-section{min-height:65vh;display:flex;align-items:center}.hero-board{aspect-ratio:1;border:1px solid var(--iz-border);border-radius:36px;background:linear-gradient(145deg,#1b2841,#0e1525);box-shadow:0 40px 90px rgba(0,0,0,.45);padding:12%;display:grid;grid-template-columns:1fr 1fr;gap:12px;transform:perspective(900px) rotateY(-8deg) rotateX(5deg)}.game-chip{display:grid;place-items:center;border-radius:20px;background:linear-gradient(145deg,#fff,#c8cfdd);color:#141827;font-size:clamp(1rem,4vw,2.2rem);font-weight:900;box-shadow:inset 0 -8px 15px rgba(0,0,0,.14)}.mini-game-card,.panel-card,.auth-card,.stat-card{background:rgba(18,26,43,.92);border:1px solid var(--iz-border);border-radius:20px}.mini-game-card{padding:18px;display:flex;flex-direction:column;gap:5px}.mini-game-card small{color:#8994a8}.auth-shell{min-height:calc(100vh - 130px);display:flex;align-items:center;padding:40px 0}.auth-card{box-shadow:0 35px 80px rgba(0,0,0,.35)}.form-control,.form-select{border-color:var(--iz-border);background:#0c1322}.form-control:focus,.form-select:focus{border-color:var(--iz-primary);box-shadow:0 0 0 .25rem rgba(109,93,252,.2)}.game-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.game-card{min-height:135px;padding:18px;border-radius:20px;border:1px solid var(--iz-border);background:linear-gradient(145deg,#16223a,#101725);color:#fff;text-align:left;display:flex;flex-direction:column;gap:7px;transition:.2s}.game-card:hover,.game-card:focus{transform:translateY(-3px);border-color:rgba(109,93,252,.7);box-shadow:0 18px 30px rgba(0,0,0,.25)}.game-card .game-icon{font-size:1.8rem}.game-card small{color:#9da9bd}.panel-card{padding:18px}.wallet-pill{padding:10px 18px;border-radius:999px;background:#1a2234;border:1px solid var(--iz-border)}.chat-messages{height:360px;overflow:auto;border-radius:14px;background:#0b111d;padding:12px}.chat-message{padding:8px 0;border-bottom:1px solid rgba(255,255,255,.05)}.chat-message strong{color:#7fe4e4}.connection-status{font-size:.85rem;color:#9da9bd}.dot{width:9px;height:9px;border-radius:50%;background:#f59e0b;display:inline-block;margin-right:7px}.dot.online{background:#22c55e;box-shadow:0 0 10px #22c55e}.admin-sidebar{position:fixed;top:57px;bottom:0;left:0;background:#0b111d;border-right:1px solid var(--iz-border)}.admin-sidebar .nav-link{border-radius:10px;color:#aab4c6}.admin-sidebar .active{background:#1c2740;color:#fff}.stat-card{padding:20px;display:flex;flex-direction:column}.stat-card>span{font-size:1.5rem}.stat-card strong{font-size:2rem}.stat-card small{color:#929db0}.module-ok{padding:12px;border-radius:12px;background:#0e1728;color:#bfe9da}.table{--bs-table-bg:transparent;--bs-table-color:#eef1f7;--bs-table-border-color:rgba(255,255,255,.07)}@media(min-width:768px){.game-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(min-width:1200px){.game-grid{grid-template-columns:repeat(9,minmax(0,1fr))}.game-card{min-height:160px}}@media(max-width:575.98px){.hero-section{min-height:auto}.display-3{font-size:2.45rem}.game-card{min-height:120px;padding:14px}.panel-card{padding:14px}.chat-messages{height:280px}.table th:nth-child(3),.table td:nth-child(3),.table th:nth-child(5),.table td:nth-child(5){display:none}} /* V2 Okey oyun masası */ .okey-page{min-height:calc(100vh - 58px);background:radial-gradient(circle at 50% 20%,#173d35 0,#071a18 55%,#050b12 100%)} .game-topbar{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:12px 16px} .turn-timer{min-width:66px;text-align:center;padding:8px 12px;border-radius:12px;background:#111827;border:1px solid var(--iz-border);font-weight:800;font-variant-numeric:tabular-nums} .okey-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:10px} .okey-main{min-width:0}.okey-side{padding:14px;max-height:calc(100vh - 112px);overflow:auto} .waiting-panel{padding:22px;min-height:360px}.waiting-players{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px} .waiting-player{display:flex;align-items:center;gap:12px;padding:14px;border:1px solid var(--iz-border);border-radius:16px;background:#0d1725}.waiting-player.ready{border-color:#22c55e;background:rgba(34,197,94,.08)}.waiting-player>span{margin-left:auto;font-size:1.4rem}.waiting-player small{display:block;color:#8f9bad} .player-avatar{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#6d5dfc,#16b7b4);font-weight:900;color:#fff;flex:0 0 auto} .okey-board{position:relative;min-height:600px;border-radius:28px;border:8px solid #4c2d17;background:radial-gradient(ellipse at center,#1e735e,#105040 65%,#0a372e);box-shadow:inset 0 0 70px rgba(0,0,0,.35),0 20px 60px rgba(0,0,0,.35);overflow:hidden} .opponent-zone{position:absolute;z-index:4}.opponent-zone.top{top:14px;left:50%;transform:translateX(-50%)}.opponent-zone.bottom{bottom:14px;left:50%;transform:translateX(-50%)}.opponent-zone.left{left:12px;top:50%;transform:translateY(-50%)}.opponent-zone.right{right:12px;top:50%;transform:translateY(-50%)} .player-seat{min-width:155px;display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:16px;background:rgba(4,15,20,.82);border:1px solid rgba(255,255,255,.13);backdrop-filter:blur(8px)}.player-seat.active-turn{border-color:#facc15;box-shadow:0 0 22px rgba(250,204,21,.32)}.player-seat .player-avatar{width:34px;height:34px}.player-seat-info{display:flex;flex-direction:column;min-width:0}.player-seat-info strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-seat-info small{color:#9fb4b2}.turn-badge{margin-left:auto;padding:3px 7px;border-radius:8px;background:#facc15;color:#111827;font-size:.7rem;font-weight:900} .board-center{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);display:flex;align-items:center;gap:24px;z-index:3}.indicator-box{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px;border-radius:16px;background:rgba(3,16,19,.72)} .stock-stack,.discard-slot{border:0;color:#fff;background:transparent;display:flex;flex-direction:column;align-items:center;gap:6px}.stock-stack>span{width:64px;height:86px;border-radius:10px;display:grid;place-items:center;background:repeating-linear-gradient(45deg,#253d77,#253d77 7px,#1a2b54 7px,#1a2b54 14px);border:3px solid #d8b66b;box-shadow:7px 7px 0 #16234a,12px 12px 0 #101a36;font-size:1.3rem;font-weight:900}.stock-stack:disabled,.discard-slot:disabled{opacity:.45} .table-meld-area{position:absolute;left:20%;right:20%;top:23%;bottom:23%;display:flex;align-items:center;justify-content:center;z-index:2;pointer-events:none}.meld-board{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;max-height:100%;overflow:auto}.table-meld{padding:6px;border-radius:10px;background:rgba(2,13,15,.7)}.table-meld>div{display:flex}.table-meld small{display:block;color:#b8cbc7;margin-bottom:3px} .rack-panel{margin-top:8px;padding:10px;border-radius:20px;background:linear-gradient(#4f2f1d,#2c180f);border:3px solid #795238;box-shadow:0 16px 30px rgba(0,0,0,.35)}.rack-toolbar{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:8px}.okey-rack{display:flex;align-items:flex-end;gap:3px;min-height:104px;padding:10px;overflow-x:auto;touch-action:pan-x;background:linear-gradient(#6e4329,#422516);border-radius:12px;scrollbar-width:thin} .okey-tile{position:relative;width:46px;height:68px;flex:0 0 46px;border:0;border-radius:8px;background:linear-gradient(145deg,#fffdf1,#ddd8c8);box-shadow:0 3px 5px rgba(0,0,0,.45);display:flex;flex-direction:column;align-items:center;justify-content:center;font-weight:900;transition:transform .12s,box-shadow .12s}.okey-tile>span{font-size:1.65rem;line-height:1}.okey-tile>small{font-size:.58rem;opacity:.65}.okey-tile.compact{width:36px;height:53px;flex-basis:36px}.okey-tile.compact>span{font-size:1.2rem}.okey-tile.selected{transform:translateY(-16px);box-shadow:0 9px 0 #facc15,0 15px 18px rgba(0,0,0,.4)}.okey-tile.empty{display:grid;place-items:center;color:#64748b;border:2px dashed rgba(255,255,255,.3);background:rgba(0,0,0,.18);box-shadow:none}.tile-red{color:#dc2626}.tile-yellow{color:#ca8a04}.tile-blue{color:#2563eb}.tile-black{color:#111827}.tile-fake{color:#7c3aed;background:linear-gradient(145deg,#fff7d6,#d8c98d)} .opening-groups{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0;padding:8px;border-radius:12px;background:rgba(0,0,0,.25)}.opening-group{display:flex;align-items:center;gap:7px;padding:6px;border-radius:10px;background:#111827}.opening-group>div{display:flex} .game-chat{height:330px}.game-info{display:grid;gap:6px}.game-info>div{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px solid rgba(255,255,255,.06)}.game-info dt{color:#8995a8;font-weight:500}.game-info dd{margin:0;font-weight:700;text-align:right} @media(max-width:991.98px){.okey-layout{grid-template-columns:1fr}.okey-side{max-height:none}.okey-board{min-height:520px}.game-chat{height:220px}} @media(max-width:575.98px){.game-topbar{align-items:flex-start}.okey-board{min-height:430px;border-width:5px;border-radius:20px}.player-seat{min-width:110px;padding:5px}.player-seat .player-avatar{width:28px;height:28px}.player-seat-info strong{font-size:.75rem}.player-seat-info small{font-size:.65rem}.turn-badge{display:none}.opponent-zone.top{top:6px}.opponent-zone.bottom{bottom:6px}.opponent-zone.left{left:4px}.opponent-zone.right{right:4px}.board-center{gap:8px}.stock-stack>span{width:45px;height:62px;box-shadow:4px 4px 0 #16234a,7px 7px 0 #101a36}.indicator-box{padding:5px}.okey-tile{width:39px;height:59px;flex-basis:39px}.okey-tile>span{font-size:1.35rem}.okey-tile.compact{width:30px;height:45px;flex-basis:30px}.table-meld-area{left:16%;right:16%;top:24%;bottom:24%}.rack-toolbar .btn{font-size:.72rem;padding:.35rem .5rem}.okey-rack{min-height:90px;padding:7px}.waiting-players{grid-template-columns:1fr}} .table-meld{border:1px solid rgba(255,255,255,.12);background:rgba(7,20,35,.62);color:inherit;border-radius:.8rem;padding:.45rem;text-align:left;transition:border-color .15s ease,box-shadow .15s ease,transform .15s ease} .table-meld:hover{transform:translateY(-1px);border-color:rgba(72,202,228,.65)} .table-meld.selected-meld{border-color:#48cae4;box-shadow:0 0 0 .18rem rgba(72,202,228,.2)} .table-meld>span{display:flex;flex-wrap:wrap;gap:.2rem;margin-top:.25rem} /* V3 board games */ .board-shell{min-height:72vh}.generic-board{min-height:420px;border-radius:1.25rem;padding:1rem;background:radial-gradient(circle at center,#1f5b43,#0b2e25 70%);overflow:auto}.players-bar{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:.5rem}.player-chip{padding:.65rem;border:1px solid rgba(255,255,255,.12);border-radius:.8rem;background:rgba(0,0,0,.25);display:flex;flex-direction:column}.player-chip.active{border-color:#38bdf8;box-shadow:0 0 0 2px rgba(56,189,248,.18)}.card-table{display:flex;min-height:390px;flex-direction:column;justify-content:space-between;gap:1.5rem}.trick-area,.pile-stack,.hand-area{display:flex;justify-content:center;align-items:center;gap:.45rem;flex-wrap:wrap}.playing-card{width:58px;height:86px;border-radius:.65rem;border:2px solid #e5e7eb;background:#fff;color:#111827;display:flex;flex-direction:column;justify-content:space-between;padding:.35rem;font-size:1.05rem;box-shadow:0 5px 14px rgba(0,0,0,.25)}.playing-card.red{color:#dc2626}.playing-card.selected{transform:translateY(-10px);outline:3px solid #38bdf8}.backgammon-board{display:grid;grid-template-columns:repeat(12,minmax(42px,1fr));gap:.35rem;background:#7c4a25;padding:1rem;border:8px solid #4a2c16;border-radius:1rem}.backgammon-point{min-height:120px;border:0;border-radius:.5rem;background:rgba(255,255,255,.16);color:#fff;display:flex;flex-direction:column;justify-content:space-between;padding:.35rem}.backgammon-point:nth-child(odd){background:rgba(10,10,10,.3)}.backgammon-point.owner-1 span{color:#93c5fd}.backgammon-point.owner-2 span{color:#fecaca}.checkers-board,.chess-board{display:grid;grid-template-columns:repeat(8,minmax(38px,70px));justify-content:center;max-width:600px;margin:auto;border:7px solid #342218}.board-square{aspect-ratio:1/1;border:0;background:#ead4aa;color:#111827;font-size:clamp(1.35rem,5vw,3rem);display:grid;place-items:center}.board-square.dark{background:#805c3b}.board-square.selected{outline:4px solid #38bdf8;outline-offset:-4px}.game-controls{display:flex;flex-wrap:wrap;gap:.5rem}.player-seat{height:100%;padding:.8rem;border:1px solid rgba(255,255,255,.12);border-radius:.75rem;display:flex;flex-direction:column}.player-seat.ready{border-color:#22c55e}@media(max-width:767px){.generic-board{min-height:360px;padding:.5rem}.playing-card{width:45px;height:70px;font-size:.86rem}.backgammon-board{grid-template-columns:repeat(6,minmax(38px,1fr));padding:.5rem}.backgammon-point{min-height:80px}.board-shell{min-height:auto}} .shop-card{border:1px solid rgba(255,255,255,.1);border-radius:1rem;padding:1rem;background:rgba(255,255,255,.035)}.shop-preview{display:grid;place-items:center;min-height:86px;font-size:2.6rem;border-radius:.8rem;background:radial-gradient(circle at top,#23304a,#0b1020);margin-bottom:1rem}.locale-switch .btn{min-width:40px}.health-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:.75rem} /* V4.2 presence ve yeniden bağlantı */ .presence-dot{display:inline-block;width:.55rem;height:.55rem;border-radius:50%;background:#22c55e;box-shadow:0 0 .65rem rgba(34,197,94,.75);margin-right:.35rem} .reconnect-banner{position:sticky;top:56px;z-index:1025;background:linear-gradient(90deg,#7c2d12,#92400e);border-bottom:1px solid rgba(255,255,255,.18);padding:.55rem 0;color:#fff;box-shadow:0 .4rem 1rem rgba(0,0,0,.22)} .reconnect-banner .btn{white-space:nowrap} @media(max-width:575.98px){.reconnect-banner{top:55px;font-size:.875rem}.reconnect-banner .container-xl{align-items:stretch!important}.reconnect-banner .btn{width:100%}} .waiting-player.offline,.player-seat.offline{opacity:.58;filter:saturate(.45)} .waiting-player.offline .player-avatar{box-shadow:0 0 0 2px rgba(239,68,68,.45)} /* V4.4 mobile game usability */ .dot.offline{background:#ef4444;box-shadow:0 0 0 3px rgba(239,68,68,.16)} .okey-rack.two-rows{display:grid;grid-template-rows:repeat(2,auto);grid-auto-flow:column;grid-auto-columns:46px;align-content:center;justify-content:start;overflow-x:auto;overflow-y:hidden} .okey-rack .okey-tile{touch-action:none;user-select:none;-webkit-user-select:none} .okey-rack .okey-tile.dragging{opacity:.72;transform:translateY(-12px) scale(1.04);z-index:5;outline:3px solid #38bdf8} .backgammon-point.selected{outline:4px solid #38bdf8;outline-offset:-4px} .player-chip.offline{opacity:.6;border-style:dashed} #okeyApp:fullscreen,#genericGame:fullscreen{overflow:auto;background:#071119;padding:.5rem} #okeyApp:fullscreen .okey-side,#genericGame:fullscreen .chat-panel{max-height:none} @media(max-width:575.98px){ .okey-rack.two-rows{grid-auto-columns:39px;min-height:140px} .game-topbar .connection-status{width:100%;order:5} #wakeLockButton,#fullscreenButton{font-size:.7rem;padding:.32rem .5rem} .chess-board,.checkers-board{width:min(96vw,520px)} .board-square{font-size:clamp(1.25rem,8vw,2.5rem)} .card-table{min-height:310px}.hand-area{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;padding:.8rem 0} } @media(orientation:landscape) and (max-height:600px){ .okey-page{min-height:100vh}.okey-board{min-height:330px}.okey-side{max-height:calc(100vh - 80px)} .rack-panel{position:sticky;bottom:0;z-index:20}.okey-rack{min-height:76px}.okey-tile{width:36px;height:54px;flex-basis:36px}.okey-tile>span{font-size:1.2rem} .board-shell{min-height:auto}.generic-board{min-height:270px}.chat-panel{max-height:65vh;overflow:auto} } .acceptance-check{display:flex;gap:.65rem;align-items:flex-start;padding:.65rem;border:1px solid rgba(255,255,255,.1);border-radius:.75rem;background:rgba(255,255,255,.025)}.acceptance-check>span{width:1.5rem;height:1.5rem;border-radius:50%;display:grid;place-items:center;font-weight:800}.acceptance-check strong,.acceptance-check small{display:block}.acceptance-check small{color:#94a3b8}.acceptance-check.status-pass>span{background:#166534;color:#dcfce7}.acceptance-check.status-warn>span{background:#854d0e;color:#fef3c7}.acceptance-check.status-fail>span{background:#991b1b;color:#fee2e2} /* V4.4 accessibility and multi-device control */ .game-high-contrast .panel-card,.game-high-contrast .okey-board,.game-high-contrast .generic-board{border:2px solid #fff!important;box-shadow:0 0 0 2px #000!important} .game-high-contrast .okey-tile,.game-high-contrast .playing-card,.game-high-contrast .board-square{filter:contrast(1.35) saturate(1.2);outline:1px solid currentColor} .game-reduced-motion *,@media (prefers-reduced-motion:reduce){.okey-tile,.playing-card,.board-square,.player-seat,.game-card{transition:none!important;animation:none!important;scroll-behavior:auto!important}} .okey-tile:focus-visible,.playing-card:focus-visible,.board-square:focus-visible{outline:3px solid #38bdf8!important;outline-offset:2px;z-index:3} .control-device-notice{position:fixed;inset:auto 1rem 1rem;z-index:1080;max-width:520px;margin:auto} /* V5.2 mobil viewport ve safe-area uyumluluğu */ body{padding-left:env(safe-area-inset-left,0);padding-right:env(safe-area-inset-right,0)} .okey-page,.board-shell{min-height:var(--iznel-viewport-height,100dvh)} .game-topbar{padding-top:max(12px,env(safe-area-inset-top,0));padding-left:max(16px,env(safe-area-inset-left,0));padding-right:max(16px,env(safe-area-inset-right,0))} .rack-panel{padding-bottom:max(10px,env(safe-area-inset-bottom,0))} @supports not (height:100dvh){body,.okey-page,.board-shell{min-height:var(--iznel-viewport-height,100vh)}} /* V5.6 botlar ve birleşik mouse/dokunmatik sürükleme */ .bot-badge{display:inline-flex;align-items:center;gap:.15rem;margin-inline-start:.25rem;padding:.08rem .35rem;border-radius:999px;background:rgba(56,189,248,.2);border:1px solid rgba(56,189,248,.55);color:#bae6fd;font-size:.62rem;font-weight:800;vertical-align:middle} .draggable-piece,.hand-card,.okey-rack .okey-tile{touch-action:none;user-select:none;-webkit-user-select:none;cursor:grab} .draggable-piece:active,.hand-card:active,.okey-rack .okey-tile:active{cursor:grabbing} .drag-source{opacity:.42!important;outline:3px solid #38bdf8!important;outline-offset:2px;transform:scale(.97)} .drag-ghost{position:fixed!important;left:0!important;top:0!important;z-index:99999!important;pointer-events:none!important;margin:0!important;opacity:.9!important;transform-origin:top left;box-shadow:0 18px 38px rgba(0,0,0,.55)!important} .drop-target-active{outline:4px solid #22c55e!important;outline-offset:-4px;box-shadow:0 0 0 5px rgba(34,197,94,.22)!important} .game-drop-zone{min-height:96px;border:2px dashed rgba(255,255,255,.2);border-radius:1rem;padding:.65rem;transition:outline-color .12s,background-color .12s} .backgammon-off{margin-top:.75rem;min-height:54px;display:grid;place-items:center;border:2px dashed rgba(255,255,255,.28);border-radius:.75rem;color:#cbd5e1;background:rgba(0,0,0,.16)} .table-meld{touch-action:none} @media (pointer:coarse){.playing-card,.okey-tile,.board-square,.backgammon-point{min-touch-target-size:44px}.game-drop-zone{min-height:110px}} /* V5.6 draw source gestures */ .draggable-draw-source{touch-action:none;user-select:none;-webkit-user-select:none} .okey-rack[data-tile-drop="rack"]{transition:outline-color .15s ease,box-shadow .15s ease} .okey-rack[data-tile-drop="rack"].drop-target-active{outline:3px solid currentColor;outline-offset:3px;box-shadow:0 0 0 .25rem rgba(255,255,255,.12)} .draw-source-ghost{opacity:.82;pointer-events:none;z-index:9999} .bot-activity{min-height:1.4rem}.training-badge{background:#5b21b6;color:#fff}.drop-target-active:focus-visible,.draggable-piece:focus-visible,[data-tile-id]:focus-visible{outline:3px solid currentColor;outline-offset:3px} /* V6.5 R4 profesyonel yönetim merkezi */ .admin-body{--admin-sidebar:282px;background:radial-gradient(circle at 82% 0,rgba(51,65,170,.18),transparent 34%),#070b14;color:#eef2ff;min-height:100vh} .admin-topbar{position:fixed;inset:0 0 auto 0;z-index:1040;height:72px;display:flex;align-items:center;gap:16px;padding:0 22px;background:rgba(7,11,20,.92);border-bottom:1px solid rgba(148,163,184,.14);backdrop-filter:blur(18px)} .admin-brand{display:flex;align-items:center;gap:12px;color:#fff;text-decoration:none}.admin-brand>span{width:40px;height:40px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(135deg,#7c3aed,#2563eb);font-size:1.35rem;font-weight:900;box-shadow:0 10px 30px rgba(79,70,229,.35)}.admin-brand div{display:flex;flex-direction:column;line-height:1.15}.admin-brand small{color:#8e9bb1;font-size:.72rem;margin-top:4px}.admin-top-actions{margin-left:auto;display:flex;align-items:center;gap:8px}.admin-top-actions form{margin:0}.admin-menu-button{font-size:1.35rem;color:#fff;border:1px solid rgba(255,255,255,.15)} .admin-shell{min-height:100vh;padding-top:72px}.admin-sidebar{position:fixed!important;top:72px;bottom:0;left:0;width:var(--admin-sidebar)!important;background:#090f1c;border-right:1px solid rgba(148,163,184,.14);z-index:1035;overflow:hidden}.admin-sidebar .offcanvas-body{display:flex;flex-direction:column;padding:20px 16px;overflow-y:auto}.admin-profile{display:flex;align-items:center;gap:12px;padding:13px;border:1px solid rgba(148,163,184,.12);border-radius:16px;background:rgba(30,41,59,.55);margin-bottom:18px}.admin-avatar{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,#0ea5e9,#6d28d9);font-weight:900}.admin-profile>div:last-child{min-width:0;display:flex;flex-direction:column}.admin-profile strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.admin-profile small{color:#94a3b8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.72rem} .admin-nav{display:flex;flex-direction:column;gap:5px}.admin-nav>a{display:flex;align-items:center;gap:11px;padding:10px 12px;border:1px solid transparent;border-radius:13px;color:#aeb9ca;text-decoration:none;transition:.16s}.admin-nav>a>span{width:28px;text-align:center;font-size:1.1rem}.admin-nav>a>div{display:flex;flex-direction:column;min-width:0}.admin-nav>a strong{font-size:.88rem;color:inherit}.admin-nav>a small{font-size:.68rem;color:#65738a}.admin-nav>a:hover{background:rgba(51,65,85,.42);color:#fff}.admin-nav>a.active{background:linear-gradient(100deg,rgba(99,102,241,.25),rgba(14,165,233,.12));border-color:rgba(99,102,241,.38);color:#fff}.admin-nav>a.active small{color:#a5b4fc}.admin-sidebar-foot{margin-top:auto;padding:18px 12px 4px;color:#7f8ca3;font-size:.75rem}.status-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#22c55e;box-shadow:0 0 10px #22c55e;margin-right:7px} .admin-main{margin-left:var(--admin-sidebar);min-height:calc(100vh - 72px)}.admin-content{width:min(1560px,100%);margin:auto;padding:28px}.admin-alert{border-radius:14px}.admin-page-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:24px}.admin-page-head h1{font-size:clamp(1.55rem,2.4vw,2.25rem);margin:.18rem 0 .35rem}.admin-page-head p{margin:0;color:#8f9bb0}.admin-eyebrow{font-size:.73rem;letter-spacing:.13em;text-transform:uppercase;color:#7dd3fc;font-weight:800}.admin-body .panel-card{background:linear-gradient(145deg,rgba(17,25,42,.96),rgba(10,16,29,.96));border-color:rgba(148,163,184,.13);border-radius:18px;box-shadow:0 15px 38px rgba(0,0,0,.15)} .admin-stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.admin-stat-grid .stat-card{position:relative;min-width:0;border-radius:18px;background:linear-gradient(145deg,#121b2d,#0c1321);border:1px solid rgba(148,163,184,.13);overflow:hidden}.admin-stat-grid .stat-card:after{content:"";position:absolute;width:90px;height:90px;right:-42px;top:-42px;border-radius:50%;background:rgba(99,102,241,.13)}.admin-stat-grid .stat-card>span{font-size:1.25rem}.admin-stat-grid .stat-card strong{font-size:1.65rem;margin-top:8px}.admin-stat-grid .stat-card small{font-weight:700;color:#c6d0df}.admin-stat-grid .stat-card em{font-style:normal;font-size:.7rem;color:#68778e;margin-top:3px}.admin-license-pill{display:flex;align-items:center;gap:9px;padding:9px 14px;border-radius:14px;background:#0e1728;border:1px solid rgba(148,163,184,.14)}.admin-license-pill>span{width:9px;height:9px;border-radius:50%}.admin-license-pill.ok>span{background:#22c55e;box-shadow:0 0 10px #22c55e}.admin-license-pill.warn>span{background:#f59e0b}.admin-license-pill div{display:flex;flex-direction:column;line-height:1.1}.admin-license-pill small{color:#7f8ba0;font-size:.65rem}.admin-license-pill strong{text-transform:uppercase;font-size:.75rem;margin-top:3px} .admin-quick-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.admin-quick-grid>a{display:flex;align-items:center;gap:12px;padding:14px;border:1px solid rgba(148,163,184,.12);border-radius:15px;background:rgba(15,23,42,.62);color:#e9eef8;text-decoration:none;transition:.17s}.admin-quick-grid>a:hover{transform:translateY(-2px);border-color:rgba(96,165,250,.45);background:rgba(30,41,59,.75)}.admin-quick-grid>a>span{font-size:1.35rem}.admin-quick-grid>a>div{display:flex;flex-direction:column;min-width:0}.admin-quick-grid small{color:#7e8ba0;font-size:.72rem}.admin-quick-grid b{margin-left:auto;color:#60a5fa}.admin-timeline>div{position:relative;padding:0 0 17px 22px;border-left:1px solid rgba(148,163,184,.18);display:flex;flex-direction:column}.admin-timeline>div>span{position:absolute;left:-5px;top:3px;width:9px;height:9px;border-radius:50%;background:#6366f1}.admin-timeline strong{font-size:.84rem}.admin-timeline small{color:#6f7d92;font-size:.7rem;margin-top:2px} .admin-game-icon{width:48px;height:48px;display:grid;place-items:center;border-radius:15px;background:linear-gradient(135deg,rgba(14,165,233,.25),rgba(124,58,237,.25));font-size:1.5rem}.admin-inline-form{display:grid;grid-template-columns:minmax(120px,1.4fr) repeat(4,minmax(70px,.55fr)) minmax(95px,.8fr) auto;gap:7px;align-items:center;min-width:760px}.admin-sticky-card{position:sticky;top:92px}.admin-table{font-size:.85rem}.admin-table td,.admin-table th{padding:.8rem .65rem}.admin-wallet-form{min-width:180px}.admin-scroll-list{max-height:540px;overflow:auto;padding-right:3px}.admin-list-item{display:flex;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid rgba(148,163,184,.11)}.admin-list-item form{min-width:185px}.admin-setting-row{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px;border:1px solid rgba(148,163,184,.12);border-radius:14px;background:rgba(15,23,42,.55)}.admin-setting-row>div:first-child{display:flex;flex-direction:column}.admin-setting-row small{color:#7c899e;font-size:.72rem}.admin-setting-row .form-check-input{width:2.75em;height:1.4em}.admin-payload{max-width:420px;word-break:break-word} @media(max-width:1199.98px){.admin-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-inline-form{grid-template-columns:repeat(3,minmax(120px,1fr))}.admin-inline-form button{width:max-content}} @media(max-width:991.98px){.admin-topbar{height:64px;padding:0 12px}.admin-shell{padding-top:64px}.admin-sidebar{top:0;bottom:0;width:min(320px,88vw)!important}.admin-main{margin-left:0}.admin-content{padding:20px 14px}.admin-brand small{display:none}.admin-profile{margin-top:8px}.admin-sticky-card{position:static}.admin-page-head{align-items:flex-start}.admin-top-actions .btn-outline-light{display:none}} @media(max-width:767.98px){.admin-page-head{flex-direction:column}.admin-page-head form{width:100%}.admin-page-head form .form-control{min-width:0}.admin-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.admin-quick-grid{grid-template-columns:1fr}.admin-inline-form{grid-template-columns:repeat(2,minmax(120px,1fr))}.admin-list-item{align-items:flex-start;flex-direction:column}.admin-list-item form{width:100%}.admin-table th:nth-child(n),.admin-table td:nth-child(n){display:table-cell!important}.admin-table{min-width:760px}.admin-brand strong{font-size:.88rem}} @media(max-width:420px){.admin-stat-grid{grid-template-columns:1fr 1fr}.admin-stat-grid .stat-card{padding:15px}.admin-top-actions .btn-danger{padding:.25rem .5rem}.admin-brand>span{width:36px;height:36px}.admin-content{padding:16px 10px}} /* V6 training coach */ .training-coach{border-left:4px solid var(--bs-info);background:rgba(13,202,240,.12)} .training-coach .progress{height:.45rem;background:rgba(255,255,255,.12)} .training-coach .coach-steps{display:flex;flex-wrap:wrap;gap:.35rem} .training-coach .badge{white-space:normal;text-align:left} /* V6.5 R7 - Düz Okey profesyonel ses sistemi */ .okey-sound-control{position:relative}.sound-panel{position:absolute;right:0;top:calc(100% + 8px);z-index:1200;width:min(290px,calc(100vw - 24px));padding:12px;border:1px solid rgba(255,255,255,.18);border-radius:14px;background:rgba(7,18,25,.98);box-shadow:0 18px 45px rgba(0,0,0,.5);backdrop-filter:blur(12px)}.sound-options{display:grid;gap:6px;font-size:.82rem}.sound-options label{display:flex;align-items:center;gap:8px;padding:5px 7px;border-radius:8px;background:rgba(255,255,255,.05)}.sound-options input{accent-color:#22c55e}.sound-panel .form-range{accent-color:#22c55e}@media(max-width:575.98px){.sound-panel{position:fixed;left:12px;right:12px;top:auto;bottom:12px;width:auto}} /* V6.5 R9 — Düz Okey Premium Masa */ .okey-premium{--felt:#07502f;--felt-dark:#022d1d;--gold:#f6b52d;--cream:#fff7d9;--wood:#8d4d20;--wood2:#c47a36;background:#020b08;color:#fff;overflow-x:hidden} .okey-premium .okey-stage{position:relative;width:min(100%,1180px);min-height:calc(100dvh - 58px);margin:auto;padding:10px 12px 14px;background:radial-gradient(circle at 50% 40%,#0b6a41 0,#06452c 48%,#012719 100%);box-shadow:0 0 70px #000} .okey-hud{position:relative;z-index:40;display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:8px}.hud-stakes,.hud-actions{display:flex;align-items:center;gap:8px}.hud-stakes{padding:6px 10px;border:1px solid rgba(255,255,255,.18);border-radius:14px;background:rgba(0,20,13,.78);box-shadow:inset 0 1px rgba(255,255,255,.08)}.hud-stakes>div{display:flex;flex-direction:column;min-width:72px}.hud-stakes small{color:#ddd;font-size:.72rem}.hud-stakes strong{color:#ffc85a;font-size:1.05rem}.hud-menu,.hud-icon{border:1px solid rgba(255,255,255,.25);background:rgba(0,22,14,.82);color:#fff;border-radius:12px}.hud-menu{display:grid;place-items:center;width:42px;height:42px;text-decoration:none;font-size:1.45rem}.hud-mode{padding:5px 9px;border-radius:20px;background:#1b733f;font-weight:800;font-size:.72rem}.hud-actions{justify-content:flex-end;flex-wrap:wrap}.hud-icon{min-width:58px;height:54px;display:flex;flex-direction:column;justify-content:center;align-items:center;line-height:1}.hud-icon span{font-size:1.25rem}.hud-icon small{margin-top:4px;font-size:.65rem}.hud-icon:hover{border-color:#ffca4b;transform:translateY(-1px)}.connection-status{background:rgba(0,0,0,.38);padding:6px 9px;border-radius:10px}.turn-timer{display:grid;place-items:center;min-width:48px;height:48px;border-radius:50%;border:4px solid #38a95c;background:#071d12;color:#fff;font-weight:900} .premium-table-wrap{position:relative}.premium-waiting{padding:28px;border:1px solid rgba(255,255,255,.15);border-radius:20px;background:rgba(0,20,13,.78);text-align:center}.waiting-actions{display:flex;gap:8px;justify-content:center;margin-top:18px}.waiting-actions button,.premium-toolbar button,.quick-actions button,.quick-chat button{border:1px solid rgba(255,255,255,.16);border-radius:10px;background:linear-gradient(#237440,#10502c);color:#fff;font-weight:800;padding:9px 14px} .okey-premium .premium-board{min-height:560px;border:2px solid rgba(255,255,255,.16);border-radius:30px;background:radial-gradient(ellipse at center,#117044 0,#075332 58%,#033821 100%);box-shadow:inset 0 0 80px rgba(0,0,0,.48),0 20px 45px rgba(0,0,0,.38);overflow:hidden}.felt-grain{position:absolute;inset:0;opacity:.14;pointer-events:none;background-image:repeating-radial-gradient(circle at 20% 30%,rgba(255,255,255,.14) 0 1px,transparent 1px 4px);mix-blend-mode:overlay}.opponent-rack{position:absolute;background:linear-gradient(90deg,#4d260f,#a65b24 18%,#d18b45 50%,#8d491d 82%,#3d1c0b);border:5px solid #5d3116;box-shadow:0 8px 15px rgba(0,0,0,.45),inset 0 2px rgba(255,255,255,.18);border-radius:8px;opacity:.98}.opponent-rack.horizontal{width:310px;height:46px;left:50%;top:58px;transform:translateX(-50%)}.opponent-rack.vertical{width:46px;height:245px;top:50%;transform:translateY(-50%)}.opponent-zone.left .opponent-rack{left:30px}.opponent-zone.right .opponent-rack{right:30px}.okey-premium .opponent-zone.top{top:8px}.okey-premium .opponent-zone.bottom{bottom:8px}.okey-premium .opponent-zone.left{left:8px}.okey-premium .opponent-zone.right{right:8px}.okey-premium .player-seat{position:relative;min-width:175px;height:auto;flex-direction:row;padding:7px 10px;border:1px solid rgba(255,255,255,.24);border-radius:42px 13px 13px 42px;background:linear-gradient(90deg,rgba(0,0,0,.9),rgba(0,18,10,.86));box-shadow:0 8px 20px rgba(0,0,0,.38)}.okey-premium .player-seat .player-avatar{display:grid;place-items:center;width:46px;height:46px;border:2px solid #fff;border-radius:50%;background:linear-gradient(145deg,#fff,#cfd7d2);color:#133626;font-weight:900;font-size:1.1rem}.okey-premium .player-seat.active-turn{border-color:#7cff66;box-shadow:0 0 0 3px rgba(95,255,91,.26),0 0 25px rgba(88,255,99,.52)}.okey-premium .player-seat-info small{color:#f4bd55}.okey-premium .board-center{gap:13px}.stock-ring{padding:8px;border-radius:50%;background:conic-gradient(#54c16b 0 65%,#163b25 65%);box-shadow:0 0 22px rgba(79,246,110,.22)}.okey-premium .stock-stack{border-radius:50%;width:74px;height:74px;box-shadow:none;background:#092817}.okey-premium .stock-stack>span{width:auto;height:auto;background:none;box-shadow:none;font-size:1.8rem}.okey-premium .indicator-box,.okey-premium .discard-slot{background:rgba(0,25,15,.62);border:1px solid rgba(255,255,255,.18);border-radius:14px}.okey-premium .table-meld-area{z-index:2} .okey-premium .premium-rack{position:relative;z-index:12;margin-top:-20px;padding:13px 15px 10px;border:7px solid #3e210f;border-radius:15px;background:linear-gradient(#bb7135 0,#8b4c20 48%,#5e3015 49%,#9d5a28 100%);box-shadow:0 18px 35px rgba(0,0,0,.48),inset 0 2px rgba(255,255,255,.22)}.okey-premium .okey-rack{min-height:190px;display:flex;align-content:flex-start;flex-wrap:wrap;gap:4px;padding:7px 10px;background:repeating-linear-gradient(0deg,transparent 0 84px,rgba(52,22,8,.5) 85px 91px);border-radius:7px;overflow-x:auto}.okey-premium .okey-tile{width:50px;height:79px;flex-basis:50px;border:1px solid #d9ceb1;border-radius:7px;background:linear-gradient(145deg,#fffbe9,#e8dfc1);box-shadow:0 4px 6px rgba(0,0,0,.42),inset 1px 1px rgba(255,255,255,.9);color:#141414}.okey-premium .okey-tile>span{font-size:1.7rem}.okey-premium .okey-tile.selected{transform:translateY(-12px);box-shadow:0 0 0 3px #73ff78,0 8px 15px rgba(0,0,0,.45)}.premium-toolbar{margin-top:8px}.premium-toolbar,.toolbar-left,.toolbar-right{display:flex;gap:7px;justify-content:space-between;flex-wrap:wrap}.premium-toolbar button{padding:7px 10px;font-size:.76rem}.premium-toolbar .danger{background:linear-gradient(#e74b46,#9f1717)}.premium-toolbar .success{background:linear-gradient(#49a94b,#17651f)} .premium-flyout{position:absolute;z-index:100;right:14px;top:72px;width:min(360px,calc(100% - 28px));padding:18px;border:1px solid rgba(255,255,255,.32);border-radius:16px;background:rgba(0,28,14,.97);box-shadow:0 25px 70px rgba(0,0,0,.65)}.flyout-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.flyout-close,.mini-toggle,.premium-small-button{border:1px solid rgba(255,255,255,.25);border-radius:9px;background:#154d2b;color:#fff;padding:6px 9px}.settings-row{display:flex;align-items:center;gap:12px;width:100%;padding:13px 10px;border:0;border-bottom:1px solid rgba(255,255,255,.15);background:transparent;color:#fff;text-align:left}.settings-row span{font-size:1.5rem}.settings-row.danger{color:#ff8d8d}.premium-chat{position:fixed;z-index:120;inset:58px 0 0 auto;width:min(560px,100%);display:flex;flex-direction:column;padding:12px;background:rgba(4,53,29,.98);box-shadow:-20px 0 50px rgba(0,0,0,.5)}.chat-tabs{display:flex}.chat-tabs button{flex:1;border:1px solid rgba(255,255,255,.2);background:#1b5b32;color:#fff;padding:12px;font-weight:900}.chat-tabs button.active{background:#50ad42}.premium-chat .game-chat{flex:1;height:auto;min-height:240px;padding:12px;background:rgba(255,255,255,.05)}.premium-chat form{display:flex;gap:7px}.premium-chat input{flex:1;border:0;border-radius:10px;padding:12px}.premium-chat form button{border:0;border-radius:10px;background:#47a947;color:#fff;padding:0 18px;font-weight:900}.quick-chat{display:grid;grid-template-columns:repeat(2,1fr);gap:7px;margin:9px 0}.premium-footer{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 3px 0}.quick-actions{display:flex;gap:6px}.quick-actions button{font-size:.72rem;padding:7px 9px}.game-meta{display:flex;gap:10px;color:#d7e3dc;font-size:.72rem}.bot-activity{position:absolute;z-index:30;left:50%;top:82px;transform:translateX(-50%);color:#aef8c4}.premium-footer .training-coach,.premium-footer .alert{margin:0} @media(min-width:992px){.okey-premium .okey-stage{width:min(100%,980px)}.okey-premium .premium-board{min-height:610px}.okey-premium .premium-rack{margin-top:10px}.okey-premium .okey-rack{min-height:195px}.premium-chat{right:max(0px,calc((100vw - 980px)/2));top:58px;height:calc(100dvh - 58px)}} @media(max-width:991.98px) and (orientation:landscape){body:has(.okey-premium){overflow:hidden}.okey-premium{position:fixed;inset:0;z-index:1050;min-height:100dvh}.okey-premium .okey-stage{width:100%;height:100dvh;min-height:0;padding:5px 7px;display:flex;flex-direction:column}.okey-hud{margin-bottom:3px}.hud-stakes{padding:3px 6px}.hud-stakes>div{min-width:58px}.hud-stakes strong{font-size:.84rem}.hud-menu{width:34px;height:34px}.hud-icon{min-width:44px;height:38px}.hud-icon span{font-size:1rem}.hud-icon small{display:none}.connection-status{display:none}.turn-timer{width:38px;height:38px;min-width:38px;font-size:.75rem}.premium-table-wrap{flex:1;min-height:0}.okey-premium .premium-board{height:calc(100dvh - 198px);min-height:310px;border-radius:17px}.opponent-rack.horizontal{width:240px;height:30px;top:42px}.opponent-rack.vertical{height:155px;width:30px}.okey-premium .player-seat{min-width:125px;padding:3px 6px}.okey-premium .player-seat .player-avatar{width:32px;height:32px}.okey-premium .player-seat-info strong{font-size:.72rem}.okey-premium .player-seat-info small{font-size:.58rem}.okey-premium .premium-rack{margin-top:-15px;padding:7px 9px 5px;border-width:5px}.okey-premium .okey-rack{min-height:112px;height:112px;flex-wrap:wrap;gap:2px;padding:4px;background:repeating-linear-gradient(0deg,transparent 0 50px,rgba(52,22,8,.5) 51px 55px)}.okey-premium .okey-tile{width:34px;height:51px;flex-basis:34px}.okey-premium .okey-tile>span{font-size:1.05rem}.premium-toolbar{margin-top:3px}.premium-toolbar button{font-size:.58rem;padding:4px 6px}.premium-footer{padding-top:3px}.quick-actions button{font-size:.56rem;padding:4px 7px}.game-meta{display:none}.premium-chat{inset:0 0 0 auto;height:100dvh}.premium-flyout{top:48px}.board-center{transform:translate(-50%,-45%) scale(.78)}} @media(max-width:700px) and (orientation:portrait){.okey-hud{align-items:flex-start}.hud-actions{max-width:190px}.hud-icon{min-width:44px;height:44px}.hud-icon small{display:none}.connection-status{display:none}.okey-premium .premium-board{min-height:480px}.opponent-rack.horizontal{width:180px}.opponent-rack.vertical{height:170px}.okey-premium .player-seat{min-width:112px}.okey-premium .premium-rack{margin-top:7px}.okey-premium .okey-rack{min-height:150px}.okey-premium .okey-tile{width:39px;height:60px;flex-basis:39px}.okey-premium .okey-tile>span{font-size:1.25rem}.premium-footer{flex-direction:column}.game-meta{flex-wrap:wrap;justify-content:center}} /* V6.5 R11 - Duz Okey profesyonel dinamik 30 haneli istaka */ .okey-premium .premium-rack{background:linear-gradient(180deg,#d4924d 0,#9d5728 7%,#6b3518 11%,#a65f2d 48%,#5a2b13 52%,#9a5528 91%,#49210e 100%);border-color:#2a1308;box-shadow:0 22px 45px rgba(0,0,0,.58),inset 0 3px 0 rgba(255,224,172,.3),inset 0 -5px 12px rgba(28,10,2,.65)} .rack-instruction{display:flex;justify-content:space-between;gap:10px;margin:0 4px 7px;color:#ffe6b3;font-size:.72rem;font-weight:800;text-shadow:0 1px 2px #000}.rack-instruction span:last-child{color:#baffad} .okey-premium .okey-rack.dynamic-rack{display:grid!important;grid-template-columns:repeat(15,minmax(0,1fr));grid-template-rows:repeat(2,minmax(76px,1fr));grid-auto-flow:row;width:100%;height:auto;min-height:174px;gap:3px;padding:7px 9px;overflow:visible;touch-action:none;background:repeating-linear-gradient(0deg,rgba(55,23,7,.08) 0 78px,rgba(42,15,4,.62) 79px 86px),linear-gradient(90deg,rgba(255,255,255,.06),transparent 12%,transparent 88%,rgba(0,0,0,.2));box-shadow:inset 0 4px 10px rgba(32,11,2,.55),inset 0 -2px rgba(255,204,133,.15)} .okey-premium .rack-slot{position:relative;display:flex;align-items:flex-end;justify-content:center;min-width:0;min-height:76px;border-radius:6px;transition:background .12s,box-shadow .12s,transform .12s} .okey-premium .rack-slot.empty{background:linear-gradient(180deg,rgba(255,218,162,.035),rgba(39,13,3,.08));box-shadow:inset 0 0 0 1px rgba(255,221,174,.055)} .okey-premium .rack-slot.empty:hover,.okey-premium .rack-slot.drop-target-active{background:rgba(70,255,100,.17);box-shadow:inset 0 0 0 2px #73ff78,0 0 18px rgba(67,255,91,.38);transform:translateY(-2px)} .okey-premium .rack-slot-marker{width:62%;height:4px;border-radius:99px;background:rgba(255,226,184,.08);margin-bottom:5px} .okey-premium .rack-slot .okey-tile{width:100%;max-width:52px;height:76px;flex-basis:auto;margin:0;cursor:grab;will-change:transform;touch-action:none} .okey-premium .rack-slot .okey-tile:active{cursor:grabbing} .okey-premium .rack-slot .okey-tile:hover{transform:translateY(-5px);filter:brightness(1.04)} .okey-premium .rack-slot .okey-tile.selected{transform:translateY(-10px)} .premium-tile-ghost{opacity:.96!important;filter:drop-shadow(0 20px 18px rgba(0,0,0,.52));transition:none!important} .discard-drop-halo{position:absolute;z-index:7;left:50%;top:58%;transform:translate(-50%,-50%);width:180px;height:88px;border:2px dashed rgba(117,255,126,.55);border-radius:18px;display:flex;align-items:center;justify-content:center;text-align:center;padding:12px;color:rgba(206,255,207,.72);font-size:.66rem;font-weight:900;letter-spacing:.04em;background:rgba(0,63,22,.18);opacity:.32;transition:.15s;pointer-events:auto} .discard-drop-halo.drop-target-active{opacity:1;transform:translate(-50%,-50%) scale(1.08);color:#fff;background:rgba(20,147,50,.58);box-shadow:0 0 0 7px rgba(89,255,109,.12),0 0 36px rgba(73,255,94,.55)} @media(max-width:991.98px) and (orientation:landscape){.rack-instruction{display:none}.okey-premium .okey-rack.dynamic-rack{grid-template-rows:repeat(2,minmax(47px,1fr));min-height:104px;height:104px;gap:2px;padding:3px 5px}.okey-premium .rack-slot{min-height:47px}.okey-premium .rack-slot .okey-tile{height:47px;max-width:34px}.okey-premium .rack-slot .okey-tile>span{font-size:1rem}.okey-premium .rack-slot .okey-tile>small{font-size:.44rem}.discard-drop-halo{top:55%;width:130px;height:58px;font-size:.52rem}} @media(max-width:700px) and (orientation:portrait){.okey-premium .okey-rack.dynamic-rack{grid-template-columns:repeat(15,42px);grid-template-rows:repeat(2,62px);min-height:134px;overflow-x:auto;overflow-y:hidden}.okey-premium .rack-slot{min-height:62px}.okey-premium .rack-slot .okey-tile{height:60px;max-width:40px}} /* V6.5 R12 - Duz Okey gercek dort renkli tas sistemi */ .okey-premium .okey-tile.tile-red,.okey-premium .okey-tile[data-tile-color="red"]{color:#d62828!important} .okey-premium .okey-tile.tile-yellow,.okey-premium .okey-tile[data-tile-color="yellow"]{color:#d59a00!important} .okey-premium .okey-tile.tile-blue,.okey-premium .okey-tile[data-tile-color="blue"]{color:#1769c2!important} .okey-premium .okey-tile.tile-black,.okey-premium .okey-tile[data-tile-color="black"]{color:#151515!important} .okey-premium .okey-tile.tile-fake,.okey-premium .okey-tile[data-tile-color="fake"]{color:#7a35b5!important;background:linear-gradient(145deg,#fff9df,#e7d89e)!important} .okey-premium .okey-tile>span{color:inherit!important;text-shadow:0 1px 0 rgba(255,255,255,.5),0 1px 1px rgba(0,0,0,.16)} .okey-premium .okey-tile>small{color:inherit!important;font-weight:900;opacity:.72} .okey-premium .okey-tile.tile-red::after,.okey-premium .okey-tile.tile-yellow::after,.okey-premium .okey-tile.tile-blue::after,.okey-premium .okey-tile.tile-black::after{content:"";position:absolute;bottom:8px;width:12px;height:12px;border-radius:50%;background:currentColor;box-shadow:inset 0 1px 2px rgba(255,255,255,.58),0 1px 2px rgba(0,0,0,.25)} .okey-premium .okey-tile>small{position:absolute;left:5px;bottom:3px;font-size:.42rem} .okey-premium .okey-tile.compact::after{bottom:5px;width:9px;height:9px} @media(max-width:991.98px) and (orientation:landscape){.okey-premium .okey-tile::after{bottom:4px!important;width:8px!important;height:8px!important}.okey-premium .okey-tile>small{display:none}} /* V6.5 R13 - Masaustu Duz Okey kompakt dikey masa yuksekligi */ @media (min-width:992px){ .okey-premium .premium-board{ min-height:440px; height:clamp(440px,52vh,500px); } .okey-premium .opponent-zone.top{top:3px} .okey-premium .opponent-zone.bottom{bottom:3px} .okey-premium .opponent-rack.horizontal{ top:50px; height:38px; } .okey-premium .opponent-rack.vertical{ height:178px; } .okey-premium .board-center{ transform:translate(-50%,-50%) scale(.88); transform-origin:center; } .okey-premium .discard-drop-halo{ top:57%; height:70px; } .okey-premium .premium-rack{ margin-top:-12px; } } @media (min-width:992px) and (max-height:820px){ .okey-premium .premium-board{ min-height:405px; height:48vh; max-height:455px; } .okey-premium .opponent-rack.vertical{height:158px} .okey-premium .opponent-rack.horizontal{top:46px;height:34px} .okey-premium .board-center{transform:translate(-50%,-50%) scale(.82)} .okey-premium .premium-rack{margin-top:-16px} } /* V6.5 R14 - Masaustu ekstra kompakt masa ve belirgin merkez taslari */ @media (min-width:992px){ .okey-premium .premium-board{ min-height:400px; height:clamp(400px,47vh,455px); } .okey-premium .opponent-zone.top{top:0} .okey-premium .opponent-zone.bottom{bottom:0} .okey-premium .opponent-rack.horizontal{ top:40px; height:34px; } .okey-premium .opponent-rack.vertical{height:150px} .okey-premium .board-center{ gap:18px; transform:translate(-50%,-48%) scale(.96); } .okey-premium .indicator-box{ padding:12px 14px; border:1px solid rgba(255,255,255,.24); background:rgba(2,24,18,.9); box-shadow:0 12px 28px rgba(0,0,0,.42),0 0 22px rgba(69,255,120,.14); } .okey-premium .board-center .okey-tile, .okey-premium .indicator-box .okey-tile{ width:58px; height:82px; flex-basis:58px; border:2px solid rgba(255,255,255,.72); box-shadow:0 7px 14px rgba(0,0,0,.55),0 0 18px rgba(255,236,160,.22); } .okey-premium .board-center .okey-tile>span, .okey-premium .indicator-box .okey-tile>span{font-size:2rem} .okey-premium .stock-stack>span{ width:70px; height:88px; border-width:4px; box-shadow:7px 7px 0 #16234a,12px 12px 0 #101a36,0 0 20px rgba(62,146,255,.28); } .okey-premium .stock-stack, .okey-premium .discard-slot{font-weight:900;text-shadow:0 2px 3px rgba(0,0,0,.75)} .okey-premium .discard-drop-halo{ top:59%; height:62px; } .okey-premium .premium-rack{margin-top:-18px} } @media (min-width:992px) and (max-height:820px){ .okey-premium .premium-board{ min-height:370px; height:43vh; max-height:415px; } .okey-premium .opponent-rack.horizontal{top:36px;height:31px} .okey-premium .opponent-rack.vertical{height:136px} .okey-premium .board-center{transform:translate(-50%,-47%) scale(.9)} .okey-premium .premium-rack{margin-top:-21px} } /* V6.5 R15 - Her oyuncu icin son atilan tas yuvasi */ .okey-premium .player-seat{overflow:visible!important;display:flex;align-items:center;gap:8px;min-width:220px} .okey-premium .player-core{display:flex;align-items:center;gap:7px;min-width:0} .okey-premium .player-discard-well{display:flex;flex-direction:column;gap:3px;min-width:126px;padding:5px 7px;border:1px solid rgba(255,211,103,.35);border-radius:10px;background:linear-gradient(180deg,rgba(2,28,18,.96),rgba(0,14,10,.9));box-shadow:inset 0 1px rgba(255,255,255,.08),0 7px 18px rgba(0,0,0,.34)} .okey-premium .player-discard-well>small{color:#ffc928;font-size:.55rem;font-weight:900;letter-spacing:.03em;white-space:nowrap} .okey-premium .discard-history-slots{display:grid;grid-template-columns:repeat(4,25px);gap:3px} .okey-premium .discard-history-slot{position:relative;width:25px;height:34px;border-radius:5px;border:1px solid rgba(231,255,236,.25);background:linear-gradient(145deg,rgba(255,255,255,.04),rgba(0,0,0,.2));box-shadow:inset 0 1px 3px rgba(0,0,0,.55)} .okey-premium .discard-history-slot.filled{border-color:rgba(255,213,75,.75);box-shadow:0 0 12px rgba(255,196,38,.28),inset 0 1px 2px rgba(255,255,255,.25)} .okey-premium .discard-history-slot .okey-tile{position:absolute;inset:1px;width:21px!important;height:30px!important;min-width:21px!important;flex-basis:21px!important;border-width:1px!important;border-radius:4px!important;padding:0!important;margin:0!important;pointer-events:none} .okey-premium .discard-history-slot .okey-tile>span{font-size:.72rem!important;line-height:1!important} .okey-premium .discard-history-slot .okey-tile>small{display:none!important} .okey-premium .discard-history-slot .okey-tile::after{bottom:3px!important;width:5px!important;height:5px!important} .okey-premium .opponent-zone.top .player-seat{flex-direction:row} .okey-premium .opponent-zone.left .player-seat,.okey-premium .opponent-zone.right .player-seat{min-width:190px} .okey-premium .opponent-zone.bottom .player-seat{flex-direction:row} @media (min-width:992px){ .okey-premium .opponent-zone.top .player-discard-well,.okey-premium .opponent-zone.bottom .player-discard-well{margin-left:3px} .okey-premium .opponent-zone.left .player-seat{transform:translateX(34px)} .okey-premium .opponent-zone.right .player-seat{transform:translateX(-34px)} } @media(max-width:991.98px) and (orientation:landscape){ .okey-premium .player-seat{min-width:150px;gap:4px} .okey-premium .player-discard-well{min-width:88px;padding:3px 4px} .okey-premium .player-discard-well>small{font-size:.43rem} .okey-premium .discard-history-slots{grid-template-columns:repeat(4,18px);gap:2px} .okey-premium .discard-history-slot{width:18px;height:25px} .okey-premium .discard-history-slot .okey-tile{width:16px!important;height:23px!important;min-width:16px!important;flex-basis:16px!important} .okey-premium .discard-history-slot .okey-tile>span{font-size:.55rem!important} .okey-premium .opponent-zone.left .player-seat,.okey-premium .opponent-zone.right .player-seat{min-width:140px} } @media(max-width:700px) and (orientation:portrait){ .okey-premium .player-seat{min-width:145px} .okey-premium .player-discard-well{min-width:78px;padding:3px} .okey-premium .discard-history-slots{grid-template-columns:repeat(4,16px);gap:2px} .okey-premium .discard-history-slot{width:16px;height:23px} .okey-premium .discard-history-slot .okey-tile{width:14px!important;height:21px!important;min-width:14px!important;flex-basis:14px!important} } /* V6.5 R16 yönetilebilir masa tasarımı */ @media(min-width:992px){.okey-premium .premium-board{height:var(--okey-design-board-height,420px)!important;min-height:var(--okey-design-board-height,420px)!important;max-height:var(--okey-design-board-height,420px)!important}.okey-premium .opponent-zone.top{top:var(--okey-design-top-player-y,0px)!important}.okey-premium .opponent-zone.bottom{bottom:var(--okey-design-bottom-player-y,30px)!important}.okey-premium .board-center{top:var(--okey-design-center-y,44%)!important;transform:translate(-50%,-50%) scale(var(--okey-design-center-scale,1))!important}.okey-premium .premium-rack{margin-top:var(--okey-design-rack-gap,-22px)!important}.okey-premium .opponent-rack.horizontal{top:var(--okey-design-top-rack-y,34px)!important}.okey-premium .opponent-rack.vertical{height:var(--okey-design-side-rack-height,132px)!important}} .table-design-preview{position:relative;height:var(--p-board-h,240px);min-height:230px;border:6px solid #583018;border-radius:18px;background:radial-gradient(circle,#167148,#063d27);overflow:hidden}.preview-top-player,.preview-bottom-player{position:absolute;left:50%;transform:translateX(-50%);background:#07150f;color:#fff;padding:5px 18px;border-radius:20px;font-weight:800;z-index:2}.preview-top-player{top:calc(4px + var(--p-top-y,0px))}.preview-bottom-player{bottom:var(--p-bottom-y,12px)}.preview-top-rack{position:absolute;left:24%;right:24%;top:var(--p-top-rack-y,16px);height:22px;background:#945020;border:3px solid #51280f}.preview-center{position:absolute;left:50%;top:var(--p-center-y,44%);transform:translate(-50%,-50%) scale(var(--p-center-scale,1));display:flex;gap:8px}.preview-center>*{display:grid;place-items:center;width:38px;height:48px;background:#fff3cc;color:#111;border-radius:7px}.preview-rack{position:absolute;left:8%;right:8%;bottom:calc(-3px - var(--p-rack-gap,-7px));height:40px;background:#985421;border:4px solid #4d2812;display:flex;gap:4px;padding:4px}.preview-rack i{flex:1;background:#fff1ca;border-radius:3px} /* V6.5 R17 - Kucuk, ust uste atilan tas yuvasi */ .okey-premium .player-seat{min-width:0!important;gap:6px!important} .okey-premium .player-discard-well.compact-stack{position:relative;flex:0 0 58px;min-width:58px!important;width:58px;padding:4px 4px 5px!important;gap:1px;border-radius:9px} .okey-premium .player-discard-well.compact-stack>small{font-size:.48rem!important;line-height:1;color:#ffd22f} .okey-premium .discard-stack{position:relative;width:44px;height:39px;margin:0 auto} .okey-premium .discard-stack.empty{border:1px solid rgba(230,255,235,.22);border-radius:5px;background:rgba(0,0,0,.18)} .okey-premium .discard-stack-card{position:absolute;left:6px;top:2px;width:25px;height:34px;filter:brightness(.82);opacity:.92;transform-origin:center bottom} .okey-premium .discard-stack-card.discard-stack-3{transform:translateX(0) rotate(-1deg)} .okey-premium .discard-stack-card.discard-stack-2{transform:translateX(3px) rotate(.5deg)} .okey-premium .discard-stack-card.discard-stack-1{transform:translateX(6px) rotate(1deg)} .okey-premium .discard-stack-card.discard-stack-0{transform:translateX(9px);z-index:5;filter:none;opacity:1} .okey-premium .discard-stack-card .okey-tile{position:absolute!important;inset:0!important;width:25px!important;height:34px!important;min-width:25px!important;max-width:25px!important;flex-basis:25px!important;padding:0!important;margin:0!important;border-width:1px!important;border-radius:5px!important;pointer-events:none!important;box-shadow:0 2px 4px rgba(0,0,0,.5)!important} .okey-premium .discard-stack-card .okey-tile>span{font-size:.76rem!important;line-height:1!important} .okey-premium .discard-stack-card .okey-tile>small{display:none!important} .okey-premium .discard-stack-card .okey-tile::after{bottom:3px!important;width:5px!important;height:5px!important} .okey-premium .opponent-zone.left .player-seat,.okey-premium .opponent-zone.right .player-seat{min-width:0!important} @media(min-width:992px){ .okey-premium .opponent-zone.left .player-seat{transform:translateX(22px)!important} .okey-premium .opponent-zone.right .player-seat{transform:translateX(-22px)!important} } @media(max-width:991.98px) and (orientation:landscape){ .okey-premium .player-discard-well.compact-stack{flex-basis:48px;min-width:48px!important;width:48px;padding:2px!important} .okey-premium .player-discard-well.compact-stack>small{font-size:.38rem!important} .okey-premium .discard-stack{transform:scale(.78);transform-origin:left top;width:38px;height:29px} } /* V6.5 R18 - Mobil yatay tam ekranda iki satirli istakanin eksiksiz gorunmesi */ @media (max-width:991.98px) and (orientation:landscape){ #okeyApp:fullscreen, #okeyApp:-webkit-full-screen{ width:100vw!important; height:100dvh!important; min-height:100dvh!important; overflow:hidden!important; } #okeyApp:fullscreen .okey-stage, #okeyApp:-webkit-full-screen .okey-stage{ box-sizing:border-box!important; width:100vw!important; height:100dvh!important; min-height:0!important; padding:3px 5px 4px!important; overflow:hidden!important; } #okeyApp:fullscreen .okey-hud, #okeyApp:-webkit-full-screen .okey-hud{ flex:0 0 auto!important; margin-bottom:2px!important; transform:scale(.92); transform-origin:center top; } #okeyApp:fullscreen .premium-table-wrap, #okeyApp:-webkit-full-screen .premium-table-wrap{ display:flex!important; flex:1 1 auto!important; flex-direction:column!important; min-height:0!important; overflow:hidden!important; } #okeyApp:fullscreen .premium-board, #okeyApp:-webkit-full-screen .premium-board{ flex:1 1 auto!important; width:100%!important; height:auto!important; min-height:220px!important; max-height:none!important; border-radius:14px!important; } #okeyApp:fullscreen .premium-rack, #okeyApp:-webkit-full-screen .premium-rack{ flex:0 0 auto!important; margin-top:-8px!important; padding:4px 6px 4px!important; border-width:4px!important; border-radius:10px!important; } #okeyApp:fullscreen .okey-rack.dynamic-rack, #okeyApp:-webkit-full-screen .okey-rack.dynamic-rack{ grid-template-rows:repeat(2,40px)!important; min-height:84px!important; height:84px!important; gap:2px!important; padding:2px 4px!important; overflow:hidden!important; background:repeating-linear-gradient(0deg,rgba(55,23,7,.08) 0 39px,rgba(42,15,4,.62) 40px 43px),linear-gradient(90deg,rgba(255,255,255,.06),transparent 12%,transparent 88%,rgba(0,0,0,.2))!important; } #okeyApp:fullscreen .rack-slot, #okeyApp:-webkit-full-screen .rack-slot{ min-height:40px!important; align-items:center!important; } #okeyApp:fullscreen .rack-slot .okey-tile, #okeyApp:-webkit-full-screen .rack-slot .okey-tile{ width:100%!important; max-width:30px!important; height:39px!important; min-height:39px!important; border-radius:5px!important; } #okeyApp:fullscreen .rack-slot .okey-tile>span, #okeyApp:-webkit-full-screen .rack-slot .okey-tile>span{ font-size:.92rem!important; line-height:1!important; } #okeyApp:fullscreen .rack-slot .okey-tile::after, #okeyApp:-webkit-full-screen .rack-slot .okey-tile::after{ bottom:3px!important; width:6px!important; height:6px!important; } #okeyApp:fullscreen .rack-slot-marker, #okeyApp:-webkit-full-screen .rack-slot-marker{ height:2px!important; margin-bottom:2px!important; } #okeyApp:fullscreen .rack-instruction, #okeyApp:-webkit-full-screen .rack-instruction, #okeyApp:fullscreen .premium-toolbar, #okeyApp:-webkit-full-screen .premium-toolbar, #okeyApp:fullscreen .premium-footer, #okeyApp:-webkit-full-screen .premium-footer{ display:none!important; } } @media (max-width:991.98px) and (orientation:landscape) and (max-height:500px){ #okeyApp:fullscreen .premium-board, #okeyApp:-webkit-full-screen .premium-board{min-height:185px!important} #okeyApp:fullscreen .okey-rack.dynamic-rack, #okeyApp:-webkit-full-screen .okey-rack.dynamic-rack{grid-template-rows:repeat(2,35px)!important;height:74px!important;min-height:74px!important} #okeyApp:fullscreen .rack-slot, #okeyApp:-webkit-full-screen .rack-slot{min-height:35px!important} #okeyApp:fullscreen .rack-slot .okey-tile, #okeyApp:-webkit-full-screen .rack-slot .okey-tile{height:34px!important;min-height:34px!important;max-width:27px!important} #okeyApp:fullscreen .rack-slot .okey-tile>span, #okeyApp:-webkit-full-screen .rack-slot .okey-tile>span{font-size:.8rem!important} } /* V6.5 R19 - Mobil tam ekranda istaka sabitleme ve merkez aksiyon onarimi */ @media (max-width:991.98px) and (orientation:landscape){ #okeyApp:fullscreen .premium-table-wrap, #okeyApp:-webkit-full-screen .premium-table-wrap{ display:grid!important; grid-template-rows:minmax(0,1fr) auto!important; grid-template-columns:minmax(0,1fr)!important; flex:1 1 auto!important; min-height:0!important; height:auto!important; overflow:hidden!important; } #okeyApp:fullscreen .premium-board, #okeyApp:-webkit-full-screen .premium-board{ grid-row:1!important; min-width:0!important; min-height:0!important; height:100%!important; max-height:none!important; overflow:hidden!important; } #okeyApp:fullscreen .premium-rack, #okeyApp:-webkit-full-screen .premium-rack{ grid-row:2!important; position:relative!important; display:block; width:100%!important; min-width:0!important; height:auto!important; margin-top:-6px!important; margin-bottom:0!important; z-index:40!important; visibility:visible!important; opacity:1!important; transform:none!important; } #okeyApp:fullscreen .premium-rack.d-none, #okeyApp:-webkit-full-screen .premium-rack.d-none{display:none!important} #okeyApp:fullscreen .okey-rack.dynamic-rack, #okeyApp:-webkit-full-screen .okey-rack.dynamic-rack{ box-sizing:border-box!important; width:100%!important; grid-template-columns:repeat(15,minmax(0,1fr))!important; } #okeyApp:fullscreen .board-center, #okeyApp:-webkit-full-screen .board-center{ top:48%!important; left:50%!important; gap:7px!important; transform:translate(-50%,-50%) scale(.70)!important; transform-origin:center!important; z-index:8!important; } #okeyApp:fullscreen .discard-drop-halo, #okeyApp:-webkit-full-screen .discard-drop-halo{ top:62%!important; width:118px!important; height:48px!important; font-size:.46rem!important; opacity:.72!important; } #okeyApp:fullscreen .stock-ring, #okeyApp:-webkit-full-screen .stock-ring{padding:5px!important} #okeyApp:fullscreen .stock-stack, #okeyApp:-webkit-full-screen .stock-stack{width:62px!important;height:62px!important} #okeyApp:fullscreen .indicator-box, #okeyApp:-webkit-full-screen .indicator-box, #okeyApp:fullscreen .discard-slot, #okeyApp:-webkit-full-screen .discard-slot{ min-width:62px!important; padding:5px!important; } #okeyApp:fullscreen .indicator-box .okey-tile, #okeyApp:-webkit-full-screen .indicator-box .okey-tile, #okeyApp:fullscreen .discard-slot .okey-tile, #okeyApp:-webkit-full-screen .discard-slot .okey-tile{ width:38px!important; height:54px!important; min-width:38px!important; flex-basis:38px!important; } #okeyApp:fullscreen .opponent-zone.bottom, #okeyApp:-webkit-full-screen .opponent-zone.bottom{bottom:4px!important} } @media (max-width:991.98px) and (orientation:landscape) and (max-height:500px){ #okeyApp:fullscreen .okey-hud, #okeyApp:-webkit-full-screen .okey-hud{ transform:scale(.82)!important; margin-bottom:-7px!important; } #okeyApp:fullscreen .premium-table-wrap, #okeyApp:-webkit-full-screen .premium-table-wrap{ grid-template-rows:minmax(150px,1fr) 68px!important; } #okeyApp:fullscreen .premium-rack, #okeyApp:-webkit-full-screen .premium-rack{ height:68px!important; padding:2px 4px!important; border-width:3px!important; margin-top:-4px!important; } #okeyApp:fullscreen .okey-rack.dynamic-rack, #okeyApp:-webkit-full-screen .okey-rack.dynamic-rack{ grid-template-rows:repeat(2,30px)!important; height:62px!important; min-height:62px!important; padding:1px 3px!important; } #okeyApp:fullscreen .rack-slot, #okeyApp:-webkit-full-screen .rack-slot{min-height:30px!important} #okeyApp:fullscreen .rack-slot .okey-tile, #okeyApp:-webkit-full-screen .rack-slot .okey-tile{ height:29px!important; min-height:29px!important; max-width:25px!important; } #okeyApp:fullscreen .rack-slot .okey-tile>span, #okeyApp:-webkit-full-screen .rack-slot .okey-tile>span{font-size:.72rem!important} #okeyApp:fullscreen .rack-slot .okey-tile::after, #okeyApp:-webkit-full-screen .rack-slot .okey-tile::after{width:4px!important;height:4px!important;bottom:2px!important} #okeyApp:fullscreen .board-center, #okeyApp:-webkit-full-screen .board-center{ top:47%!important; gap:4px!important; transform:translate(-50%,-50%) scale(.58)!important; } #okeyApp:fullscreen .discard-drop-halo, #okeyApp:-webkit-full-screen .discard-drop-halo{ top:61%!important; width:104px!important; height:38px!important; } #okeyApp:fullscreen .opponent-zone.bottom, #okeyApp:-webkit-full-screen .opponent-zone.bottom{ bottom:1px!important; transform:translateX(-50%) scale(.82)!important; transform-origin:center bottom!important; } } /* V6.5 R21 - Mobil adaptif Okey arayuzu */ @media (max-width:991.98px) and (orientation:landscape){ html,body{width:100%;height:var(--iznel-vh,100dvh);overscroll-behavior:none} body:has(.okey-premium){padding:0 env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);touch-action:none} .okey-premium{height:var(--iznel-vh,100dvh);max-height:var(--iznel-vh,100dvh)} .okey-premium .okey-stage{height:var(--iznel-vh,100dvh);padding:clamp(2px,1vh,6px) clamp(4px,1vw,9px) max(3px,env(safe-area-inset-bottom))} .okey-premium .premium-table-wrap{display:flex;flex:1 1 auto;min-height:0;height:auto} .okey-premium .premium-board{height:auto!important;min-height:0!important;flex:1 1 auto;max-height:none} .okey-premium .premium-rack{flex:0 0 auto;margin-top:-10px!important;padding:5px 7px 4px!important} .okey-premium .okey-rack.dynamic-rack{height:clamp(88px,27vh,116px)!important;min-height:clamp(88px,27vh,116px)!important;grid-template-rows:repeat(2,minmax(39px,1fr))!important} .okey-premium .rack-slot{min-height:39px!important} .okey-premium .rack-slot .okey-tile{height:calc((clamp(88px,27vh,116px) - 10px)/2)!important;max-width:clamp(25px,4.25vw,35px)!important} .okey-premium .rack-slot .okey-tile>span{font-size:clamp(.78rem,2.8vh,1.05rem)!important} .okey-premium .board-center{gap:clamp(5px,1.6vw,14px)!important;transform:translate(-50%,-48%) scale(var(--iznel-mobile-scale,.86))!important} .okey-premium .stock-stack>span{width:clamp(39px,7vh,55px)!important;height:clamp(53px,10vh,72px)!important} .okey-premium .indicator-box{padding:clamp(3px,1vh,7px)!important} .okey-premium .board-center .okey-tile,.okey-premium .indicator-box .okey-tile{width:clamp(35px,6.5vh,48px)!important;height:clamp(49px,9vh,67px)!important;flex-basis:clamp(35px,6.5vh,48px)!important} .okey-premium .discard-drop-halo{top:62%!important;width:clamp(100px,22vw,150px)!important;height:clamp(38px,10vh,58px)!important} .okey-premium .player-seat{transform:scale(clamp(.76,var(--iznel-mobile-scale,.86),1));transform-origin:center} .okey-premium .opponent-rack.horizontal{top:clamp(29px,8vh,42px)!important} .okey-premium .opponent-rack.vertical{height:clamp(98px,31vh,150px)!important} .premium-footer{flex:0 0 auto;min-height:24px} .premium-toolbar button,.quick-actions button{min-height:30px;touch-action:manipulation} .okey-tile,.stock-stack,.discard-slot{touch-action:none;-webkit-user-select:none;user-select:none} } @media (max-width:991.98px) and (orientation:landscape) and (max-height:389px){ .okey-hud{transform:scale(.9);transform-origin:top center;margin-bottom:-4px} .okey-premium .okey-rack.dynamic-rack{height:88px!important;min-height:88px!important} .okey-premium .premium-rack{margin-top:-15px!important} .premium-toolbar{display:none!important} .premium-footer .quick-actions{display:none!important} .okey-premium .board-center{transform:translate(-50%,-48%) scale(.72)!important} } @media (max-width:991.98px) and (orientation:landscape) and (max-height:339px){ .okey-hud{transform:scale(.82);margin-bottom:-9px} .okey-premium .okey-rack.dynamic-rack{height:78px!important;min-height:78px!important;grid-template-rows:repeat(2,36px)!important} .okey-premium .rack-slot,.okey-premium .rack-slot .okey-tile{min-height:36px!important;height:36px!important} .okey-premium .board-center{transform:translate(-50%,-46%) scale(.62)!important} .okey-premium .opponent-rack.horizontal,.okey-premium .opponent-rack.vertical{opacity:.72} } @media (min-width:700px) and (max-width:1199px) and (orientation:landscape){ .okey-premium .okey-stage{max-width:none} .okey-premium .okey-rack.dynamic-rack{height:clamp(100px,24vh,132px)!important} } /* V6.5 R22 - Mobil yatay tam ekranda ortali istaka ve buyuk taslar */ @media (max-width:991.98px) and (orientation:landscape){ #okeyApp:fullscreen .premium-rack, #okeyApp:-webkit-full-screen .premium-rack{ box-sizing:border-box!important; width:min(88vw,1120px)!important; max-width:calc(100vw - max(18px,env(safe-area-inset-left)) - max(18px,env(safe-area-inset-right)))!important; margin-left:auto!important; margin-right:auto!important; padding:6px 9px 5px!important; border-width:5px!important; border-radius:13px!important; overflow:hidden!important; } #okeyApp:fullscreen .okey-rack.dynamic-rack, #okeyApp:-webkit-full-screen .okey-rack.dynamic-rack{ width:100%!important; grid-template-columns:repeat(15,minmax(0,1fr))!important; grid-template-rows:repeat(2,minmax(45px,1fr))!important; height:clamp(102px,29vh,126px)!important; min-height:clamp(102px,29vh,126px)!important; gap:3px!important; padding:3px 5px!important; } #okeyApp:fullscreen .rack-slot, #okeyApp:-webkit-full-screen .rack-slot{ min-width:0!important; min-height:45px!important; display:flex!important; justify-content:center!important; align-items:center!important; } #okeyApp:fullscreen .rack-slot .okey-tile, #okeyApp:-webkit-full-screen .rack-slot .okey-tile{ width:clamp(35px,4.9vw,48px)!important; max-width:48px!important; height:clamp(47px,12.5vh,61px)!important; min-height:47px!important; flex:0 0 auto!important; border-radius:7px!important; box-shadow:0 3px 5px rgba(0,0,0,.46),inset 1px 1px rgba(255,255,255,.88)!important; } #okeyApp:fullscreen .rack-slot .okey-tile>span, #okeyApp:-webkit-full-screen .rack-slot .okey-tile>span{ font-size:clamp(1rem,3.7vh,1.34rem)!important; font-weight:900!important; } #okeyApp:fullscreen .rack-slot .okey-tile::after, #okeyApp:-webkit-full-screen .rack-slot .okey-tile::after{ width:clamp(6px,1.8vh,9px)!important; height:clamp(6px,1.8vh,9px)!important; bottom:4px!important; } } @media (max-width:991.98px) and (orientation:landscape) and (max-height:430px){ #okeyApp:fullscreen .premium-rack, #okeyApp:-webkit-full-screen .premium-rack{width:min(91vw,1040px)!important;padding:4px 7px!important;border-width:4px!important} #okeyApp:fullscreen .okey-rack.dynamic-rack, #okeyApp:-webkit-full-screen .okey-rack.dynamic-rack{height:92px!important;min-height:92px!important;grid-template-rows:repeat(2,43px)!important;gap:2px!important} #okeyApp:fullscreen .rack-slot, #okeyApp:-webkit-full-screen .rack-slot{min-height:43px!important} #okeyApp:fullscreen .rack-slot .okey-tile, #okeyApp:-webkit-full-screen .rack-slot .okey-tile{width:clamp(31px,4.5vw,42px)!important;max-width:42px!important;height:42px!important;min-height:42px!important} #okeyApp:fullscreen .rack-slot .okey-tile>span, #okeyApp:-webkit-full-screen .rack-slot .okey-tile>span{font-size:.98rem!important} } @media (max-width:991.98px) and (orientation:landscape) and (max-height:350px){ #okeyApp:fullscreen .premium-rack, #okeyApp:-webkit-full-screen .premium-rack{width:min(94vw,980px)!important} #okeyApp:fullscreen .okey-rack.dynamic-rack, #okeyApp:-webkit-full-screen .okey-rack.dynamic-rack{height:80px!important;min-height:80px!important;grid-template-rows:repeat(2,37px)!important} #okeyApp:fullscreen .rack-slot, #okeyApp:-webkit-full-screen .rack-slot{min-height:37px!important} #okeyApp:fullscreen .rack-slot .okey-tile, #okeyApp:-webkit-full-screen .rack-slot .okey-tile{width:clamp(27px,4.2vw,37px)!important;max-width:37px!important;height:36px!important;min-height:36px!important} #okeyApp:fullscreen .rack-slot .okey-tile>span, #okeyApp:-webkit-full-screen .rack-slot .okey-tile>span{font-size:.83rem!important} } /* V6.5 R23 — Düz Okey HD 2.5D taş seti */ .okey-premium .okey-tile{ isolation:isolate; overflow:hidden; border:1px solid #c9b98e!important; border-bottom-color:#8c774e!important; border-radius:8px!important; background: radial-gradient(circle at 28% 18%,rgba(255,255,255,.95) 0 7%,rgba(255,255,255,0) 26%), linear-gradient(155deg,#fffef5 0%,#fff8df 38%,#eadfbd 72%,#d3c397 100%)!important; box-shadow: 0 1px 0 #fff inset, 1px 0 0 rgba(255,255,255,.72) inset, -1px -1px 0 rgba(113,91,51,.17) inset, 0 -5px 8px rgba(109,83,36,.12) inset, 0 3px 0 #9b8357, 0 6px 9px rgba(0,0,0,.38)!important; transform-style:preserve-3d; backface-visibility:hidden; } .okey-premium .okey-tile::before{ content:""; position:absolute; z-index:-1; inset:3px 3px 10px; border-radius:6px; border:1px solid rgba(255,255,255,.62); box-shadow:0 0 0 1px rgba(105,79,35,.08),0 5px 10px rgba(255,255,255,.18) inset; pointer-events:none; } .okey-premium .okey-tile>span{ position:relative; z-index:2; font-weight:950!important; letter-spacing:-.045em; text-shadow: 0 1px 0 rgba(255,255,255,.92), 0 2px 0 rgba(255,255,255,.42), 0 3px 3px rgba(53,38,15,.22)!important; filter:saturate(1.08) contrast(1.05); } .okey-premium .okey-tile>small{z-index:3;text-shadow:0 1px 0 rgba(255,255,255,.8)!important} .okey-premium .okey-tile.tile-red,.okey-premium .okey-tile[data-tile-color="red"]{color:#d62525!important} .okey-premium .okey-tile.tile-yellow,.okey-premium .okey-tile[data-tile-color="yellow"]{color:#d49a00!important} .okey-premium .okey-tile.tile-blue,.okey-premium .okey-tile[data-tile-color="blue"]{color:#176fc4!important} .okey-premium .okey-tile.tile-black,.okey-premium .okey-tile[data-tile-color="black"]{color:#101318!important} .okey-premium .okey-tile.tile-fake,.okey-premium .okey-tile[data-tile-color="fake"]{ color:#7b34b8!important; background: radial-gradient(circle at 28% 18%,rgba(255,255,255,.98) 0 8%,transparent 27%), linear-gradient(155deg,#fffced 0%,#f6e9b8 54%,#d7c17c 100%)!important; } .okey-premium .okey-tile.tile-red::after,.okey-premium .okey-tile.tile-yellow::after,.okey-premium .okey-tile.tile-blue::after,.okey-premium .okey-tile.tile-black::after{ z-index:4; border:1px solid rgba(71,52,20,.22); box-shadow:0 1px 1px rgba(255,255,255,.9) inset,0 -2px 3px rgba(0,0,0,.18) inset,0 1px 2px rgba(0,0,0,.28)!important; } .okey-premium .rack-slot .okey-tile:hover{ transform:translateY(-6px) scale(1.025); filter:brightness(1.035) saturate(1.06); box-shadow:0 1px 0 #fff inset,0 3px 0 #9b8357,0 11px 16px rgba(0,0,0,.43)!important; } .okey-premium .rack-slot .okey-tile.selected{ transform:translateY(-11px) scale(1.035)!important; box-shadow:0 0 0 3px #73ff78,0 3px 0 #9b8357,0 14px 20px rgba(0,0,0,.48)!important; } .okey-premium .okey-tile.dragging,.premium-tile-ghost{ transform:translateY(-14px) rotate(-1.5deg) scale(1.065)!important; filter:brightness(1.06) saturate(1.08) drop-shadow(0 18px 15px rgba(0,0,0,.46))!important; } .okey-premium .indicator-box .okey-tile,.okey-premium .board-center .okey-tile{ border-width:2px!important; box-shadow:0 2px 0 #fff inset,0 4px 0 #9b8357,0 10px 18px rgba(0,0,0,.42),0 0 18px rgba(255,231,131,.14)!important; } .okey-premium .discard-history-slot .okey-tile::before,.okey-premium .discard-stack-card .okey-tile::before{inset:1px 1px 4px;border-radius:3px} .okey-premium .discard-history-slot .okey-tile,.okey-premium .discard-stack-card .okey-tile{ box-shadow:0 1px 0 #fff inset,0 1px 0 #917849,0 2px 4px rgba(0,0,0,.45)!important; } @media(max-width:991.98px) and (orientation:landscape){ .okey-premium .okey-tile{border-radius:6px!important;box-shadow:0 1px 0 #fff inset,0 2px 0 #947b4f,0 4px 6px rgba(0,0,0,.38)!important} .okey-premium .okey-tile::before{inset:2px 2px 6px;border-radius:4px} .okey-premium .okey-tile>span{text-shadow:0 1px 0 #fff,0 2px 2px rgba(53,38,15,.22)!important} } /* V6.5 R36 spectator clarity and discreet AI identity */ .bot-badge-ai{padding:.05rem .28rem;font-size:.54rem;letter-spacing:.04em;background:rgba(34,197,94,.16);border-color:rgba(74,222,128,.55);color:#bbf7d0} .spectator-notice{position:relative;z-index:18;display:flex;align-items:center;justify-content:space-between;gap:1rem;margin:.65rem auto .2rem;max-width:min(980px,96vw);padding:.72rem .9rem;border:1px solid rgba(56,189,248,.58);border-radius:14px;background:linear-gradient(135deg,rgba(8,47,73,.96),rgba(15,23,42,.96));box-shadow:0 10px 28px rgba(0,0,0,.26);color:#e0f2fe} .spectator-notice div{display:flex;flex-direction:column;gap:.12rem}.spectator-notice strong{font-size:.94rem}.spectator-notice span{font-size:.78rem;color:#bae6fd} .spectator-create-button{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;padding:.58rem .85rem;border-radius:10px;background:#22c55e;color:#052e16;font-weight:900;text-decoration:none;box-shadow:0 6px 18px rgba(34,197,94,.28)} .spectator-create-button:hover{color:#052e16;filter:brightness(1.08)} @media(max-width:720px){.spectator-notice{align-items:stretch;flex-direction:column;margin:.35rem auto .1rem;padding:.58rem .68rem}.spectator-create-button{width:100%;padding:.48rem}.spectator-notice strong{font-size:.84rem}.spectator-notice span{font-size:.7rem}} /* V6.5 R40 */ .chat-exit-button b{display:none}.sound-muted{opacity:.78}.sound-enabled{opacity:1}.hud-game strong{white-space:nowrap}.okey-radio .hud-icon small{white-space:nowrap} /* V6.5 R41 spectator rack, coin and compact radio */ .iznel-coin{display:inline-grid;place-items:center;width:24px;height:24px;flex:0 0 24px;border-radius:50%;border:2px solid #ffe08a;background:radial-gradient(circle at 35% 30%,#fff1a6 0 12%,#f7c843 35%,#b87300 100%);color:#5f3300;font-size:.72rem;font-weight:1000;box-shadow:inset 0 0 0 2px rgba(120,65,0,.28),0 2px 8px rgba(247,200,67,.28)} .wallet-pill{display:inline-flex;align-items:center;gap:.45rem} .spectator-rack-notice{position:relative;z-index:18;width:min(1120px,98%);min-height:118px;margin:-12px auto 4px;padding:18px 22px;display:flex;align-items:center;justify-content:center;gap:16px;border:6px solid #68310f;border-radius:18px;background:linear-gradient(180deg,#a85d25 0,#6f3514 18%,#3d1b09 58%,#241005 100%);box-shadow:inset 0 3px 0 rgba(255,214,146,.38),inset 0 -9px 18px rgba(0,0,0,.48),0 13px 25px rgba(0,0,0,.35);color:#fff7e8;text-align:left} .spectator-rack-notice>div:not(.spectator-rack-icon){display:flex;flex-direction:column;gap:3px}.spectator-rack-notice strong{font-size:1rem}.spectator-rack-notice span{font-size:.78rem;color:#f2d4ad}.spectator-rack-icon{font-size:1.7rem}.spectator-rack-notice .spectator-create-button{margin-left:10px;white-space:nowrap} .okey-radio-mini{height:36px;display:inline-flex;align-items:center;gap:5px;padding:3px 5px 3px 8px;border:1px solid rgba(255,255,255,.22);border-radius:10px;background:rgba(0,22,14,.82)}.okey-radio-title{font-size:.68rem;font-weight:800;color:#e7fff0}.radio-mini-toggle{height:27px;min-width:46px;padding:0 6px;display:inline-flex;align-items:center;justify-content:center;gap:3px;border:1px solid rgba(255,255,255,.3);border-radius:7px;background:#153d29;color:#fff;font-size:.65rem;line-height:1}.radio-mini-toggle span{font-size:.65rem}.radio-mini-toggle small{font-size:.62rem}.radio-mini-toggle.is-playing{background:#8b1e1e;border-color:#ff9c9c;box-shadow:0 0 10px rgba(34,197,94,.28)} @media(max-width:991.98px) and (orientation:landscape){.spectator-rack-notice{min-height:92px;margin:-14px auto 2px;padding:10px 14px;border-width:5px}.spectator-rack-notice span{display:none}.okey-radio-mini{height:32px;padding-left:6px}.okey-radio-title{display:none}.radio-mini-toggle{height:24px;min-width:40px}} @media(max-width:700px){.spectator-rack-notice{flex-wrap:wrap;text-align:center;gap:7px}.spectator-rack-notice .spectator-create-button{margin-left:0}.spectator-rack-icon{display:none}} /* V6.5 R42 — Mobil dikey görünümde kompakt üst kontrol alanı */ @media (max-width:700px) and (orientation:portrait){ #okeyApp:not(:fullscreen) .okey-stage, #okeyApp:not(:-webkit-full-screen) .okey-stage{ padding-top:7px; } #okeyApp:not(:fullscreen) .okey-hud, #okeyApp:not(:-webkit-full-screen) .okey-hud{ display:grid; grid-template-columns:minmax(0,1fr); align-items:stretch; gap:7px; width:100%; margin-bottom:7px; } #okeyApp:not(:fullscreen) .hud-stakes, #okeyApp:not(:-webkit-full-screen) .hud-stakes{ width:100%; min-width:0; justify-content:flex-start; gap:7px; padding:5px 7px; border-radius:13px; } #okeyApp:not(:fullscreen) .hud-stakes>div, #okeyApp:not(:-webkit-full-screen) .hud-stakes>div{ min-width:0; } #okeyApp:not(:fullscreen) .hud-game, #okeyApp:not(:-webkit-full-screen) .hud-game{ flex:1 1 auto; } #okeyApp:not(:fullscreen) .hud-stakes small, #okeyApp:not(:-webkit-full-screen) .hud-stakes small{ font-size:.68rem; } #okeyApp:not(:fullscreen) .hud-stakes strong, #okeyApp:not(:-webkit-full-screen) .hud-stakes strong{ font-size:.92rem; } #okeyApp:not(:fullscreen) .hud-menu, #okeyApp:not(:-webkit-full-screen) .hud-menu{ flex:0 0 40px; width:40px; height:40px; } #okeyApp:not(:fullscreen) .hud-mode, #okeyApp:not(:-webkit-full-screen) .hud-mode{ margin-left:auto; padding:5px 10px; } #okeyApp:not(:fullscreen) .hud-actions, #okeyApp:not(:-webkit-full-screen) .hud-actions{ display:flex; flex-wrap:nowrap; align-items:center; justify-content:center; width:100%; max-width:none; gap:6px; padding:5px 6px; border:1px solid rgba(255,255,255,.14); border-radius:13px; background:rgba(0,20,13,.72); box-shadow:inset 0 1px rgba(255,255,255,.06); } #okeyApp:not(:fullscreen) .hud-actions .connection-status, #okeyApp:not(:-webkit-full-screen) .hud-actions .connection-status{ display:none!important; } #okeyApp:not(:fullscreen) .turn-timer, #okeyApp:not(:-webkit-full-screen) .turn-timer{ flex:0 0 43px; width:43px; height:43px; min-width:43px; border-width:3px; font-size:.72rem; } #okeyApp:not(:fullscreen) .okey-radio-mini, #okeyApp:not(:-webkit-full-screen) .okey-radio-mini{ flex:0 0 auto; height:42px; padding:3px 4px; border-radius:10px; } #okeyApp:not(:fullscreen) .okey-radio-title, #okeyApp:not(:-webkit-full-screen) .okey-radio-title{ display:none; } #okeyApp:not(:fullscreen) .radio-mini-toggle, #okeyApp:not(:-webkit-full-screen) .radio-mini-toggle{ height:34px; min-width:42px; padding:0 5px; } #okeyApp:not(:fullscreen) .hud-icon, #okeyApp:not(:-webkit-full-screen) .hud-icon{ flex:1 1 0; min-width:0; max-width:54px; height:42px; padding:0; border-radius:10px; } #okeyApp:not(:fullscreen) .hud-icon span, #okeyApp:not(:-webkit-full-screen) .hud-icon span{ font-size:1.05rem; } #okeyApp:not(:fullscreen) .hud-icon small, #okeyApp:not(:-webkit-full-screen) .hud-icon small{ display:none; } #okeyApp:not(:fullscreen) .premium-flyout, #okeyApp:not(:-webkit-full-screen) .premium-flyout{ top:116px; right:8px; left:auto; max-width:calc(100vw - 16px); } #okeyApp:not(:fullscreen) .premium-table-wrap, #okeyApp:not(:-webkit-full-screen) .premium-table-wrap{ margin-top:0; } } @media (max-width:380px) and (orientation:portrait){ #okeyApp:not(:fullscreen) .hud-actions, #okeyApp:not(:-webkit-full-screen) .hud-actions{gap:4px;padding-inline:4px} #okeyApp:not(:fullscreen) .turn-timer, #okeyApp:not(:-webkit-full-screen) .turn-timer{flex-basis:39px;width:39px;height:39px;min-width:39px;font-size:.66rem} #okeyApp:not(:fullscreen) .okey-radio-mini, #okeyApp:not(:-webkit-full-screen) .okey-radio-mini{height:39px} #okeyApp:not(:fullscreen) .radio-mini-toggle, #okeyApp:not(:-webkit-full-screen) .radio-mini-toggle{height:31px;min-width:38px} #okeyApp:not(:fullscreen) .hud-icon, #okeyApp:not(:-webkit-full-screen) .hud-icon{height:39px;max-width:47px} } /* V6.5 R44 - Mobil dikey normal görünüm: oyuncu ayrıştırma ve kompakt ıstaka DİKKAT: yalnızca portrait + tam ekran olmayan mobil görünüm. */ @media (max-width:700px) and (orientation:portrait){ #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .premium-board{ min-height:735px!important; overflow:hidden!important; } /* Oyuncu kartlarını birbirinden ayır ve masa kenarlarına sabitle. */ #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.top{ top:14px!important; left:50%!important; right:auto!important; transform:translateX(-50%)!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.bottom{ bottom:14px!important; left:50%!important; right:auto!important; transform:translateX(-50%)!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left{ left:7px!important; right:auto!important; top:50%!important; transform:translateY(-50%)!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right{ right:7px!important; left:auto!important; top:50%!important; transform:translateY(-50%)!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .player-seat{ min-width:0!important; width:174px!important; max-width:174px!important; min-height:76px!important; padding:7px 8px!important; gap:7px!important; transform:none!important; border-radius:16px!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left .player-seat, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right .player-seat{ width:112px!important; max-width:112px!important; min-height:210px!important; padding:9px 6px!important; flex-direction:column!important; justify-content:flex-start!important; text-align:center!important; gap:5px!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .player-seat .player-avatar{ width:48px!important; height:48px!important; flex:0 0 48px!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left .player-seat-info, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right .player-seat-info{ width:100%!important; align-items:center!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .player-seat-info strong{ max-width:86px!important; font-size:.78rem!important; line-height:1.05!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .player-seat-info small{ font-size:.66rem!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left .discard-slot, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right .discard-slot{ margin-top:auto!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left .discard-slot .okey-tile, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right .discard-slot .okey-tile{ width:35px!important; height:51px!important; flex-basis:35px!important; } /* Merkez alanını kartlardan uzak tut. */ #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .board-center{ top:50%!important; transform:translate(-50%,-50%) scale(.68)!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .discard-drop-halo{ top:59%!important; width:150px!important; height:74px!important; } /* Normal mobil görünüm ıstakası: tam genişlikte, taşlar küçük ve ortalı. */ #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .premium-rack{ width:calc(100% - 20px)!important; max-width:680px!important; margin:10px auto 0!important; padding:8px 8px 7px!important; border-width:5px!important; border-radius:15px!important; overflow:hidden!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .rack-instruction{ margin:0 5px 5px!important; font-size:.61rem!important; line-height:1.25!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .okey-rack.dynamic-rack{ width:100%!important; grid-template-columns:repeat(15,minmax(0,1fr))!important; grid-template-rows:repeat(2,56px)!important; min-height:119px!important; height:119px!important; gap:2px!important; padding:4px 5px!important; overflow:hidden!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .rack-slot{ min-width:0!important; min-height:56px!important; height:56px!important; overflow:visible!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .rack-slot .okey-tile{ width:min(100%,31px)!important; max-width:31px!important; height:49px!important; min-height:49px!important; flex-basis:31px!important; margin-inline:auto!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .rack-slot .okey-tile>span{ font-size:1rem!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .rack-slot .okey-tile>small{ font-size:.43rem!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .rack-slot-marker{ width:55%!important; height:3px!important; margin-bottom:4px!important; } } @media (max-width:390px) and (orientation:portrait){ #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left .player-seat, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right .player-seat{ width:102px!important; max-width:102px!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .player-seat-info strong{max-width:76px!important;font-size:.72rem!important} #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .rack-slot .okey-tile{width:min(100%,28px)!important;max-width:28px!important;flex-basis:28px!important} } /* V6.5 R45 - Mobil dikey normal görünüm: kompakt masa ve küçük yan oyuncu kartları Yalnız portrait + tam ekran olmayan mobil görünüm. Mobil tam ekran ve masaüstü etkilenmez. */ @media (max-width:700px) and (orientation:portrait){ #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .premium-board{ min-height:610px!important; height:610px!important; margin-top:6px!important; } /* Üstteki gereksiz boşluğu azalt; üst ve alt oyuncuyu masaya yaklaştır. */ #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.top{ top:6px!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.bottom{ bottom:7px!important; } /* Yan oyuncu kartlarını daha küçük, net ve kenara yaslı hale getir. */ #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left{ left:3px!important; top:48%!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right{ right:3px!important; top:48%!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left .player-seat, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right .player-seat{ width:88px!important; max-width:88px!important; min-height:172px!important; padding:7px 4px!important; gap:3px!important; border-radius:14px!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left .player-avatar, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right .player-avatar{ width:39px!important; height:39px!important; flex-basis:39px!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left .player-seat-info strong, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right .player-seat-info strong{ width:76px!important; max-width:76px!important; font-size:.68rem!important; line-height:1.08!important; white-space:nowrap!important; overflow:hidden!important; text-overflow:ellipsis!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left .player-seat-info small, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right .player-seat-info small{ font-size:.58rem!important; line-height:1.05!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left .bot-badge-ai, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right .bot-badge-ai{ font-size:.46rem!important; padding:.02rem .2rem!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left .discard-slot, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right .discard-slot{ min-width:49px!important; min-height:62px!important; padding:3px!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left .discard-slot .okey-tile, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right .discard-slot .okey-tile{ width:29px!important; height:43px!important; flex-basis:29px!important; } /* Üst/alt kartları hafif küçült, merkez oyun alanını aç. */ #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.top .player-seat, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.bottom .player-seat{ width:158px!important; max-width:158px!important; min-height:66px!important; padding:6px 7px!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.top .player-avatar, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.bottom .player-avatar{ width:42px!important; height:42px!important; flex-basis:42px!important; } /* Gösterge ve çekme alanı daha yukarı, orta bölüm daha dengeli. */ #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .board-center{ top:47%!important; transform:translate(-50%,-50%) scale(.62)!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .discard-drop-halo{ top:55%!important; width:132px!important; height:62px!important; } /* Istakayı masa altına yaklaştır ve taşları tam ortada tut. */ #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .premium-rack{ margin:6px auto 0!important; padding:6px 6px 6px!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .okey-rack.dynamic-rack{ grid-template-rows:repeat(2,52px)!important; min-height:110px!important; height:110px!important; padding:3px 4px!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .rack-slot{ min-height:52px!important; height:52px!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .rack-slot .okey-tile{ width:min(100%,29px)!important; max-width:29px!important; height:46px!important; min-height:46px!important; flex-basis:29px!important; } } @media (max-width:390px) and (orientation:portrait){ #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .premium-board{min-height:575px!important;height:575px!important} #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left .player-seat, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right .player-seat{ width:82px!important;max-width:82px!important;min-height:164px!important } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left .player-seat-info strong, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right .player-seat-info strong{width:70px!important;max-width:70px!important;font-size:.64rem!important} #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .rack-slot .okey-tile{width:min(100%,26px)!important;max-width:26px!important;flex-basis:26px!important;height:43px!important;min-height:43px!important} } /* V6.5 R46 - Mobil dikey normal görünüm: sıkı masa, yukarı alınmış ıstaka ve cache-bust Yalnız max-width:700px + portrait + tam ekran olmayan görünüm. */ @media (max-width:700px) and (orientation:portrait){ /* R45'te kalan gereksiz dikey alanı kaldır. */ #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .premium-table-wrap{ margin-bottom:0!important; padding-bottom:0!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .premium-board{ min-height:450px!important; height:450px!important; max-height:450px!important; margin-top:4px!important; margin-bottom:0!important; border-radius:22px!important; } /* Oyuncuları merkeze yaklaştır; kartlar çakışmadan kompakt kalsın. */ #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.top{top:3px!important} #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.bottom{bottom:3px!important} #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right{ top:47%!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left{left:2px!important} #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right{right:2px!important} #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left .player-seat, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right .player-seat{ width:82px!important; max-width:82px!important; min-height:136px!important; height:136px!important; padding:5px 3px!important; gap:2px!important; border-radius:13px!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left .player-avatar, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right .player-avatar{ width:34px!important;height:34px!important;flex-basis:34px!important } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left .player-seat-info strong, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right .player-seat-info strong{ width:72px!important;max-width:72px!important;font-size:.63rem!important } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left .player-seat-info small, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right .player-seat-info small{ font-size:.54rem!important } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left .discard-slot, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right .discard-slot{ min-width:43px!important;min-height:49px!important;padding:2px!important } /* Üst ve alt oyuncu kartlarını daha ince tut. */ #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.top .player-seat, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.bottom .player-seat{ width:148px!important;max-width:148px!important;min-height:58px!important;padding:5px 6px!important } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.top .player-avatar, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.bottom .player-avatar{ width:37px!important;height:37px!important;flex-basis:37px!important } /* Orta oyun kontrollerini oyuncu kartlarının arasında dengeli tut. */ #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .board-center{ top:47%!important; transform:translate(-50%,-50%) scale(.57)!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .discard-drop-halo{ top:55%!important;width:122px!important;height:54px!important } /* Istakayı masaya yapıştır ve ekranda yukarı taşı. */ #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .premium-rack{ width:calc(100% - 16px)!important; margin:-10px auto 0!important; padding:5px 5px 5px!important; border-width:5px!important; border-radius:13px!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .rack-instruction{ margin:0 4px 3px!important;font-size:.55rem!important;line-height:1.12!important } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .okey-rack.dynamic-rack{ grid-template-rows:repeat(2,47px)!important; min-height:99px!important;height:99px!important; gap:1px!important;padding:2px 3px!important } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .rack-slot{ min-height:47px!important;height:47px!important } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .rack-slot .okey-tile{ width:min(100%,26px)!important;max-width:26px!important; height:41px!important;min-height:41px!important;flex-basis:26px!important } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .rack-slot .okey-tile>span{font-size:.9rem!important} #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .rack-slot .okey-tile>small{font-size:.38rem!important} } @media (max-width:390px) and (orientation:portrait){ #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .premium-board{ min-height:425px!important;height:425px!important;max-height:425px!important } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left .player-seat, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right .player-seat{ width:76px!important;max-width:76px!important;min-height:128px!important;height:128px!important } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .premium-rack{margin-top:-12px!important} #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .rack-slot .okey-tile{ width:min(100%,24px)!important;max-width:24px!important;flex-basis:24px!important;height:39px!important;min-height:39px!important } } /* V6.5 R47 - Mobil V2 normal/dikey masa yerleşimi Hedef: onaylanan önizlemedeki kompakt masa, dengeli oyuncular ve masaya bağlı ıstaka. KAPSAM KİLİDİ: yalnız portrait + max-width:700px + tam ekran olmayan görünüm. Mobil tam ekran ve masaüstü kuralları bu bloktan etkilenmez. */ @media (max-width:700px) and (orientation:portrait){ #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .premium-table-wrap{ position:relative!important; margin:4px 0 0!important; padding:0 0 0!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .premium-board{ min-height:372px!important; height:372px!important; max-height:372px!important; margin:0 8px!important; border-radius:22px!important; overflow:hidden!important; } /* Üst ve alt oyuncu: kısa yatay kart, masa ile bütünleşik. */ #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.top{ top:5px!important;left:50%!important;right:auto!important; transform:translateX(-50%)!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.bottom{ bottom:5px!important;left:50%!important;right:auto!important; transform:translateX(-50%)!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.top .player-seat, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.bottom .player-seat{ width:154px!important;max-width:154px!important; min-height:54px!important;height:54px!important; padding:4px 6px!important;gap:5px!important;border-radius:14px!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.top .player-avatar, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.bottom .player-avatar{ width:36px!important;height:36px!important;flex:0 0 36px!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.top .player-seat-info strong, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.bottom .player-seat-info strong{ max-width:62px!important;font-size:.72rem!important;line-height:1.05!important; white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.top .player-seat-info small, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.bottom .player-seat-info small{ font-size:.58rem!important;line-height:1!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.top .discard-slot, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.bottom .discard-slot{ min-width:39px!important;width:39px!important;min-height:45px!important;height:45px!important; padding:2px!important; } /* Yan oyuncular: ince dikey kart; merkez alanını kapatmaz. */ #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left{ left:4px!important;right:auto!important;top:49%!important; transform:translateY(-50%)!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right{ right:4px!important;left:auto!important;top:49%!important; transform:translateY(-50%)!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left .player-seat, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right .player-seat{ width:70px!important;max-width:70px!important; min-height:122px!important;height:122px!important; padding:5px 3px!important;gap:2px!important;border-radius:13px!important; display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:flex-start!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left .player-avatar, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right .player-avatar{ width:32px!important;height:32px!important;flex:0 0 32px!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left .player-seat-info, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right .player-seat-info{ width:64px!important;max-width:64px!important;text-align:center!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left .player-seat-info strong, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right .player-seat-info strong{ display:block!important;width:64px!important;max-width:64px!important; font-size:.59rem!important;line-height:1.05!important; white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left .player-seat-info small, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right .player-seat-info small{ font-size:.5rem!important;line-height:1!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left .bot-badge-ai, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right .bot-badge-ai{ font-size:.42rem!important;padding:0 .16rem!important;line-height:1.15!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left .discard-slot, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right .discard-slot{ margin-top:auto!important;min-width:43px!important;width:43px!important; min-height:48px!important;height:48px!important;padding:2px!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left .discard-slot-label, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right .discard-slot-label{ font-size:.38rem!important;line-height:1!important; } /* Merkez oyun kontrolleri ve atma alanı. */ #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .board-center{ top:49%!important;left:50%!important; transform:translate(-50%,-50%) scale(.53)!important; transform-origin:center!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .discard-drop-halo{ top:54%!important;left:50%!important;transform:translateX(-50%)!important; width:118px!important;height:50px!important; } /* Istaka masanın devamı gibi görünür; yukarıda ve merkezde. */ #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .premium-rack{ width:calc(100% - 20px)!important; margin:-2px auto 0!important; padding:5px!important;border-width:5px!important;border-radius:14px!important; box-sizing:border-box!important;overflow:hidden!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .rack-instruction{ display:flex!important;justify-content:space-between!important;gap:8px!important; margin:0 5px 3px!important;font-size:.5rem!important;line-height:1.05!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .okey-rack.dynamic-rack{ width:100%!important;box-sizing:border-box!important; grid-template-columns:repeat(15,minmax(0,1fr))!important; grid-template-rows:repeat(2,44px)!important; min-height:92px!important;height:92px!important; gap:1px!important;padding:2px 3px!important;overflow:hidden!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .rack-slot{ min-width:0!important;width:auto!important;min-height:44px!important;height:44px!important; display:flex!important;align-items:center!important;justify-content:center!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .rack-slot .okey-tile{ width:min(100%,23px)!important;max-width:23px!important;flex:0 0 23px!important; height:38px!important;min-height:38px!important;margin:0 auto!important; border-radius:5px!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .rack-slot .okey-tile>span{ font-size:.8rem!important;line-height:1!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .rack-slot .okey-tile>small{ font-size:.34rem!important; } } @media (max-width:390px) and (orientation:portrait){ #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .premium-board{ min-height:350px!important;height:350px!important;max-height:350px!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left .player-seat, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right .player-seat{ width:66px!important;max-width:66px!important;min-height:116px!important;height:116px!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left .player-seat-info, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right .player-seat-info, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.left .player-seat-info strong, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .opponent-zone.right .player-seat-info strong{ width:60px!important;max-width:60px!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .board-center{ transform:translate(-50%,-50%) scale(.49)!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .premium-rack{width:calc(100% - 12px)!important} #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .okey-rack.dynamic-rack{ grid-template-rows:repeat(2,42px)!important;min-height:88px!important;height:88px!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .rack-slot{min-height:42px!important;height:42px!important} #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .rack-slot .okey-tile{ width:min(100%,21px)!important;max-width:21px!important;flex-basis:21px!important; height:36px!important;min-height:36px!important; } } /* V6.5 R48 - Mobil dikey premium ıstaka ve çekilen taş önizlemesi. Yalnızca mobil normal/dikey görünümü etkiler; masaüstü ve mobil tam ekran korunur. */ @media (max-width:700px) and (orientation:portrait){ #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .premium-rack{ width:calc(100% - 14px)!important; margin:-2px auto 0!important; padding:8px 12px 10px!important; border-width:6px!important; border-radius:16px 16px 6px 6px!important; overflow:visible!important; background: linear-gradient(90deg,rgba(42,13,3,.72),transparent 5%,transparent 95%,rgba(42,13,3,.72)), linear-gradient(180deg,#d8944c 0,#a75a28 8%,#713516 16%,#a45a29 48%,#5b260e 52%,#955025 88%,#421a08 100%)!important; box-shadow:0 -7px 20px rgba(0,0,0,.42),inset 0 3px rgba(255,225,177,.42),inset 0 -7px 12px rgba(27,7,1,.62)!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .premium-rack::before, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .premium-rack::after{ content:"";position:absolute;z-index:5;top:39px;bottom:61px;width:22px; border:3px solid #351407;border-radius:8px; background:linear-gradient(90deg,#421909,#b86b32 45%,#e0a05c 60%,#672b11); box-shadow:inset 2px 0 rgba(255,223,174,.28),0 4px 9px rgba(0,0,0,.48); pointer-events:none; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .premium-rack::before{left:-12px} #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .premium-rack::after{right:-12px;transform:scaleX(-1)} #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .rack-instruction{ margin:0 2px 5px!important;font-size:.53rem!important;font-weight:700!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .okey-rack.dynamic-rack{ grid-template-columns:repeat(15,minmax(0,1fr))!important; grid-template-rows:repeat(2,54px)!important; min-height:113px!important;height:113px!important; gap:2px!important;padding:3px 4px!important;overflow:visible!important; background: linear-gradient(to bottom,rgba(58,20,6,.1) 0,rgba(44,13,3,.12) 47%,#3a1205 48%,#d28b47 50%,#5b240c 52%,rgba(45,13,3,.14) 100%), linear-gradient(180deg,#9f5729,#743617)!important; box-shadow:inset 0 5px 9px rgba(34,8,1,.56),inset 0 -4px 7px rgba(27,6,0,.45),inset 0 0 0 2px rgba(231,157,82,.22)!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .rack-slot{ min-width:0!important;width:auto!important;min-height:54px!important;height:54px!important; border-radius:5px!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .rack-slot .okey-tile{ width:min(100%,27px)!important;max-width:27px!important;flex:0 0 27px!important; height:48px!important;min-height:48px!important;margin:0 auto!important; border:1.5px solid #d9c28d!important;border-radius:6px!important; background:radial-gradient(ellipse at 30% 15%,rgba(255,255,255,.95),transparent 34%),linear-gradient(145deg,#fffef3,#f6edcf 52%,#dfca91)!important; box-shadow:0 3px 0 #9f8653,0 5px 6px rgba(0,0,0,.38),inset 1px 1px #fff,inset -1px -2px 3px rgba(117,91,43,.18)!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .rack-slot .okey-tile>span{ font-size:1.06rem!important;line-height:.95!important;font-weight:900!important; text-shadow:0 1px rgba(255,255,255,.75)!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .rack-slot .okey-tile>small{font-size:.3rem!important} #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .rack-slot .okey-tile::after{ width:7px!important;height:7px!important;bottom:4px!important; } /* Çekilen taş, kısa süre masanın ortasında yaklaşık 3 kat büyüklükte görünür. */ .r48-drawn-tile-preview{ position:fixed;z-index:10085;left:50%;top:48%; width:86px;height:128px;transform:translate(-50%,-50%) scale(.72); opacity:0;pointer-events:none;padding:0; border:4px solid #f1ddb0;border-radius:15px; background:radial-gradient(ellipse at 28% 14%,rgba(255,255,255,.98),transparent 34%),linear-gradient(145deg,#fffef2,#f5e9c2 53%,#d9bd78); box-shadow:0 10px 0 #94743c,0 18px 34px rgba(0,0,0,.62),0 0 0 5px rgba(255,221,139,.22),inset 2px 2px #fff; transition:opacity .16s ease,transform .22s cubic-bezier(.2,.9,.25,1.18); } .r48-drawn-tile-preview.show{opacity:1;transform:translate(-50%,-50%) scale(1)} .r48-drawn-tile-preview .okey-tile{ width:100%!important;height:100%!important;max-width:none!important;min-height:0!important; border:0!important;border-radius:11px!important;background:transparent!important;box-shadow:none!important; } .r48-drawn-tile-preview .okey-tile>span{font-size:3.75rem!important;font-weight:900!important;line-height:1!important} .r48-drawn-tile-preview .okey-tile>small{font-size:.72rem!important} .r48-drawn-tile-preview .okey-tile::after{width:23px!important;height:23px!important;bottom:13px!important} } /* V6.5 R49 - Mobil dikey çekme taşı dokunma alanı büyütme. KAPSAM KİLİDİ: yalnız mobil normal/dikey görünüm; ıstaka, oyuncular, masaüstü ve mobil tam ekran görünümü değiştirilmez. */ @media (max-width:700px) and (orientation:portrait){ #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .board-center .stock-ring{ padding:12px!important; min-width:120px!important; min-height:120px!important; display:grid!important; place-items:center!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) #drawStockButton.stock-stack{ width:96px!important; height:96px!important; min-width:96px!important; min-height:96px!important; border-radius:50%!important; cursor:pointer!important; touch-action:manipulation!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) #drawStockButton.stock-stack>span{ font-size:2.25rem!important; line-height:1!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) #drawStockButton.stock-stack>small{ font-size:.78rem!important; font-weight:900!important; line-height:1!important; } } /* V6.5 R50 - Mobil dikey ıstaka işlem düğmeleri simetri düzeltmesi. KAPSAM KİLİDİ: R48 premium ıstaka/taşlar ve R49 çekme taşı aynen korunur. Yalnızca mobil normal/dikey görünümde araç çubuğu düzenlenir. */ @media (max-width:700px) and (orientation:portrait){ #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .rack-toolbar.premium-toolbar{ display:grid!important; grid-template-columns:1fr 1fr!important; gap:8px!important; width:100%!important; margin-top:9px!important; align-items:stretch!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .rack-toolbar .toolbar-left, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .rack-toolbar .toolbar-right{ display:contents!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) #rackRowsButton{ display:none!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) #sortColorButton, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) #sortNumberButton, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) #discardButton, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) #declareButton{ width:100%!important; min-width:0!important; min-height:48px!important; margin:0!important; padding:9px 6px!important; border-radius:11px!important; display:flex!important; align-items:center!important; justify-content:center!important; font-size:.9rem!important; font-weight:900!important; line-height:1!important; text-align:center!important; white-space:nowrap!important; box-sizing:border-box!important; touch-action:manipulation!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) #sortColorButton{grid-column:1;grid-row:1} #okeyApp:not(:fullscreen):not(:-webkit-full-screen) #sortNumberButton{grid-column:2;grid-row:1} #okeyApp:not(:fullscreen):not(:-webkit-full-screen) #discardButton{grid-column:1;grid-row:2} #okeyApp:not(:fullscreen):not(:-webkit-full-screen) #declareButton{grid-column:2;grid-row:2} } /* V6.5 R51 - Yalnız masa çıkışı güvenli fallback ve tam okunur oyun uyarısı. */ #okeyApp #gameAlert.game-alert-visible{ position:fixed!important;z-index:10050!important;top:calc(env(safe-area-inset-top, 0px) + 66px)!important;left:50%!important;transform:translateX(-50%)!important; width:min(760px,calc(100vw - 24px))!important;max-width:calc(100vw - 24px)!important;min-height:48px!important;margin:0!important;padding:12px 16px!important; border-width:2px!important;border-radius:10px!important;box-shadow:0 10px 30px rgba(0,0,0,.48)!important;white-space:normal!important;overflow-wrap:anywhere!important; word-break:normal!important;line-height:1.35!important;font-size:clamp(.9rem,2.3vw,1rem)!important;text-align:left!important;opacity:1!important;pointer-events:none!important; } @media (max-width:700px){#okeyApp #gameAlert.game-alert-visible{top:calc(env(safe-area-inset-top, 0px) + 76px)!important;width:calc(100vw - 16px)!important;max-width:calc(100vw - 16px)!important;padding:11px 13px!important;}} /* V6.5 R53 - Mobil normal ekranda parmakla taş çekme ve taş atma. KAPSAM KİLİDİ: görsel ölçüler, ıstaka, oyuncular, masaüstü ve tam ekran değişmez. */ @media (max-width:700px) and (orientation:portrait){ #okeyApp:not(:fullscreen):not(:-webkit-full-screen) #drawStockButton.stock-stack, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) #drawDiscardButton.discard-slot, #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .rack-slot .okey-tile{ touch-action:none!important; -webkit-user-select:none!important; user-select:none!important; -webkit-touch-callout:none!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) .discard-drop-halo{ touch-action:none!important; } } /* V6.5 R58 - Mobil normal/dikey işlem önceliği. KAPSAM KİLİDİ: yalnızca dört ıstaka işlem düğmesinin satır sırası değişir. Masa, taşlar, ıstaka, çekme/atma sürüklemesi, tam ekran ve masaüstü korunur. */ @media (max-width:700px) and (orientation:portrait){ #okeyApp:not(:fullscreen):not(:-webkit-full-screen) #discardButton{ grid-column:1!important; grid-row:1!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) #declareButton{ grid-column:2!important; grid-row:1!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) #sortColorButton{ grid-column:1!important; grid-row:2!important; } #okeyApp:not(:fullscreen):not(:-webkit-full-screen) #sortNumberButton{ grid-column:2!important; grid-row:2!important; } }