:root { --bg:#0B0914; --card:#151226; --line:#262140; --violet:#8B5CF6; --fuchsia:#D946EF; --muted:#A1A1AA; }
html, body { background: var(--bg); color: #fff; font-family: 'Montserrat', system-ui, sans-serif; -webkit-tap-highlight-color: transparent; }
body { min-height: 100vh; }
.grad { background-image: linear-gradient(135deg, var(--violet), var(--fuchsia)); }
.grad-text { background-image: linear-gradient(135deg, #A78BFA, var(--fuchsia)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.card { background: var(--card); border: 1px solid var(--line); border-radius: 1.25rem; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:.5rem; font-weight:700; border-radius:.9rem; padding:.75rem 1.25rem; transition: transform .15s, opacity .15s, box-shadow .2s; cursor:pointer; }
.btn:active { transform: scale(.97); }
.btn:disabled { opacity:.5; cursor:not-allowed; }
.btn-primary { background-image: linear-gradient(135deg, var(--violet), var(--fuchsia)); color:#fff; box-shadow: 0 10px 30px -10px rgba(217,70,239,.6); }
.btn-primary:hover { box-shadow: 0 14px 36px -8px rgba(217,70,239,.8); }
.btn-ghost { background: rgba(255,255,255,.05); border:1px solid var(--line); color:#fff; }
.btn-ghost:hover { background: rgba(255,255,255,.1); }
.btn-danger { background: rgba(239,68,68,.15); color:#fca5a5; border:1px solid rgba(239,68,68,.35); }
.input, select.input, textarea.input { width:100%; background:#0F0C1C; border:1px solid var(--line); border-radius:.8rem; padding:.7rem .9rem; color:#fff; outline:none; transition:border-color .15s, box-shadow .15s; }
.input:focus { border-color: var(--violet); box-shadow: 0 0 0 3px rgba(139,92,246,.25); }
.label { display:block; font-size:.75rem; font-weight:600; color: var(--muted); margin-bottom:.35rem; text-transform: uppercase; letter-spacing:.04em; }
.muted { color: var(--muted); }
.chip { display:inline-flex; align-items:center; gap:.3rem; font-size:.7rem; font-weight:700; padding:.25rem .6rem; border-radius:999px; }
.prose-dark { color:#E4E4E7; line-height:1.75; }
.prose-dark h1,.prose-dark h2,.prose-dark h3 { color:#fff; font-weight:800; margin:1.4em 0 .5em; }
.prose-dark h2 { font-size:1.35rem; } .prose-dark h3 { font-size:1.1rem; }
.prose-dark p { margin:.7em 0; } .prose-dark ul { list-style:disc; padding-left:1.4em; } .prose-dark ol { list-style:decimal; padding-left:1.4em; }
.prose-dark a { color:#C4B5FD; text-decoration:underline; }
.fade-in { animation: fadeIn .35s ease both; }
@keyframes fadeIn { from { opacity:0; transform: translateY(8px); } to { opacity:1; transform:none; } }
.glow { position:absolute; border-radius:999px; filter: blur(90px); opacity:.35; pointer-events:none; }
.modal-bg { position:fixed; inset:0; background: rgba(5,3,12,.75); backdrop-filter: blur(6px); z-index:60; display:flex; align-items:flex-end; justify-content:center; }
@media (min-width:640px){ .modal-bg { align-items:center; } }
.modal { width:100%; max-width:36rem; max-height:92vh; overflow:auto; animation: up .25s ease both; border-radius:1.5rem 1.5rem 0 0; }
@media (min-width:640px){ .modal { border-radius:1.5rem; } }
@keyframes up { from { transform: translateY(30px); opacity:0 } to { transform:none; opacity:1 } }
.toast { position:fixed; left:50%; bottom:6rem; transform:translateX(-50%); z-index:80; padding:.8rem 1.2rem; border-radius:1rem; font-weight:600; box-shadow:0 10px 40px rgba(0,0,0,.5); animation: up .25s ease both; max-width: calc(100vw - 32px); }
.safe-bottom { padding-bottom: env(safe-area-inset-bottom); }
.tbl { width:100%; border-collapse:collapse; font-size:.875rem; }
.tbl th { text-align:left; color:var(--muted); font-weight:600; font-size:.7rem; text-transform:uppercase; letter-spacing:.05em; padding:.7rem .8rem; border-bottom:1px solid var(--line); white-space:nowrap; }
.tbl td { padding:.7rem .8rem; border-bottom:1px solid rgba(38,33,64,.6); vertical-align:middle; }
.tbl tr:hover td { background: rgba(255,255,255,.02); }
.switch { position:relative; width:46px; height:26px; border-radius:999px; background:#2a2540; transition: background .2s; flex-shrink:0; cursor:pointer; border:none; }
.switch::after { content:''; position:absolute; top:3px; left:3px; width:20px; height:20px; border-radius:999px; background:#fff; transition: transform .2s; }
.switch.on { background: linear-gradient(135deg, #22c55e, #16a34a); }
.switch.on::after { transform: translateX(20px); }
.wysiwyg { min-height: 220px; outline:none; }
.wysiwyg:focus { border-color: var(--violet); }
::-webkit-scrollbar { width:8px; height:8px; } ::-webkit-scrollbar-thumb { background:#2a2540; border-radius:8px; }
[data-link] { cursor:pointer; }
#loader { position:fixed; top:0; left:0; height:3px; z-index:90; background: linear-gradient(90deg, var(--violet), var(--fuchsia)); transition: width .3s; width:0; }