/* NS Viewport Studio — Cihaz Stüdyosu v1.0.59 */
body.detail-shell{overflow:hidden;height:100vh}
.studio-bar-left{display:flex;align-items:center;gap:12px}
.bar-spacer{flex:1}
.dh{padding:18px 20px 14px;border-bottom:1px solid var(--br-1)}
.dh-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.dh-title{font-size:15px;font-weight:800;letter-spacing:-.4px;color:var(--tx-1)}
.dh-hint{font-size:12px;color:var(--tx-3);margin-bottom:14px}
.ref-g3{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.badge-ref-active{margin-bottom:6px;display:inline-flex;font-size:9px}
.ref-spacer{height:20px}
.burger-line-16{width:16px}.burger-line-11{width:11px}
.ph-card-ico-blue{background:var(--g-blue)}
.ph-card-ico-green{background:var(--g-green)}
.ph-card-line.w70{width:70%}.ph-card-line.w45{width:45%}
.studio-export-formats{margin-bottom:14px}
.dim-title{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:var(--tx-3);margin-bottom:8px}
.range-limit{font-size:10px;color:var(--tx-4)}
.studio-export-btn{margin-top:14px}
.cdot-color-a{background:#1e3048}.cdot-color-b{background:#2d3d56}.cdot-color-c{background:var(--blue)}.cdot-color-d{background:#20c997}
.bg-swatch{width:22px;height:15px;background:var(--bg-0);border:1px solid var(--br-2);border-radius:3px;cursor:pointer}
.safe-swatch{width:22px;height:15px;background:var(--green);border:1px solid var(--green-a20);border-radius:3px;cursor:pointer}
.studio-select{background:var(--bg-3);border:1px solid var(--br-2);color:var(--tx-2);border-radius:var(--r6);padding:3px 7px;font-size:11px;font-family:var(--font)}
@media(max-width:900px){body.detail-shell{overflow:auto;height:auto}.page-fixed{height:auto;min-height:100vh;overflow:visible}.cp{min-height:620px}.bar-right{display:none}}

/* v1.0.64 — Stüdyo büyük cihaz alanı premium mockup motoru */
.studio-preview-shell{width:min(72vw,560px);height:min(68vh,610px);display:flex;align-items:center;justify-content:center;position:relative;transition:transform .4s cubic-bezier(.34,1.1,.64,1),filter var(--ease)}
.studio-preview-shell::before{content:'';position:absolute;inset:4% 8%;border-radius:48%;background:radial-gradient(circle,rgba(77,141,246,.18),transparent 62%);filter:blur(20px);opacity:.72;pointer-events:none}
.studio-device-preview{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;width:100%;height:100%;transform-origin:center center}
.studio-device-preview svg{max-width:92%;max-height:92%;width:auto;height:auto;filter:drop-shadow(0 28px 34px rgba(3,8,20,.55))}
.studio-preview-shell.is-landscape{width:min(78vw,680px)}
.studio-preview-shell.is-watch .studio-device-preview svg{max-width:54%;max-height:74%}
.studio-preview-shell.is-phone .studio-device-preview svg{max-width:48%;max-height:92%}
.studio-preview-shell.is-fold .studio-device-preview svg{max-width:66%;max-height:88%}
.studio-preview-shell.is-tablet .studio-device-preview svg{max-width:74%;max-height:88%}
.studio-preview-shell.is-laptop .studio-device-preview svg{max-width:88%;max-height:84%}
.studio-preview-shell.is-monitor .studio-device-preview svg,.studio-preview-shell.is-ultrawide .studio-device-preview svg,.studio-preview-shell.is-tv .studio-device-preview svg{max-width:94%;max-height:84%}
@media(max-width:900px){.studio-preview-shell{width:100%;height:520px}.studio-preview-shell.is-phone .studio-device-preview svg{max-width:58%}.studio-preview-shell.is-watch .studio-device-preview svg{max-width:66%}}

/* v1.0.67 — Sunum görünümünde seçili cihazı öne çıkar */
body.present-view .studio-preview-shell{width:min(78vw,620px);height:min(72vh,660px)}
body.present-view .studio-device-preview svg{filter:drop-shadow(0 34px 42px rgba(3,8,20,.62))}
body.present-view .bar-crumb{color:var(--blue-2)}
body.present-view .studio-preview-shell.is-watch .studio-device-preview svg{max-width:60%;max-height:78%}

/* v1.0.68 — Detay/Sunum ekranında saat assetleri */
.studio-device-preview .watch-prototype-asset{width:100%!important;height:100%!important;display:flex;align-items:center;justify-content:center;position:relative}
.studio-device-preview .watch-prototype-asset::before{content:'';position:absolute;inset:auto 22% 7% 22%;height:28px;background:radial-gradient(ellipse,rgba(3,8,20,.42),transparent 72%);filter:blur(12px);z-index:-1}
.studio-device-preview .watch-prototype-asset img{max-width:100%;max-height:100%;object-fit:contain;filter:drop-shadow(0 30px 38px rgba(3,8,20,.58))}
body.present-view .studio-device-preview .watch-prototype-asset img{filter:drop-shadow(0 38px 48px rgba(3,8,20,.64))}


/* v1.0.69 — Detay/Sunum saat cihaz asset büyütme */
.studio-preview-shell.is-watch .watch-prototype-asset{width:min(58vw,420px)!important;height:min(72vh,620px)!important}
body.present-view .studio-preview-shell.is-watch .watch-prototype-asset{width:min(64vw,460px)!important;height:min(76vh,660px)!important}


/* v1.0.71 — detay/sunum gerçek saat asset görünürlüğü */
body.present-view .studio-preview-shell.is-watch .watch-prototype-asset{width:min(74vw,540px)!important;height:min(82vh,760px)!important}

/* v1.0.71 — Detay/Sunum: canlı ekranlı inline SVG saat */
.studio-preview-shell.is-watch .watch-svg-prototype{width:100%!important;height:100%!important;display:flex;align-items:center;justify-content:center}
.studio-preview-shell.is-watch .watch-svg-prototype svg[data-live-watch-screen="true"]{width:76%!important;height:92%!important;max-width:76%!important;max-height:92%!important;filter:drop-shadow(0 34px 42px rgba(3,8,20,.62))}
body.present-view .studio-preview-shell.is-watch .watch-svg-prototype svg[data-live-watch-screen="true"]{width:84%!important;max-width:84%!important;height:96%!important;max-height:96%!important}
.studio-preview-shell.is-watch .watch-prototype-asset,.studio-preview-shell.is-watch .watch-prototype-asset img{display:none!important}

/* v1.0.72 — Detay/Sunum içinde canlı URL ekran katmanı */
.studio-device-preview .live-device-prototype{position:relative;display:flex;align-items:center;justify-content:center;overflow:visible;isolation:isolate}
.studio-device-preview .device-shell-visual{position:absolute;inset:0;width:100%!important;height:100%!important;z-index:1;pointer-events:none;overflow:visible}
.studio-device-preview .live-screen-layer{position:absolute;z-index:2;overflow:hidden;background:#07111f;border:1px solid rgba(255,255,255,.12);box-shadow:inset 0 0 0 1px rgba(255,255,255,.04);pointer-events:none}
.studio-device-preview .live-screen-frame{position:absolute;left:0;top:0;border:0;background:#07111f;pointer-events:none}
.studio-device-preview .live-screen-url-badge{position:absolute;left:6px;bottom:6px;z-index:3;font-size:8px;font-weight:900;letter-spacing:.42px;color:#eaf4ff;background:rgba(10,20,36,.76);border:1px solid rgba(255,255,255,.16);border-radius:999px;padding:4px 6px;backdrop-filter:blur(6px)}
.studio-preview-shell .live-device-prototype{transform:scale(1.24)}
.studio-preview-shell.is-watch .live-device-prototype{transform:scale(1.18)}
body.present-view .studio-preview-shell .live-device-prototype{transform:scale(1.34)}

/* v1.0.73 — Premium Kare 46mm sunum/stüdyo odak */

/* v1.0.76 — detay/sunum preview mode görünürlük desteği */
body[data-preview-mode="safe"] .studio-preview-shell::after{content:'Güvenli önizleme modu';position:absolute;right:18px;bottom:18px;padding:7px 10px;border-radius:999px;background:rgba(245,158,11,.88);color:#101624;font-size:11px;font-weight:800;letter-spacing:.02em;box-shadow:0 12px 24px rgba(0,0,0,.20)}
body[data-preview-mode="iframe"] .studio-preview-shell::after{content:'Canlı iframe modu';position:absolute;right:18px;bottom:18px;padding:7px 10px;border-radius:999px;background:rgba(34,197,94,.88);color:#06140d;font-size:11px;font-weight:800;letter-spacing:.02em;box-shadow:0 12px 24px rgba(0,0,0,.20)}



/* v1.0.94 — detay/present görünümünde saat ekranı doğrudan etkileşimli */
.studio-device-preview .live-screen-layer,
.studio-device-preview .live-screen-frame{
  pointer-events:auto!important;
  touch-action:auto!important;
  background:#000!important;
}
.studio-device-preview .watch-screen-glass{background:transparent!important;box-shadow:none!important;border:0!important}
.studio-device-preview .live-screen-url-badge{display:none!important}


/* v1.0.94 — Detay/Sunum ekranında saat prototipi gerçek etkileşim ve premium siyah ekran */
.studio-preview-shell.is-watch{
  background:
    radial-gradient(circle at 50% 22%,rgba(59,130,246,.18),transparent 36%),
    linear-gradient(180deg,rgba(255,255,255,.96),rgba(236,242,252,.94));
}
.studio-device-preview .live-screen-layer{
  background:#000!important;
  border:0!important;
  box-shadow:none!important;
  pointer-events:auto!important;
  touch-action:auto!important;
  overscroll-behavior:contain;
}
.studio-device-preview .live-screen-frame{pointer-events:auto!important;background:#000!important}
.studio-device-preview .watch-screen-glass{display:none!important}
.studio-device-preview .watch-control-zone{pointer-events:auto!important}
