:root { color-scheme: dark; --ink:#edf4ff; --muted:#a9b8d1; --line:#2a3858; --page:#0a1124; --panel:#111d38; --panel-2:#152442; --teal:#38d5c5; --teal-ink:#042522; --amber:#f9c96b; --danger:#ff9292; }
* { box-sizing:border-box; }
body { margin:0; min-width:320px; font:16px/1.5 Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color:var(--ink); background:radial-gradient(circle at 20% -10%, #1a3865 0, transparent 30rem), var(--page); }
a { color:inherit; }
.shell { width:min(1160px, calc(100% - 2rem)); margin:auto; }
.topbar { display:flex; align-items:center; justify-content:space-between; gap:1rem; min-height:76px; border-bottom:1px solid var(--line); }
.brand { display:flex; align-items:center; gap:.75rem; font-weight:780; letter-spacing:-.02em; text-decoration:none; }
.mark { display:grid; place-items:center; width:34px; height:34px; border-radius:10px; color:#06201e; background:var(--teal); font-size:18px; }
.topbar nav { display:flex; gap:1rem; color:var(--muted); font-size:.94rem; }
.topbar nav a { text-decoration:none; }
.eyebrow { color:var(--teal); font-size:.78rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.intro { display:flex; justify-content:space-between; gap:2rem; align-items:end; padding:3.3rem 0 1.6rem; }
h1 { max-width:720px; margin:.35rem 0 0; font-size:clamp(2.15rem, 5vw, 4.5rem); line-height:1.02; letter-spacing:-.065em; }
.intro p { max-width:430px; margin:0; color:var(--muted); }
.pill { white-space:nowrap; display:inline-flex; align-items:center; gap:.42rem; padding:.45rem .72rem; border:1px solid #3a507a; border-radius:999px; color:#cbd8f1; font-size:.84rem; }
.dot { width:.52rem; height:.52rem; border-radius:50%; background:var(--amber); }
.planner { display:grid; grid-template-columns:1fr .82fr; gap:1.2rem; padding:1.5rem 0 4.5rem; }
.card { border:1px solid var(--line); border-radius:18px; background:linear-gradient(145deg, rgba(22,38,71,.94), rgba(13,24,48,.96)); box-shadow:0 24px 50px rgba(0,0,0,.16); }
.composer { padding:1.45rem; }
.section-title { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:1.1rem; }
h2 { margin:0; font-size:1.1rem; letter-spacing:-.02em; }
label { display:block; margin:1.1rem 0 .42rem; color:#cfdbef; font-size:.9rem; font-weight:700; }
.upload { display:grid; place-items:center; min-height:170px; padding:1rem; border:1px dashed #49628d; border-radius:13px; background:#0d1932; text-align:center; cursor:pointer; }
.upload input { position:absolute; width:1px; height:1px; opacity:0; }
.upload strong { display:block; margin-bottom:.2rem; }
.upload span { color:var(--muted); font-size:.9rem; }
.file-info { min-height:1.35rem; margin:.55rem 0 0; color:var(--muted); font-size:.86rem; }
textarea, input[type=text] { width:100%; border:1px solid #3c5076; border-radius:10px; padding:.8rem .85rem; color:var(--ink); background:#09142a; font:inherit; resize:vertical; }
textarea:focus, input:focus { outline:2px solid var(--teal); outline-offset:2px; }
.field-meta { display:flex; justify-content:space-between; gap:1rem; margin-top:.38rem; color:var(--muted); font-size:.78rem; }
.hashtags { display:flex; flex-wrap:wrap; gap:.45rem; min-height:2.5rem; padding:.5rem 0; }
.tag { padding:.3rem .55rem; border-radius:999px; background:#20345e; color:#d7e7ff; font-size:.82rem; }
.row { display:flex; gap:.8rem; margin-top:1.2rem; }
button { border:0; border-radius:10px; padding:.78rem 1rem; background:var(--teal); color:var(--teal-ink); font:700 .94rem/1.1 inherit; cursor:pointer; }
button.secondary { border:1px solid #516990; background:transparent; color:#dce8ff; }
button:focus-visible, a:focus-visible { outline:2px solid var(--teal); outline-offset:3px; }
.side { display:grid; gap:1.2rem; align-content:start; }
.side .card { padding:1.35rem; }
.checklist { display:grid; gap:.8rem; margin:1rem 0 0; padding:0; list-style:none; }
.checklist li { display:flex; gap:.65rem; align-items:flex-start; color:var(--muted); font-size:.9rem; }
.check { display:grid; place-items:center; flex:0 0 1.23rem; width:1.23rem; height:1.23rem; margin-top:.1rem; border:1px solid #49628d; border-radius:50%; color:var(--teal); font-size:.8rem; }
.check.ok { border-color:var(--teal); background:#123d40; }
.notice { border-left:3px solid var(--amber); padding:.1rem 0 .1rem .85rem; color:#d5dff2; font-size:.9rem; }
.notice small { display:block; margin-top:.25rem; color:var(--muted); }
.legal { width:min(800px, calc(100% - 2rem)); margin:0 auto; padding:3.5rem 0 5rem; }
.legal h1 { font-size:clamp(2.1rem, 5vw, 3.5rem); }
.legal h2 { margin:2rem 0 .5rem; font-size:1.2rem; }
.legal p, .legal li { color:#c4d0e5; }
.legal li { margin:.4rem 0; }
.legal .updated { color:var(--muted); }
footer { border-top:1px solid var(--line); padding:1.4rem 0 2rem; color:var(--muted); font-size:.85rem; }
footer .shell { display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; }
@media (max-width:780px) { .topbar { min-height:64px; } .topbar nav { gap:.7rem; font-size:.82rem; } .intro { display:block; padding-top:2.2rem; } .intro p { margin-top:1.1rem; } .planner { grid-template-columns:1fr; } .row { flex-direction:column; } button { width:100%; } }
.settings-grid { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-top:.45rem; }
select { width:100%; min-height:48px; border:1px solid #3c5076; border-radius:10px; padding:.65rem .8rem; color:var(--ink); background:#09142a; font:inherit; }
select:disabled { opacity:.7; }
.switch-list, .disclosure-list { display:grid; gap:.6rem; }
.switch-row, .approval-row { display:flex; align-items:flex-start; gap:.65rem; margin:.35rem 0; color:#d4def0; font-size:.9rem; font-weight:500; }
.switch-row input, .approval-row input { flex:0 0 auto; width:1.1rem; height:1.1rem; margin:.12rem 0 0; accent-color:var(--teal); }
.disclosure-list { margin-top:1.1rem; padding:.75rem .85rem; border:1px solid var(--line); border-radius:12px; background:rgba(8,17,36,.55); }
.approval-row { margin-top:1rem; padding:.85rem; border:1px solid #516990; border-radius:12px; background:#101d38; font-weight:700; }
.button-link { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:.7rem .9rem; border-radius:10px; background:var(--teal); color:var(--teal-ink); font-weight:750; text-decoration:none; }
.button-link.disabled { opacity:.55; cursor:default; }
.muted { color:var(--muted); font-size:.92rem; }
.message { min-height:1.5rem; margin-top:.8rem; color:#c6d5ef; font-size:.91rem; }
.message.error { color:var(--danger); }
.message.success { color:#74e5d5; }
.message a { margin-left:.4rem; }
.progress-wrap { display:grid; gap:.35rem; color:var(--muted); font-size:.83rem; }
progress { width:100%; height:.7rem; accent-color:var(--teal); }
.recent-list { display:grid; gap:.65rem; margin:1rem 0 0; padding:0; list-style:none; }
.recent-list li { display:flex; justify-content:space-between; gap:1rem; padding:.65rem 0; border-top:1px solid var(--line); font-size:.87rem; }
.recent-list li strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:600; }
.recent-list li span { color:var(--muted); text-transform:capitalize; }
video { display:block; width:100%; max-height:400px; margin-top:.9rem; border-radius:12px; background:#000; }
@media (max-width:780px) { .settings-grid { grid-template-columns:1fr; gap:.1rem; } }