:root{--adk-bg:#0f1724;--adk-accent:#ff7a59;--adk-ink:#f8fafc;--adk-muted:#9aa6b2;--adk-backdrop:rgba(5,10,18,0.6);--adk-radius:14px;--adk-shadow:0 10px 30px rgba(2,6,23,0.6);--adk-maxwidth:1100px}
.adk-modal{position:fixed;inset:0;display:none;align-items:center;justify-content:center;z-index:99999}
.adk-modal[aria-hidden="false"]{display:flex}
.adk-modal-backdrop{position:absolute;inset:0;background:var(--adk-backdrop);transition:opacity .2s}
.adk-modal-panel{position:relative;width:100%;height:100vh;max-height:100vh;background:linear-gradient(180deg,rgba(255,255,255,0.02),rgba(255,255,255,0.01));border-radius:0;overflow:hidden;box-shadow:var(--adk-shadow);border:0;display:flex;flex-direction:column}
.adk-modal-header{position:relative;display:flex;align-items:center;justify-content:space-between;padding:10px 14px;gap:12px;background:rgba(15,23,36,0.6);backdrop-filter:blur(6px);z-index:2}
.adk-title{color:var(--adk-ink);font-weight:700;font-size:16px}
.adk-controls{display:flex;gap:8px;align-items:center}
.adk-device-buttons{position:absolute;left:50%;transform:translateX(-50%);display:flex;gap:6px;border-radius:10px;padding:6px 8px;background:rgba(22,30,42,0.5);box-shadow:0 6px 14px rgba(0,0,0,0.35);border:1px solid rgba(255,255,255,0.08)}
.adk-device{border:none;padding:6px 10px;border-radius:8px;cursor:pointer;font-weight:600;background:var(--adk-device-bg,#FF7A00);color:var(--adk-device-color,#fff)}
.adk-device:hover{background:var(--adk-device-hover-bg,#000);color:var(--adk-device-hover-color,#fff)}
.adk-device[aria-pressed="true"]{box-shadow:0 4px 10px rgba(0,0,0,0.35);outline:2px solid rgba(255,255,255,0.08)}
.adk-close{background:var(--adk-close-bg,#1b2432);border:1px solid rgba(255,255,255,0.08);padding:6px 8px;border-radius:12px;color:var(--adk-close-color,#fff);cursor:pointer;font-size:18px;line-height:1}
.adk-close:hover{background:var(--adk-close-hover-bg,#000);color:var(--adk-close-hover-color,#fff)}
.adk-modal-body{display:flex;flex-direction:column;gap:8px;padding:12px;flex:1;min-height:0;height:100%}
.adk-viewport-wrap{background:#07101a;border-radius:10px;overflow:hidden;border:1px solid rgba(255,255,255,0.03);display:flex;justify-content:center;align-items:center;flex:1;min-height:0;height:100%}
.adk-viewport-inner{display:flex;justify-content:center;align-items:center;background:#0a0a0a;border-radius:24px;padding:10px;box-shadow:0 20px 40px rgba(2,6,23,0.6);transform-origin:center center}
.adk-viewport-wrap iframe{width:100%;height:100%;border:0;display:block;border-radius:8px}
.adk-modal-footer{display:none}
@media (min-width:900px){.adk-viewport-wrap{height:100%}}
.adk-viewport-wrap.device-desktop{padding:0}
.adk-viewport-wrap.device-tablet{max-width:100%;margin:0 auto}
.adk-viewport-wrap.device-mobile{max-width:100%;margin:0 auto}
.adk-viewport-inner.device-desktop{border-radius:0;padding:0;background:transparent;border:none;position:relative;box-shadow:none}
.adk-viewport-inner.device-desktop:after{content:none}
.adk-viewport-inner.device-tablet{border-radius:18px;padding:10px;background:linear-gradient(145deg,#1c2330,#2b3547);border:1.5px solid #2d3a50}
.adk-viewport-inner.device-mobile{border-radius:26px;padding:10px;position:relative;background:linear-gradient(145deg,#1a202b,#2a3342);border:1.5px solid #2a3446;box-shadow:0 10px 22px rgba(0,0,0,0.45), inset 0 0 8px rgba(255,255,255,0.05)}
.adk-viewport-inner.device-mobile:before{content:"";position:absolute;top:8px;left:50%;transform:translateX(-50%);width:76px;height:14px;background:linear-gradient(180deg,rgba(0,0,0,0.8),rgba(0,0,0,0.95));border-radius:9px}
.adk-viewport-inner.device-mobile:after{content:"";position:absolute;top:12px;right:38px;width:10px;height:10px;background:radial-gradient(circle at 30% 30%,#6aa0ff 0,#2c3e55 60%,#0b121c 100%);border-radius:50%;box-shadow:0 0 6px rgba(106,160,255,0.4)}