/* ============================================================ NOVUS License — نظام التصميم "الخَتم البنفسجي" (Violet Seal) تحديث الهوية: قبو رقمي بنفسجي (Vault Violet) + ختم ذهبي معدني (Seal) — بدل الأحمر السابق، بلمسة أقوى وأكثر احترافية. نفس فكرة الختم السداسي والألواح المحفورة (Engraved Plates) بحواف زاوية كالمخططات الهندسية، لكن بهوية لونية جديدة كلياً. متوافق مع بقية صفحات الموقع: كل المتغيرات القديمة (--red*, --ink-950...) محفوظة كأسماء بديلة تشير تلقائياً للألوان الجديدة، حتى الصفحات الي مو موجودة عندي (مثل license.html، لوحة التحكم، الجداول) تتحدث لونياً بدون ما ينكسر شي فيها. خطوط: Cairo (عربي ولاتيني، للعرض والنص) / JetBrains Mono (المفاتيح والبيانات) وضعان: فاتح (Porcelain Vault) وداكن (Obsidian Vault) — [data-theme="dark"] على طوّره: Zorix — BTX TWEAK Team ============================================================ */ @import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;500;600;700;800;900&family=JetBrains+Mono:wght@400;500;600;700&display=swap'); :root{ /* ---------- بنفسجي القبو (Vault Violet) — اللون الأساسي الجديد ---------- */ --violet-950:#150e2a; --violet-900:#1e1442; --violet-800:#2f1c6c; --violet-700:#432a94; --violet-600:#5934c0; --violet:#6d3ff0; --violet-bright:#9575ff; --violet-soft:#efe9ff; /* ---------- أسماء قديمة (توافق خلفي مع أي صفحة بالموقع تستخدم --red*) ---------- أي مكان يستخدم var(--red) أو var(--red-bright) بياخذ تلقائياً اللون الجديد */ --red-950:var(--violet-950); --red-900:var(--violet-900); --red-800:var(--violet-800); --red-700:var(--violet-700); --red-600:var(--violet-600); --red:var(--violet); --red-bright:var(--violet-bright); --red-soft:var(--violet-soft); /* ---------- الختم الذهبي المعدني (Seal) — ثابت كما هو، لون ثانوي ---------- */ --seal-deep:#7a5a20; --seal:#a97a1f; --seal-bright:#d7a53f; --seal-shine:#f2cf7e; /* ---------- سطح فاتح (Porcelain Vault — افتراضي) ---------- */ --paper:#f8f6fc; --paper-soft:#efebf9; --paper-raised:#ffffff; --line:#e3ddf2; --line-strong:#cec2e6; --ink:#1a1530; --ink-soft:#68608a; --ink-faint:#9d94ba; --shine: rgba(255,255,255,0.75); --grain-opacity:.02; --shadow-color: 256 82% 58%; --shadow-glow: 0 1px 0 rgba(255,255,255,0.6) inset, 0 10px 30px rgba(67,42,148,0.12), 0 0 0 1px var(--line); --success:#1a8a58; --danger:#c1101f; /* ---------- أسماء قديمة إضافية (توافق خلفي مع صفحات تستخدم أسماء متغيرات سابقة) ---------- */ --ink-950: var(--paper); --ink-900: var(--paper-soft); --ink-800: var(--paper-raised); --ink-700: var(--line); --fog-400: var(--ink-soft); --fog-300: var(--ink); --gold: var(--seal); --font-display:'Cairo', sans-serif; --font-body:'Cairo', sans-serif; --font-mono:'JetBrains Mono', monospace; --radius-sm:8px; --radius-md:12px; --radius-lg:20px; } /* ---------- الوضع الداكن: القبو الأسود (Obsidian Vault) ---------- */ html[data-theme="dark"]{ --paper:#0d0b16; --paper-soft:#141024; --paper-raised:#19142b; --line:#2a2340; --line-strong:#3c3255; --ink:#f2eefb; --ink-soft:#a89fc4; --ink-faint:#69608a; --shine: rgba(255,255,255,0.06); --grain-opacity:.045; --shadow-glow: 0 1px 0 rgba(255,255,255,0.03) inset, 0 14px 40px rgba(0,0,0,0.6), 0 0 0 1px var(--line), 0 0 30px rgba(149,117,255,0.14); --violet-soft:#241c3e; --red-soft:#241c3e; } *{box-sizing:border-box;} html{scroll-behavior:smooth;} body{ margin:0; background:var(--paper); background-image: radial-gradient(ellipse 900px 520px at 10% -8%, rgba(109,63,240,0.10), transparent 60%), radial-gradient(ellipse 700px 460px at 108% 4%, rgba(169,122,31,0.10), transparent 55%), radial-gradient(ellipse 640px 420px at 50% 104%, rgba(109,63,240,0.05), transparent 60%); background-attachment:fixed; color:var(--ink); font-family:var(--font-body); line-height:1.65; min-height:100vh; position:relative; overflow-x:hidden; transition:background-color .25s ease, color .25s ease; } /* حبيبات دقيقة فوق كل شيء — تعطي إحساس "المعدن المصقول" بدل الاستواء الرقمي */ body::after{ content:''; position:fixed; inset:0; z-index:2; pointer-events:none; opacity:var(--grain-opacity); mix-blend-mode:overlay; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); } @keyframes btx-pulse-glow{0%,100%{opacity:.55;}50%{opacity:1;}} @keyframes btx-float{0%,100%{transform:translateY(0);}50%{transform:translateY(-8px);}} @keyframes btx-shine{0%{background-position:-220% 0;}100%{background-position:220% 0;}} @keyframes btx-fade-up{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:translateY(0);}} @keyframes btx-stripe{0%{background-position:0 0;}100%{background-position:28px 0;}} a{color:inherit;text-decoration:none;} ul{list-style:none;margin:0;padding:0;} button{font-family:inherit;cursor:pointer;} input,select,textarea{font-family:inherit;} ::selection{background:rgba(109,63,240,0.25); color:var(--ink);} ::-webkit-scrollbar{width:10px;height:10px;} ::-webkit-scrollbar-track{background:var(--paper-soft);} ::-webkit-scrollbar-thumb{background:var(--line-strong);border-radius:10px;} ::-webkit-scrollbar-thumb:hover{background:var(--red);} a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{ outline:2px solid var(--red); outline-offset:2px; } @media (prefers-reduced-motion: reduce){ *{animation-duration:.001ms !important;transition-duration:.001ms !important;} } .container{max-width:1200px;margin:0 auto;padding:0 24px;} h1,h2,h3,h4{ font-family:var(--font-display); font-weight:700; letter-spacing:-0.01em; margin:0 0 12px; color:var(--ink); } .mono{font-family:var(--font-mono);} .text-muted{color:var(--ink-soft);} .text-red{color:var(--red);} .text-gold{color:var(--seal-bright);} /* ============ شريط التنقل ============ */ .navbar{ position:sticky; top:0; z-index:100; display:flex; align-items:center; justify-content:space-between; padding:12px 24px; background:color-mix(in srgb, var(--paper) 84%, transparent); backdrop-filter:blur(14px); border-bottom:1px solid var(--line); position:relative; } .navbar::after{ content:'';position:absolute;left:0;right:0;bottom:-1px;height:1px; background:linear-gradient(90deg, transparent, var(--red-bright) 45%, var(--seal-bright) 55%, transparent); opacity:.55; } .navbar .brand{display:flex;align-items:center;gap:10px;font-family:var(--font-display);font-weight:800;font-size:18px;color:var(--ink);} .navbar .brand img{height:34px;width:auto;display:block;border-radius:8px;} .navbar .brand .mark{ width:34px;height:34px; clip-path:polygon(50% 0%, 95% 25%, 95% 75%, 50% 100%, 5% 75%, 5% 25%); background:linear-gradient(150deg, var(--red-bright), var(--red) 55%, var(--red-900)); display:flex;align-items:center;justify-content:center; color:#fff;font-weight:800;font-size:12px;flex-shrink:0; box-shadow:0 0 0 1px rgba(255,255,255,0.15) inset, 0 4px 12px rgba(109,63,240,0.4); } .navbar .nav-links{display:flex;align-items:center;gap:26px;} .navbar .nav-links a{font-size:14px;color:var(--ink-soft);transition:color .15s;position:relative;} .navbar .nav-links a:hover{color:var(--red);} .navbar .nav-actions{display:flex;gap:10px;align-items:center;} .icon-toggle{ width:38px;height:38px;border-radius:50%; display:flex;align-items:center;justify-content:center; background:var(--paper-soft); border:1px solid var(--line); font-size:15px; color:var(--ink); transition:transform .15s, border-color .15s, background .15s; } .icon-toggle:hover{border-color:var(--red-bright); transform:translateY(-1px) rotate(-6deg);} .lang-toggle{font-family:var(--font-mono); font-weight:700; font-size:12px; width:auto; padding:0 12px;} /* ============ الأزرار ============ */ .btn{ display:inline-flex;align-items:center;justify-content:center;gap:8px; padding:12px 24px;border-radius:var(--radius-sm); font-size:14px;font-weight:700;border:1px solid transparent; transition:transform .12s ease, filter .12s ease, background .15s, box-shadow .2s; white-space:nowrap; } .btn:active{transform:scale(0.97);} .btn-primary{ background:linear-gradient(135deg, var(--red-bright), var(--red) 55%, var(--red-700)); color:#fff; position:relative; overflow:hidden; box-shadow:0 10px 26px rgba(109,63,240,0.35), 0 1px 0 rgba(255,255,255,0.35) inset, 0 0 0 1px rgba(255,255,255,0.08) inset; } .btn-primary::after{ content:'';position:absolute;inset:0; background:linear-gradient(120deg, transparent 40%, rgba(255,255,255,0.65) 50%, transparent 60%); background-size:250% 100%; animation:btx-shine 3.2s ease-in-out infinite; } .btn-primary:hover{filter:brightness(1.08); box-shadow:0 14px 34px rgba(109,63,240,0.5), 0 1px 0 rgba(255,255,255,0.4) inset;} .btn-secondary{background:var(--paper-raised); border-color:var(--line-strong); color:var(--ink);} .btn-secondary:hover{background:var(--paper-soft); border-color:var(--red);} .btn-ghost{background:transparent;color:var(--ink-soft);} .btn-ghost:hover{color:var(--red);} .btn-danger{background:rgba(193,16,31,0.10);color:var(--danger);border-color:rgba(193,16,31,0.32);} .btn-danger:hover{background:rgba(193,16,31,0.18);} .btn-block{width:100%;} .btn-sm{padding:8px 14px;font-size:13px;} /* ============ البطاقات — ألواح محفورة (Engraved Plates) ============ */ .card{ background:var(--paper-raised); border:1px solid var(--line); border-radius:var(--radius-lg); padding:24px; position:relative; overflow:hidden; box-shadow:var(--shadow-glow); transition:border-color .25s ease, box-shadow .25s ease, transform .25s ease; } .card::before{ content:''; position:absolute; inset:0 0 auto 0; height:60%; background:linear-gradient(180deg, var(--shine), transparent); opacity:.5; pointer-events:none; } /* علامات زاوية كالمخططات الهندسية — إشارة إلى أن كل ملف هو "بنية" تُفحص بدقة */ .card::after{ content:''; position:absolute; top:10px; left:10px; width:14px; height:14px; border-top:1.5px solid var(--line-strong); border-left:1.5px solid var(--line-strong); opacity:.7; pointer-events:none; transition:border-color .25s ease; } .card:hover{border-color:var(--red-bright); transform:translateY(-2px);} .card:hover::after{border-color:var(--seal-bright);} .card-flat{ background:var(--paper-raised); border:1px solid var(--line); border-radius:var(--radius-md); padding:18px; box-shadow:0 1px 0 rgba(255,255,255,0.5) inset; } /* ============ الحقول ============ */ .field{margin-bottom:18px;} .field label{display:block;font-size:13px;color:var(--ink-soft);margin-bottom:6px;font-weight:600;} .field input,.field select,.field textarea, input.input,select.input,textarea.input{ width:100%;padding:12px 14px;background:var(--paper); border:1px solid var(--line-strong);border-radius:var(--radius-sm); color:var(--ink);font-size:14px;transition:border-color .15s, box-shadow .15s; } .field input:focus,.field select:focus,.field textarea:focus, input.input:focus,select.input:focus,textarea.input:focus{border-color:var(--red);outline:none;box-shadow:0 0 0 3px rgba(109,63,240,0.14);} .field .hint{font-size:12px;color:var(--ink-faint);margin-top:6px;} .field .error-msg{font-size:12px;color:var(--danger);margin-top:6px;} /* ============ الشارات ============ */ .badge{display:inline-flex;align-items:center;gap:6px;padding:4px 11px;border-radius:100px;font-size:12px;font-weight:700;} .badge-success{background:rgba(26,138,88,0.13);color:var(--success);} .badge-danger{background:rgba(193,16,31,0.13);color:var(--danger);} .badge-gold{background:rgba(169,122,31,0.14);color:var(--seal-bright);} .badge-muted{background:var(--paper-soft);color:var(--ink-soft); border:1px solid var(--line);} .badge-active{background:rgba(26,138,88,0.13);color:var(--success);} .badge-revoked{background:rgba(193,16,31,0.13);color:var(--danger);} .badge-pending{background:rgba(169,122,31,0.14);color:var(--seal-bright);} /* ============ التنبيهات ============ */ .alert{padding:13px 16px;border-radius:var(--radius-sm);font-size:14px;margin-bottom:16px;border:1px solid transparent;} .alert-error{background:rgba(193,16,31,0.08);border-color:rgba(193,16,31,0.28);color:var(--danger);} .alert-success{background:rgba(26,138,88,0.08);border-color:rgba(26,138,88,0.28);color:var(--success);} /* ============ الفوتر ============ */ .footer{border-top:1px solid var(--line);padding:40px 24px;margin-top:80px;color:var(--ink-soft);font-size:13px;} /* ============ تخطيط لوحة التحكم ============ */ .dash-layout{display:grid;grid-template-columns:240px 1fr;min-height:calc(100vh - 65px);} .dash-sidebar{border-left:1px solid var(--line);padding:24px 14px;background:var(--paper-soft);} [dir="ltr"] .dash-sidebar{border-left:none; border-right:1px solid var(--line);} .dash-sidebar .side-link{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:var(--radius-sm);color:var(--ink-soft);font-size:14px;margin-bottom:4px;transition:background .15s,color .15s;} .dash-sidebar .side-link:hover{background:var(--paper-raised);color:var(--ink);} .dash-sidebar .side-link.active{background:var(--red-soft);color:var(--red);font-weight:700; box-shadow:inset 3px 0 0 var(--red);} [dir="ltr"] .dash-sidebar .side-link.active{box-shadow:inset -3px 0 0 var(--red);} .dash-content{padding:32px;} .stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:28px;} .stat-card .stat-label{font-size:13px;color:var(--ink-soft);margin-bottom:8px;} .stat-card .stat-value{font-family:var(--font-mono);font-size:30px;font-weight:800;color:var(--red);} table{width:100%;border-collapse:collapse;font-size:14px;} table th{text-align:right;padding:10px 12px;color:var(--ink-soft);font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.03em;border-bottom:1px solid var(--line);} [dir="ltr"] table th{text-align:left;} table td{padding:12px;border-bottom:1px solid var(--line);} table tr:hover td{background:var(--paper-soft);} /* ============ منطقة رفع الملفات ============ */ .dropzone{ border:2px dashed var(--line-strong);border-radius:var(--radius-lg);padding:48px 24px; text-align:center;transition:border-color .2s,background .2s;cursor:pointer;position:relative; } .dropzone::before,.dropzone::after{ content:'';position:absolute;width:16px;height:16px;opacity:.5; border-color:var(--line-strong); transition:border-color .2s, opacity .2s; } .dropzone::before{top:10px;left:10px;border-top:2px solid;border-left:2px solid;} .dropzone::after{bottom:10px;right:10px;border-bottom:2px solid;border-right:2px solid;} .dropzone.dragover{border-color:var(--red);background:var(--red-soft);} .dropzone.dragover::before,.dropzone.dragover::after{border-color:var(--red);opacity:1;} .progress-bar{height:6px;background:var(--paper-soft);border-radius:100px;overflow:hidden;margin-top:10px; border:1px solid var(--line);} .progress-bar .fill{ height:100%;width:0%;transition:width .2s ease; background:repeating-linear-gradient(45deg, var(--red-bright), var(--red-bright) 8px, var(--red) 8px, var(--red) 16px); background-size:28px 100%; animation:btx-stripe 1s linear infinite; } /* ============ Utility ============ */ .flex{display:flex;} .flex-between{display:flex;align-items:center;justify-content:space-between;} .flex-center{display:flex;align-items:center;justify-content:center;} .gap-8{gap:8px;} .gap-12{gap:12px;} .gap-16{gap:16px;} .mt-8{margin-top:8px;} .mt-16{margin-top:16px;} .mt-24{margin-top:24px;} .mt-32{margin-top:32px;} .mb-8{margin-bottom:8px;} .mb-16{margin-bottom:16px;} .mb-24{margin-bottom:24px;} .hidden{display:none !important;} .w-full{width:100%;} /* ============ ختم الترخيص المعدني (يُستخدم في license.html) ============ */ .license-key-box{ position:relative; background: linear-gradient(180deg, rgba(255,255,255,0.05), transparent 40%), var(--paper-soft); border:1px solid var(--seal) !important; box-shadow:0 0 0 1px rgba(169,122,31,0.15), 0 8px 24px rgba(169,122,31,0.18) inset, 0 0 24px rgba(169,122,31,0.12); color:var(--seal-bright) !important; } .license-key-box::before{ content:'✦ SEALED ✦'; display:block; font-size:9px; letter-spacing:.25em; font-family:var(--font-mono); color:var(--seal); opacity:.65; margin-bottom:6px; } /* ============ شارة الخطوة (badge السداسي في license.html) ============ */ .step-badge{ clip-path:polygon(50% 0%, 95% 25%, 95% 75%, 50% 100%, 5% 75%, 5% 25%); border-radius:0 !important; } .step-badge.done{background:linear-gradient(150deg, var(--seal-shine), var(--seal)) !important; color:#1a1204 !important;} .step-badge.active{background:linear-gradient(150deg, var(--red-bright), var(--red)) !important; color:#fff !important;} @media (max-width:860px){ .dash-layout{grid-template-columns:1fr;} .dash-sidebar{display:flex;overflow-x:auto;border-left:none;border-right:none;border-bottom:1px solid var(--line);} .navbar .nav-links{display:none;} } /* ============================================================ إضافات نظام الرخص (Novus) — بنفس لغة التصميم أعلاه ============================================================ */ /* خلفية اختيارية: أي وقت تحط صورة اسمها Person.png داخل website/public/assets/ بتظهر تلقائياً هنا بدون أي تعديل ثاني بالكود */ body::before{ content:''; position:fixed; inset:0; pointer-events:none; background-image:url('/assets/Person.png'); background-size:cover; background-position:center; opacity:.16; } .copy-btn{ border:1px solid var(--line-strong); background:var(--paper-raised); color:var(--ink-soft); border-radius:8px; width:30px; height:30px; display:inline-flex; align-items:center; justify-content:center; cursor:pointer; transition:all .15s ease; font-size:13px; flex-shrink:0; } .copy-btn svg{width:15px;height:15px;} .copy-btn:hover{ color:var(--red); border-color:var(--red); } .copy-btn.copied{ color:var(--success); border-color:var(--success); } .field-row{ display:flex; align-items:center; justify-content:space-between; padding:10px 0; border-bottom:1px dashed var(--line); gap:10px; } .field-row:last-of-type{ border-bottom:none; } .field-row .label{ color:var(--ink-soft); font-size:12.5px; white-space:nowrap; } .field-row .value-row{ display:flex; align-items:center; gap:8px; min-width:0; } .field-row .value{ font-size:13.5px; overflow:hidden; text-overflow:ellipsis; } .gate-wrap{ min-height:100vh; display:flex; align-items:center; justify-content:center; padding:24px; } .gate-card{ max-width:420px; width:100%; text-align:center; } .access-card{ position:relative; } .access-card .id-row{ display:flex; justify-content:space-between; color:var(--ink-faint); font-size:10.5px; letter-spacing:1px; margin-bottom:14px; font-family:var(--font-mono); } .access-card .chip{ width:36px; height:26px; border-radius:6px; margin:0 auto 16px; background:linear-gradient(135deg,var(--seal-shine),var(--seal)); } .who-row{ display:flex; align-items:center; gap:12px; } .who-row img{ width:38px; height:38px; border-radius:50%; border:2px solid var(--line-strong); } .file-row{ display:flex; align-items:center; justify-content:space-between; gap:12px; } .file-row .info{ display:flex; align-items:center; gap:12px; min-width:0; } .file-row .fname{ font-size:13.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .file-row .fscript{ color:var(--ink-soft); font-size:11.5px; } .empty-state{ text-align:center; padding:44px 20px; color:var(--ink-soft); font-size:13.5px; } /* ============================================================ قائمة السكربتات — تصميم مضغوط بخط مستقيم، كل سكربت وجنبه أدواته (تحديث لوحة العميل — يستبدل قسم "تحديث الايبي" الكبير القديم) ============================================================ */ .scripts-list{ display:flex; flex-direction:column; gap:12px; } .script-row{ position:relative; background:var(--paper-raised); border:1px solid var(--line); border-radius:var(--radius-md); box-shadow:var(--shadow-glow); overflow:hidden; transition:border-color .2s ease, box-shadow .2s ease; } .script-row::after{ content:''; position:absolute; top:9px; left:9px; width:10px; height:10px; border-top:1.5px solid var(--line-strong); border-left:1.5px solid var(--line-strong); opacity:.6; pointer-events:none; } .script-row:hover{ border-color:var(--line-strong); } .script-row__main{ display:flex; align-items:center; justify-content:space-between; gap:16px; padding:16px 18px; } .script-row__info{ display:flex; align-items:flex-start; gap:12px; min-width:0; } .status-hex{ flex-shrink:0; width:11px; height:11px; margin-top:6px; clip-path:polygon(50% 0%, 95% 25%, 95% 75%, 50% 100%, 5% 75%, 5% 25%); background:var(--ink-faint); transition:background .2s ease; } .status-hex.is-active{ background:var(--success); box-shadow:0 0 0 3px rgba(26,138,88,0.16); } .status-hex.is-revoked{ background:var(--danger); box-shadow:0 0 0 3px rgba(193,16,31,0.14); } .script-row__text{ min-width:0; } .script-row__title-line{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; } .script-row__name{ font-weight:700; font-size:15.5px; color:var(--ink); } .script-row__meta{ margin-top:5px; font-size:12.5px; color:var(--ink-soft); display:flex; align-items:center; gap:8px; flex-wrap:wrap; } .script-row__meta .stopped{ color:var(--danger); font-weight:600; } .script-row__actions{ display:flex; align-items:center; gap:8px; flex-shrink:0; } .icon-btn{ width:36px; height:36px; border-radius:10px; padding:0; display:inline-flex; align-items:center; justify-content:center; background:var(--paper-soft); border:1px solid var(--line); color:var(--ink-soft); flex-shrink:0; transition:color .15s, border-color .15s, background .15s, transform .12s; } .icon-btn svg{ width:17px; height:17px; display:block; } .icon-btn:hover{ color:var(--red); border-color:var(--red); transform:translateY(-1px); } .icon-btn:active{ transform:scale(0.94); } .icon-btn.is-active{ background:var(--red); border-color:var(--red); color:#fff; } .icon-btn.is-disabled,.icon-btn:disabled{ opacity:.35; pointer-events:none; } a.icon-btn{ text-decoration:none; } /* اللوحة المنسدلة (تغيير الايبي / عرض الرخصة) — تفتح تحت الصف مباشرة */ .script-row__panel{ display:grid; grid-template-rows:0fr; transition:grid-template-rows .25s ease; border-top:1px solid transparent; } .script-row__panel.is-open{ grid-template-rows:1fr; border-top-color:var(--line); } .script-row__panel-inner{ overflow:hidden; min-height:0; } .script-row__panel-content{ padding:16px 18px; background:var(--paper-soft); } .script-row__panel-label{ display:block; font-size:12.5px; color:var(--ink-soft); margin-bottom:8px; font-weight:600; } .panel-ip .ip-form{ display:flex; gap:8px; } .panel-ip .msg-slot:empty{ margin:0; } .panel-license .key-display{ display:flex; align-items:center; justify-content:space-between; gap:10px; border:1px solid var(--seal); border-radius:var(--radius-sm); background:var(--paper-raised); padding:10px 14px; margin-bottom:10px; } .panel-license .key-display .key-text{ color:var(--seal-bright); font-size:13.5px; letter-spacing:.05em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .panel-license .reveal-toggle{ background:none; border:none; padding:2px 0; color:var(--red); font-size:12.5px; font-weight:700; font-family:inherit; } .panel-license .reveal-toggle:hover{ text-decoration:underline; } .empty-state{ text-align:center; padding:44px 20px; color:var(--ink-soft); font-size:13.5px; } @media (max-width:600px){ .script-row__main{ flex-direction:column; align-items:stretch; gap:14px; } .script-row__actions{ justify-content:flex-start; } }