/* Ana sayfa: PANEL panosu. Gerçek personel Paneli (örnek veriyle) bir tablet gövdesinde; numaralı bölgeler pano satırlarıyla eşleşir (panel.js). */
.panel-ic { display: grid; grid-template-columns: minmax(0, 1.8fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 56px); align-items: start; margin-top: 18px; }
.tablet-yuva { margin: 0; min-width: 0; }
.tablet {
  position: relative; background: var(--murekkep-2); border-radius: 14px; padding: clamp(9px, 1.5vw, 17px) clamp(9px, 1.5vw, 17px) clamp(9px, 1.5vw, 17px) clamp(15px, 2.2vw, 26px);
  box-shadow: 0 30px 60px -30px rgba(17,42,74,.55), 0 2px 4px rgba(0,0,0,.2), inset 0 0 0 2px var(--oluk-koyu), inset 0 0 0 4px rgba(255,255,255,.08);
}
/* ön kamera */
.tablet::before { content: ""; position: absolute; left: clamp(5px, .8vw, 10px); top: 50%; width: 7px; height: 7px; margin-top: -3.5px; border-radius: 50%; background: var(--murekkep); box-shadow: inset 0 0 0 1.5px var(--oluk-koyu); }
.tablet-ekran { position: relative; aspect-ratio: 1180 / 820; overflow: hidden; border-radius: 4px; background: var(--zemin); box-shadow: inset 0 0 0 1px rgba(0,0,0,.35); }
.tablet-olcek { position: absolute; left: 0; top: 0; width: 1180px; height: 820px; transform-origin: 0 0; transform: scale(var(--olcek, .5)); }
.tablet-olcek iframe { display: block; width: 1180px; height: 820px; border: 0; background: var(--zemin); pointer-events: none; }
@media (hover: hover) and (pointer: fine) and (min-width: 901px) { .tablet-olcek iframe { pointer-events: auto; } }
.pn-isaret { position: absolute; inset: 0; pointer-events: none; }
.isaret { position: absolute; border-radius: 14px; opacity: 1; transition: background .3s var(--ease), outline-color .3s var(--ease); outline: 6px solid transparent; outline-offset: -3px; }
.isaret.etkin { background: color-mix(in srgb, var(--kehribar) 14%, transparent); outline-color: var(--kehribar); }
.isaret b { position: absolute; left: 8px; top: 8px; min-width: 38px; height: 38px; padding: 0 6px; border-radius: 19px; background: var(--murekkep); color: var(--beyaz); font: 800 24px/38px "Barlow Condensed", sans-serif; text-align: center; letter-spacing: .02em; box-shadow: 0 3px 8px rgba(17,42,74,.35); transition: transform .3s var(--ease), background .3s var(--ease); }
.isaret.etkin b { background: var(--kehribar-koyu); transform: scale(1.18); }
.tablet-alt { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 18px; margin-top: 14px; }
.tablet-not { margin: 0; font-size: 13px; color: var(--soluk); max-width: 52ch; }
.tablet-alt .tent { min-height: 46px; padding: 0 16px; font-size: 15px; }
.panel-liste .sm-isim b { font-weight: 700; }
.panel-liste .satir-m { cursor: default; }
@media (max-width: 900px) {
  .panel-ic { grid-template-columns: 1fr; gap: 22px; }
  .isaret b { min-width: 46px; height: 46px; font-size: 30px; line-height: 46px; border-radius: 23px; }
}
@media (prefers-reduced-motion: reduce) { .isaret, .isaret b { transition: none; } }