:root{color-scheme:dark;--bg:#0d0b12;--panel:#17131e;--panel2:#1d1826;--line:#30283a;--text:#f8f4fa;--muted:#9d93a6;--purple:#9b62f5;--pink:#e95aa9;--green:#4add9e;--red:#ff718e}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 85% -15%,#6623aa44,transparent 33%),radial-gradient(circle at -10% 110%,#a9256844,transparent 28%),var(--bg);color:var(--text);font-family:Tahoma,Arial,sans-serif;min-height:100vh}button,textarea{font:inherit}button{cursor:pointer}main{max-width:1100px;margin:auto;min-height:100vh;padding:0 24px 60px}header{height:82px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:11px}.brand>span{width:39px;height:39px;border-radius:12px;display:grid;place-items:center;font-weight:900;background:linear-gradient(140deg,var(--purple),var(--pink));box-shadow:0 7px 24px #a24fff44}.brand b,.brand small{display:block}.brand small{color:var(--muted);font-size:10px;margin-top:3px}.status{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:11px;border:1px solid var(--line);padding:8px 11px;border-radius:30px}.status i{width:7px;height:7px;border-radius:50%;background:#6f6875}.status.online{color:#79e8ba}.status.online i{background:var(--green);box-shadow:0 0 10px var(--green)}.pair-view{min-height:calc(100vh - 142px);display:grid;grid-template-columns:1.05fr .95fr;gap:60px;align-items:center}.pair-copy .eyebrow{display:inline-block;color:#c8a9fb;border:1px solid #9b62f544;background:#9b62f513;border-radius:30px;padding:7px 12px;font-size:11px}.pair-copy h1{font-size:clamp(42px,6vw,67px);line-height:1.15;letter-spacing:-2px;margin:22px 0}.pair-copy h1 em{font-style:normal;color:transparent;background:linear-gradient(90deg,#b880ff,#f06aad);background-clip:text}.pair-copy>p:last-child{color:var(--muted);line-height:1.9;max-width:560px}.pair-card{background:linear-gradient(145deg,#1b1623,#131018);border:1px solid var(--line);border-radius:25px;padding:28px;box-shadow:0 30px 80px #0006}.pair-card label{display:block;margin-bottom:10px;font-size:12px;color:#d9cfe0}.pair-card textarea{width:100%;resize:none;border:1px solid var(--line);border-radius:14px;background:#0e0b12;color:var(--text);padding:14px;outline:0;direction:ltr;text-align:left;font-size:11px}.pair-card textarea:focus{border-color:var(--purple);box-shadow:0 0 0 3px #9b62f51b}.primary{border:0!important;color:white!important;background:linear-gradient(100deg,#8f59f6,#cf55b2)!important;font-weight:700}.pair-card .primary{width:100%;padding:14px;border-radius:13px;margin-top:12px}.security-note,.hint{font-size:10px;color:var(--muted);line-height:1.7}.hidden{display:none!important}.app-view{padding-top:26px}.app-view>nav{display:flex;gap:6px;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:5px;width:max-content}.app-view>nav button{border:0;color:var(--muted);background:transparent;padding:9px 15px;border-radius:10px;font-size:11px}.app-view>nav button.active{background:var(--panel2);color:var(--text)}.app-view>nav b{background:#31283c;padding:2px 7px;border-radius:10px;margin-right:5px}.tab{display:none;padding-top:34px}.tab.active{display:block}.section-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.section-head small{color:#b181f8}.section-head h1{margin:5px 0 0;font-size:27px}.section-head>span{color:var(--muted);font-size:10px}.editor{height:48vh;min-height:310px;border:1px solid var(--line);border-radius:21px;background:var(--panel);overflow:hidden;box-shadow:0 25px 70px #0003}.editor textarea{width:100%;height:calc(100% - 44px);resize:none;border:0;background:transparent;color:var(--text);padding:25px;outline:0;font-size:16px;line-height:1.9}.editor textarea::placeholder{color:#675e70}.editor footer{height:44px;border-top:1px solid var(--line);display:flex;align-items:center;gap:17px;padding:0 18px;color:var(--muted);font-size:9px;background:var(--panel2)}.actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:13px}.actions button,.danger.wide{border:1px solid var(--line);background:var(--panel);color:var(--muted);border-radius:11px;padding:11px 15px;font-size:11px}.actions .danger,.danger.wide{color:var(--red);border-color:#ff718e3d}.hint{margin:13px 3px}.history{display:grid;gap:10px}.history article{border:1px solid var(--line);background:var(--panel);border-radius:16px;padding:16px}.history article p{white-space:pre-wrap;line-height:1.7;margin:0 0 13px;max-height:110px;overflow:hidden}.history article footer{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:9px}.history article footer span:first-child{margin-left:auto}.history button{border:0;background:var(--panel2);color:#c9adf5;border-radius:8px;padding:7px 10px;font-size:9px}.history button.delete{color:var(--red)}.empty{text-align:center;color:var(--muted);padding:60px 0}.settings-card{border:1px solid var(--line);background:var(--panel);border-radius:17px;padding:20px;margin-bottom:12px}.settings-card h2{font-size:14px;margin-top:0}.settings-card p,.settings-card li{font-size:11px;color:var(--muted);line-height:1.9}.danger.wide{width:100%;margin-top:12px;background:transparent}.toast{position:fixed;bottom:25px;left:25px;right:25px;max-width:430px;margin:auto;background:#251d30;border:1px solid #785c92;border-radius:13px;padding:13px 17px;text-align:center;font-size:11px;box-shadow:0 20px 50px #0008;z-index:10}@media(max-width:720px){main{padding:0 16px 45px}header{height:70px}.brand small{display:none}.status span{font-size:0}.status span:after{content:"الحالة";font-size:10px}.pair-view{grid-template-columns:1fr;gap:25px;padding:45px 0;align-content:center}.pair-copy h1{font-size:43px}.pair-copy>p:last-child{font-size:13px}.app-view>nav{width:100%}.app-view>nav button{flex:1;padding:9px 5px}.tab{padding-top:27px}.editor{height:50vh}.actions button{flex:1;min-width:45%}.section-head h1{font-size:22px}}

/* ===================================================================
   إضافات DropPad v2 — شاشات الأجهزة والملفات والاقتران.
   تستخدم متغيرات التصميم الأصلية نفسها بلا أي تغيير على الهوية.
   =================================================================== */

/* أزرار وحقول مشتركة */
.wide{width:100%}
button.wide,.pair-card button.wide{padding:14px;border-radius:13px;margin-top:10px;border:1px solid var(--line);background:var(--panel);color:var(--text);font-size:12px}
.pair-card .primary.wide{border:0;color:#fff}
.link-btn{display:block;margin:14px auto 0;border:0;background:none;color:var(--muted);font-size:11px;text-decoration:underline}
.ghost-btn{border:1px solid var(--line);background:var(--panel);color:var(--muted);border-radius:11px;padding:9px 14px;font-size:11px}
.divider{display:flex;align-items:center;gap:12px;margin:16px 0;color:var(--muted);font-size:10px}
.divider:before,.divider:after{content:"";flex:1;height:1px;background:var(--line)}
.choice .security-note{margin:10px 2px 0}

.code-input{width:100%;border:1px solid var(--line);border-radius:14px;background:#0e0b12;color:var(--text);padding:16px;outline:0;
  direction:ltr;text-align:center;font-size:26px;letter-spacing:7px;font-weight:700;text-transform:uppercase}
.code-input:focus{border-color:var(--purple);box-shadow:0 0 0 3px #9b62f51b}
.pair-card label{display:block;margin-bottom:10px;font-size:12px;color:#d9cfe0}

.inline-form{display:flex;gap:8px}
.inline-form input{flex:1;min-width:0;border:1px solid var(--line);border-radius:11px;background:#0e0b12;color:var(--text);padding:11px 13px;outline:0;font-size:12px}
.inline-form input:focus{border-color:var(--purple)}
.inline-form button{border-radius:11px;padding:11px 18px;font-size:11px}

/* عدّادات المحرر */
.editor footer span{white-space:nowrap}
.limit-count{margin-right:auto;color:#7d7488}
.limit-count.warn{color:#ffc46b}
.limit-count.over{color:var(--red);font-weight:700}
.editor.over{border-color:#ff718e66;box-shadow:0 0 0 3px #ff718e1a}

/* السجل: من أرسل ومتى */
.history article .meta{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:9px;margin-bottom:9px}
.history article .meta b{color:#c9adf5;font-weight:600}
.history article .meta .sep{opacity:.45}
.history article .meta .self{background:#9b62f52e;color:#d3b6ff;border-radius:20px;padding:2px 8px}
.history article p{max-height:150px}
.history article.long p{max-height:none}
.expand-btn{border:0;background:none;color:#c9adf5;font-size:9px;padding:0;margin-bottom:10px;text-decoration:underline}

/* منطقة رفع الملفات */
.drop-zone{border:1px dashed #3d3349;border-radius:19px;background:var(--panel);padding:30px 20px;text-align:center;transition:border-color .15s,background .15s}
.drop-zone.hover{border-color:var(--purple);background:#1c1626}
.drop-zone b{display:block;font-size:14px;margin-bottom:6px}
.drop-zone>span{display:block;color:var(--muted);font-size:10px;margin-bottom:12px}
.drop-zone .primary{padding:11px 22px;border-radius:12px;font-size:12px}
.drop-zone .security-note{margin-top:13px}

.uploads{display:grid;gap:8px;margin-top:12px}
.upload-row{border:1px solid var(--line);background:var(--panel);border-radius:13px;padding:12px 15px}
.upload-row .row{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:10px;color:var(--muted)}
.upload-row .row b{color:var(--text);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.progress{height:4px;border-radius:4px;background:#2a2235;margin-top:9px;overflow:hidden}
.progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--purple),var(--pink));transition:width .18s}
.upload-row.failed .progress i{background:var(--red)}

/* بطاقات الملفات */
.files{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:11px;margin-top:13px}
.file-card{border:1px solid var(--line);background:var(--panel);border-radius:16px;overflow:hidden;display:flex;flex-direction:column}
.file-card .thumb{height:132px;background:#0f0c14;display:grid;place-items:center;overflow:hidden}
.file-card .thumb img,.file-card .thumb video{width:100%;height:100%;object-fit:cover}
.file-card .thumb .glyph{font-size:34px;opacity:.5}
.file-card .body{padding:13px;display:flex;flex-direction:column;gap:5px;flex:1}
.file-card .name{font-size:11px;font-weight:600;word-break:break-word;line-height:1.5}
.file-card .meta{color:var(--muted);font-size:9px;line-height:1.7}
.file-card footer{display:flex;gap:6px;padding:0 13px 13px}
.file-card footer button{flex:1;border:0;background:var(--panel2);color:#c9adf5;border-radius:8px;padding:8px;font-size:9px}
.file-card footer button.delete{flex:0 0 auto;color:var(--red);padding:8px 11px}

/* الأجهزة */
.devices{display:grid;gap:10px}
.device-row{border:1px solid var(--line);background:var(--panel);border-radius:16px;padding:15px 17px;display:flex;align-items:center;gap:13px;flex-wrap:wrap}
.device-row .dot{width:8px;height:8px;border-radius:50%;background:#6f6875;flex:0 0 auto}
.device-row.online .dot{background:var(--green);box-shadow:0 0 9px var(--green)}
.device-row .info{flex:1;min-width:150px}
.device-row .info b{display:block;font-size:12px}
.device-row .info span{color:var(--muted);font-size:9px}
.device-row .tag{background:#31283c;color:#c9adf5;border-radius:20px;padding:3px 9px;font-size:9px}
.device-row .row-actions{display:flex;gap:6px}
.device-row .row-actions button{border:0;background:var(--panel2);color:#c9adf5;border-radius:8px;padding:8px 11px;font-size:9px}
.device-row .row-actions button.delete{color:var(--red)}

/* النوافذ المنبثقة */
.overlay{position:fixed;inset:0;background:#07050bd9;display:grid;place-items:center;padding:20px;z-index:20;overflow:auto}
.overlay-card{width:100%;max-width:400px;background:linear-gradient(145deg,#1b1623,#131018);border:1px solid var(--line);border-radius:25px;padding:26px;box-shadow:0 30px 80px #0009;text-align:center}
.overlay-card h2{margin:0 0 9px;font-size:17px}
.qr-holder{background:#fff;border-radius:17px;padding:11px;margin:15px auto;width:min(252px,100%)}
.qr-holder svg{display:block;width:100%;height:auto}
.pair-or{color:var(--muted);font-size:10px;margin:15px 0 8px}
.pair-code{direction:ltr;font-size:29px;font-weight:800;letter-spacing:6px;color:#e6d7ff;background:#0e0b12;border:1px solid var(--line);border-radius:14px;padding:13px}
.overlay-actions{display:flex;gap:8px;margin-top:18px}
.overlay-actions button{flex:1;border:1px solid var(--line);background:var(--panel);color:var(--muted);border-radius:12px;padding:12px;font-size:11px}
.overlay-actions .primary{border:0;color:#fff}
#scanVideo{width:100%;border-radius:17px;background:#000;margin:15px 0;aspect-ratio:1;object-fit:cover}

@media(max-width:720px){
  .app-view>nav{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .app-view>nav button{flex:0 0 auto;padding:9px 12px;white-space:nowrap}
  .files{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
  .file-card .thumb{height:112px}
  .code-input{font-size:22px;letter-spacing:5px}
  .pair-code{font-size:24px;letter-spacing:4px}
  .device-row .row-actions{width:100%}
  .device-row .row-actions button{flex:1}
}