/* ===== Okey / 101 masa çerçevesi (okey-shell.js): yeşil masa, kırmızı bilgi paneli, yeşil araç çubuğu, Bot + / Bot −, pencereler.
   Yalnızca .osh-on ekranlar (Okey, 101, Pişti). Geniş ekran .osh-wide (masa alanı ≥900px ve ≥560px yükseklik). ===== */
.ok-screen.osh-on{background:
  repeating-linear-gradient(45deg,#ffffff06 0 2px,transparent 2px 9px),
  repeating-linear-gradient(-45deg,#00000010 0 2px,transparent 2px 9px),
  radial-gradient(ellipse at 50% 42%,#167246 0%,#0e5434 55%,#083822 100%)}
.osh-on .ok-in{position:relative}
.osh-on .ok-info small{color:#d6eedd}
.osh-on .ok-ind small,.osh-on .ok-pile small{color:#d6eedd}
/* üst çubuktaki eski ▶ / ⚙ / ✕ düğmeleri araç çubuğuna taşındı */
.osh-on .ok-bar>.okb:not(.ok-back):not(.osh-more):not(.osh-keep):not(.tc-btn){display:none}

/* Kırmızı bilgi paneli */
.osh-info{background:#c4111d;color:#fff;border-radius:4px;box-shadow:0 2px 8px #0008;padding:5px 8px;font-size:13px;line-height:1.45;font-family:Georgia,"Times New Roman",serif;width:max-content;max-width:150px}
.osh-info div{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.osh-info .osh-bold{font-weight:bold;font-size:14px}
.osh-info .osh-dim{color:#ffd5d8;font-size:12px}

/* Yeşil araç çubuğu */
.osh-tools{display:flex;gap:6px}
.osh-b{display:flex;align-items:center;gap:8px;width:46px;height:46px;padding:0;justify-content:center;border:1px solid #ffffff55;border-radius:4px;cursor:pointer;
  background:linear-gradient(#2fa557,#14742f);box-shadow:0 2px 5px #0008;color:#fff;font-weight:bold;font-size:14px}
.osh-b svg{width:30px;height:30px;flex:0 0 30px;filter:drop-shadow(0 1px 1px #0007)}
.osh-b .osh-l{display:none}
.osh-b:active{filter:brightness(.88)}
.osh-b.hidden{display:none}
.osh-start{border:2px solid #d0162a}
.osh-more{background:#14742f}

/* Geniş ekran: panel solda, araçlar sağda (ayrılmış kenar boşluğunda; koltuklarla çakışmaz) */
.osh-wide .ok-in{max-width:1180px;padding-left:162px;padding-right:64px}
.osh-wide .osh-info{position:absolute;left:8px;top:56px}
.osh-wide .osh-tools{position:absolute;right:8px;top:6px;flex-direction:column}
.osh-wide .osh-more{display:none}

/* Dar ekran: başlığa dokun = bilgi paneli, ⋮ = araç listesi (açılır) */
.osh-on:not(.osh-wide) .ok-info{cursor:pointer}
.osh-on:not(.osh-wide) .ok-info b::after{content:" ▾";font-size:11px;color:#ffd5d8}
.osh-on:not(.osh-wide) .osh-info{display:none;position:absolute;left:6px;top:50px;z-index:65;max-width:none}
.osh-on.osh-info-open:not(.osh-wide) .osh-info{display:block}
.osh-on:not(.osh-wide) .osh-tools{display:none;position:absolute;right:6px;top:50px;z-index:65;flex-direction:column;background:#06301bf2;border:1px solid #ffffff44;border-radius:8px;padding:6px;box-shadow:0 6px 18px #000c}
.osh-on.osh-tools-open:not(.osh-wide) .osh-tools{display:flex}
.osh-on:not(.osh-wide) .osh-b{width:auto;min-width:190px;height:42px;justify-content:flex-start;padding:0 10px}
.osh-on:not(.osh-wide) .osh-b .osh-l{display:inline}
.osh-on:not(.osh-wide) .osh-b.hidden{display:none}

/* Koltuk: sarı Bot + / Bot − */
.osh-bot{flex:0 0 auto;border:1px solid #9c7a00;border-radius:4px;background:linear-gradient(#ffd84a,#e8b400);color:#2a1c00;font-weight:bold;font-size:12px;padding:3px 8px;cursor:pointer;white-space:nowrap;box-shadow:0 1px 3px #0007}
.osh-bot:active{filter:brightness(.9)}
.ok-seat.h .osh-bot{margin-left:auto}
.ok-seat.v .osh-bot{padding:3px 4px;font-size:11px}
.osh-on .ok-seat.empty{opacity:1}
.osh-on .ok-seat.empty .sav{background:#ffffff14;color:#ffffff88}

/* Pencere (masa alanında) */
.osh-dlg{position:absolute;inset:0;z-index:80;background:#0008;display:grid;place-items:center;padding:10px;box-sizing:border-box}
.osh-dbox{position:relative;background:#0b2a1a;border:2px solid #f2c230;border-radius:12px;box-shadow:0 8px 24px #000d;padding:12px 14px;width:min(380px,100%);max-height:100%;display:flex;flex-direction:column;box-sizing:border-box;color:#fff;font-size:14px}
.osh-dbox h3{margin:0 26px 8px 0;font-size:16px;color:#ffe08a}
.osh-dbox h4{margin:10px 0 4px;font-size:13px;color:#ffd5d8}
.osh-dbody{overflow:auto;min-height:0}
.osh-x{position:absolute;right:6px;top:4px;width:30px;height:30px;border:0;background:none;color:#fff;font-size:24px;cursor:pointer;line-height:1}
.osh-dbtn{display:flex;justify-content:flex-end;gap:8px;margin-top:10px}
.osh-form{display:flex;flex-direction:column;gap:8px}
.osh-row{display:flex;align-items:center;gap:8px;font-weight:bold}
.osh-row select,.osh-form input[type=text]{height:34px;border-radius:6px;border:1px solid #6b8; background:#fff;color:#111;font-size:14px;padding:0 8px;min-width:0}
.osh-form input[type=text]:disabled{opacity:.5}
.osh-chk{display:flex;align-items:center;gap:6px;cursor:pointer}
.osh-chk input{width:18px;height:18px;flex:0 0 18px}
.osh-note{margin:0 0 6px;font-size:12px;color:#cfe8d6;line-height:1.4}
.osh-empty{margin:6px 0;color:#cfe8d6;font-style:italic}
.osh-prow{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:5px 0;border-bottom:1px solid #ffffff1c}
.osh-prow span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:bold}
.osh-prow .oka{height:32px;min-width:0;font-size:13px}
.oka.osh-red{background:#c4111d}
.osh-score table{width:100%;border-collapse:collapse;font-size:13px;margin-bottom:8px}
.osh-score th,.osh-score td{padding:4px 5px;border-bottom:1px solid #ffffff1c;text-align:left;max-width:90px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.osh-score th.me{color:#6ee08b}
.osh-score td.n{text-align:right;font-variant-numeric:tabular-nums}
.osh-score tr.tot td{font-weight:bold;color:#ffe08a;border-top:2px solid #f2c23088}
@media(max-width:620px){
  .osh-info{font-size:12.5px}
}
/* Pişti: çerçeve geniş ekranda masa alanının kenarlarında */
.pi-screen.osh-wide .ok-in{max-width:1180px}