/* Shared visual system, matching the compact visitor page. */
:root { --bg:#0d0f12; --surface:#13161b; --surface-2:#191d24; --surface-3:#222730; --border:#2a2e36; --border-soft:#252a32; --text-muted:#aab1bc; --text-faint:#969fac; }
body { background:var(--bg); }
.bg-gradient { background:var(--bg); }
.bg-gradient::before, .bg-gradient::after { display:none; }
.card, .card:hover, .stat-card, .stat-card:hover, .result-box, .auth-card { background:var(--surface); border-color:var(--border); border-radius:16px; box-shadow:none; backdrop-filter:none; transform:none; }
.stat-card::after, .preset-panel::after { display:none; }
.card { padding:26px; }
.brand { font-size:16px; gap:8px; }
.brand .logo-dot { width:30px; height:30px; }
.navbar { min-height:76px; padding-block:14px; }
.nav-links { gap:14px; }
.nav-links a { font-size:13px; }
.nav-pill { border-radius:9px; background:transparent; padding:9px 12px; }
.language-switcher { padding:0; gap:2px; border:0; background:none; box-shadow:none; }
.language-switcher > span { display:none; }
.language-switcher a { min-width:38px; height:36px; border-radius:8px; font-size:11px; font-family:var(--font-display); }
.language-switcher a[aria-current='true'] { background:#24272e; color:#fff; box-shadow:none; }
.section-kicker { color:var(--text-muted); font-family:var(--font-display); font-size:11px; letter-spacing:.04em; }
.btn:not(.btn-unlock) { border-radius:9px; min-height:42px; font-size:13px; font-weight:600; box-shadow:none; }
.btn-primary::after { display:none; }
.btn-primary:hover { transform:none; box-shadow:none; filter:brightness(1.08); }
.btn-secondary:hover { border-color:#626c7a; }
.btn-sm { padding:8px 12px; }
.btn-lg { min-height:48px !important; }
.form-control { min-height:46px; border-radius:9px; padding:10px 12px; font-size:16px; }
.form-control:focus { border-color:var(--signal); background:var(--surface-2); box-shadow:0 0 0 2px rgba(var(--signal-rgb),.1); }
.form-control::placeholder { color:#818b99; }
.form-label { font-size:13px; margin-bottom:7px; }
.form-hint, .form-section-title p { font-size:13px; line-height:1.6; }
.form-section-title { gap:10px; margin-bottom:18px; }
.form-section-title > span { width:26px; height:26px; border:0; background:#242932; color:var(--text-muted); border-radius:7px; box-shadow:none; }
.form-section-title h3 { font-size:16px; }
.form-group { margin-bottom:18px; }
.form-section { padding-top:24px; margin-top:24px; }
.color-control { min-height:46px; height:auto; border-radius:9px; }
.color-control:focus-within { box-shadow:0 0 0 2px rgba(var(--signal-rgb),.1); }
.step-item, .step-item:focus-within { background:#171b21; border-radius:12px; box-shadow:none; }
.step-num { color:var(--text-muted); background:none; }
.step-fields { gap:9px; }
.compact-field { font-size:12px; border-radius:8px; background:transparent; }
.countdown-setting, .toggle-row { padding:14px 0; border:0; background:none; border-radius:0; }
.number-suffix { border-radius:8px; }
.preset-panel { margin:0; padding:16px; border-color:var(--border); border-radius:10px; background:var(--surface-2); box-shadow:none; }
.preset-panel-heading { gap:0; }
.preset-panel-icon, .preset-panel .section-kicker { display:none; }
.preset-panel-heading h3 { font-size:15px; }
.preset-panel-heading > div > p:last-child, .preset-feedback { font-size:12px; }
.preset-feedback.is-success { color:#c8d9ce; }
.alert { border-radius:9px; font-size:13px; }
.alert-success { border-color:#364c41; color:#c8d9ce; background:#1b2821; }
.result-box { padding:24px; }
.state-icon { border-color:var(--border); background:none; box-shadow:none; }
.link-display { border-radius:9px; }
.link-display input { font:inherit; font-size:14px; }
.badge { padding:4px 8px; border-radius:6px; font-size:11px; font-weight:600; }
.badge-active { color:#c8d9ce; background:#203128; }
.badge-inactive { color:#adb6c3; background:#282e37; }
.site-footer { font-size:11px; }

/* Creator: concise sections and a quieter live preview. */
.dee-home .navbar { padding-block:14px; }
.dee-heading { margin:18px 0 26px; }
.dee-heading .eyebrow { display:inline-block; border:0; background:none; padding:0; box-shadow:none; font:500 12px var(--font-display); text-transform:none; letter-spacing:0; color:var(--text-muted); margin-bottom:12px; }
.dee-heading .eyebrow-dot { display:none; }
.dee-heading h1 { font-size:clamp(26px,3vw,34px); line-height:1.25; margin-bottom:12px; }
.dee-heading p { font-size:14px; }
.dee-editor { padding:24px; }
.dee-workspace { gap:26px; }
.dee-action-choices { gap:6px; margin-bottom:16px; }
.dee-action-chip { padding:7px 10px; min-height:36px; border-radius:8px; font-size:12px; }
.dee-action-chip[aria-pressed='true'] { color:var(--text); background:rgba(var(--signal-rgb),.12); border-color:var(--signal); }
.dee-step .step-icon { background:var(--surface-2); }
.dee-section + .dee-section { margin-top:24px; padding-top:24px; }
.dee-section .form-section-title h2 { font-size:17px; }
.dee-submit .btn-lg { min-height:48px; font-size:15px; }
.dee-preview { box-shadow:none; }
.dee-live { color:var(--text-muted); }
.dee-live i { background:var(--text-muted); }
.dee-result h2 { font-size:24px; }
.dee-how { margin-top:32px; padding-top:24px; }
.dee-how h2, .dee-faq h2 { font-size:18px; }
.dee-options > summary { font-size:13px; }

/* Editor: less nesting, secondary tools behind disclosures. */
.edit-shell { max-width:800px; padding-top:22px; }
.card-heading { gap:16px; margin-bottom:20px; }
.card-heading h1 { font-size:25px; line-height:1.3; margin:0; letter-spacing:-.035em; }
.share-panel { padding:0; border:0; border-radius:0; background:none; margin-bottom:16px; }
.share-panel > div:first-child span { font-size:12px; }
.share-panel .link-display { margin-top:7px; }
.stat-grid-two { gap:0; border-block:1px solid var(--border); padding:14px 0; margin:18px 0; }
.stat-grid-two .stat-card { padding:0 16px; border:0; border-radius:0; background:none; }
.stat-grid-two .stat-card:first-child { padding-left:0; border-right:1px solid var(--border); }
.stat-grid-two .num { margin:0; font:600 23px var(--font-display); }
.stat-grid-two .lbl { font-size:12px; margin-top:5px; }
.edit-presets { margin-bottom:8px; border-bottom:1px solid var(--border); padding-bottom:14px; }
.edit-presets > summary, .edit-step-options > summary { color:var(--text-muted); cursor:pointer; font-size:13px; }
.edit-presets > .preset-panel { margin-top:12px; }
.edit-step-options > .step-fields-row-split { margin-top:12px; }
.edit-step-options > summary { font-size:12px; }
.edit-actions { margin-top:24px; padding-top:20px; }

/* Admin: readable numbers, subdued table, mobile cards. */
.dee-admin-page .admin-heading { padding:26px 0 22px; align-items:center; }
.admin-heading h1 { font-size:30px; }
.admin-heading > p { font-size:13px; line-height:1.6; }
.stat-card { padding:18px; }
.stat-label { font-size:12px; }
.stat-card .num { font-family:var(--font-display); font-size:27px; }
.stat-card .lbl { font-size:12px; }
.admin-list-card { padding:0; border-radius:14px; margin-top:22px; }
.admin-toolbar { padding:20px; }
.admin-toolbar h2 { font-size:18px; }
.admin-toolbar p { font-size:12px; }
.admin-table th { font-family:var(--font-display) !important; font-size:11px !important; letter-spacing:0 !important; text-transform:none !important; }
.admin-table td { font-size:13px; }
.admin-table code { color:var(--text-muted) !important; }
.pagination:empty { display:none; }
.hosting-shell { max-width:800px; padding-bottom:40px; }
.hosting-shell .card > h1 { margin:0 0 12px; font-size:24px !important; }
.auth-heading { text-align:left; margin-bottom:22px; }
.auth-heading .logo-dot { width:36px; height:36px; margin-bottom:14px; }
.auth-heading .section-kicker { display:none; }
.auth-heading h1 { font-size:24px; }
.auth-heading > p:last-child { font-size:13px; margin-top:8px; }
.empty-card h2 { font-size:24px; }

@media(max-width:760px) {
 .dee-admin-page .navbar { flex-wrap:wrap; gap:8px; }
 .dee-admin-page .nav-links { width:100%; justify-content:flex-start; flex-wrap:wrap; gap:10px 14px; }
 .dee-admin-page .nav-links > a { display:inline-flex; align-items:center; min-height:36px; }
 .dee-admin-page > .container > main > .stat-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
 .dee-admin-page .stat-card { padding:13px 10px; }
 .dee-admin-page .stat-card .lbl { display:none; }
 .dee-admin-page .stat-card .num { font-size:24px; }
 .dee-admin-page .stat-label { min-height:38px; font-size:11px; }
 .admin-toolbar { padding:16px; gap:14px; }
 .table-wrap { overflow:visible; }
 table.admin-table { display:block; }
 .admin-table thead { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }
 .admin-table tbody { display:block; padding:0 16px 8px; }
 .admin-table tbody tr { display:grid; grid-template-columns:1fr 1fr; gap:12px; padding:16px 0; border-bottom:1px solid var(--border); }
 .admin-table tbody tr:last-child { border:0; }
 .admin-table tbody td { display:block; padding:0; border:0; min-width:0; }
 .admin-table tbody td::before { content:attr(data-label); display:block; color:var(--text-muted); font-size:11px; margin-bottom:5px; font-weight:400; }
 .admin-table td.table-title { grid-column:1 / -1; max-width:none; white-space:normal; overflow-wrap:anywhere; font-size:15px; }
 .admin-table td.table-title::before, .admin-table td.table-actions::before { display:none; }
 .admin-table td.table-actions { grid-column:1 / -1; display:flex; gap:8px; flex-wrap:wrap; }
 .table-actions .btn { flex:1; margin:0; }
 .search-form .form-control { min-width:0; }
 .card { padding:22px; }
 .admin-list-card { padding:0; }
}
@media(max-width:520px) {
 .card { padding:20px 16px; }
 .admin-list-card { padding:0; }
 .navbar { gap:10px; }
 .nav-links { gap:8px; }
 .brand { font-size:15px; gap:5px; }
 .brand-context { font-size:12px; }
 .nav-pill { font-size:12px !important; }
 .language-switcher a { min-width:32px; height:34px; font-size:11px; }
 .dee-editor { padding:20px 14px; }
 .dee-home .navbar { padding-block:10px; }
 .dee-heading { margin-top:12px; }
 .dee-heading h1 { font-size:26px; }
 .card-heading { display:flex; align-items:flex-start; gap:12px; }
 .card-heading h1 { font-size:22px; }
 .card-heading .badge { flex-shrink:0; margin-top:3px; }
 .edit-shell { padding-top:12px; }
 .step-fields { padding-right:0; }
 .step-remove { position:static; flex-shrink:0; width:26px; background:none; }
 .dee-edit-page .step-num { display:none; }
 .dee-edit-page .step-item { padding:13px 10px; gap:6px; }
 .link-display { flex-direction:row; align-items:center; padding:6px 6px 6px 10px; }
 .link-display input { width:0; min-width:0; padding:0; font-size:13px; }
 .link-display .btn { flex-shrink:0; }
 .dee-options .preset-picker { grid-template-columns:1fr 1fr; }
 .dee-result-actions > .btn { flex:1 1 auto; }
 .edit-actions { grid-template-columns:1fr; }
 .auth-shell { padding-inline:16px; }
 .countdown-setting { gap:10px; }
}

/* Subtle feedback, retaining the v9 layout and spacing. */
.dee-live { color:var(--signal); color:color-mix(in srgb,var(--signal) 80%,white); }
.dee-live i { background:var(--signal); box-shadow:0 0 0 3px rgba(var(--signal-rgb),.1); }
.card, .stat-card, .auth-card, .result-box, .dee-preview {
 transition:border-color .2s ease, box-shadow .2s ease;
}
.btn, .dee-action-chip, .step-btn {
 transition:background-color .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease, filter .18s ease;
}
.btn:focus-visible, .dee-action-chip:focus-visible, .step-btn:focus-visible,
.nav-links a:focus-visible, summary:focus-visible {
 outline:2px solid var(--signal); outline-offset:3px;
}
@media (hover:hover) and (pointer:fine) {
 .card:hover, .stat-card:hover, .auth-card:hover, .result-box:hover, .dee-preview:hover {
  border-color:#3b424d; box-shadow:0 8px 24px -20px rgba(0,0,0,.6);
 }
 .btn:not(:disabled):hover, .dee-action-chip:not(:disabled):hover { transform:translateY(-1px); }
 .btn-primary:not(:disabled):hover, .dee-unlock-page .btn-unlock:not(:disabled):hover {
  transform:translateY(-1px); box-shadow:0 5px 16px -8px rgba(var(--signal-rgb),.45);
 }
 .dee-unlock-page .step-btn:not(:disabled):hover { border-color:var(--signal); }
 .btn:not(:disabled):active, .dee-action-chip:not(:disabled):active,
 .dee-unlock-page .btn-unlock:not(:disabled):active { transform:translateY(0); }
}
@media (prefers-reduced-motion:no-preference) {
 .dee-editor, .dee-preview, .edit-shell > .card, .auth-card, .hosting-shell > .card,
 .dee-admin-page main, .unlock-card, .result-box, .empty-card {
  animation:dee-arrive .28s ease-out both;
 }
 .dee-live i { animation:dee-live-pulse 2.4s ease-in-out 3; }
}
@keyframes dee-arrive { from { opacity:0; transform:translateY(4px); } to { opacity:1; transform:translateY(0); } }
@keyframes dee-live-pulse { 0%,100% { box-shadow:0 0 0 3px rgba(var(--signal-rgb),.1); } 50% { box-shadow:0 0 0 5px rgba(var(--signal-rgb),.02); } }
@media (prefers-reduced-motion:reduce) {
 .card, .stat-card, .auth-card, .result-box, .dee-preview, .btn, .dee-action-chip,
 .step-btn, .dee-admin-page main, .dee-live i { animation:none !important; transition:none !important; }
 .btn:not(:disabled):hover, .dee-action-chip:not(:disabled):hover,
 .dee-unlock-page .btn-unlock:not(:disabled):hover { transform:none; }
}

/* Home accents: keep the v9 geometry, add quiet depth and platform cues. */
.dee-home .dee-heading { position:relative; isolation:isolate; }
.dee-home .dee-heading::before { content:""; position:absolute; z-index:-1; pointer-events:none; inset:-45px 0 -20px; max-width:740px; background:radial-gradient(ellipse closest-side at 40% 50%,rgba(var(--signal-rgb),.12),transparent 100%); }
.dee-headline-accent { color:var(--signal); color:color-mix(in srgb,var(--signal) 80%,white); }
.dee-action-chip { display:inline-flex; align-items:center; justify-content:center; gap:6px; }
.dee-chip-status { font-size:12px; opacity:.8; }
.dee-platform-icon { display:inline-flex; align-items:center; justify-content:center; width:16px; height:16px; flex:0 0 16px; color:var(--text-muted); }
.dee-platform-icon svg { width:100%; height:100%; display:block; }
.dee-platform-icon[data-platform="youtube"] { color:#ff554c; }
.dee-platform-icon[data-platform="facebook"] { color:#619cfa; }
.dee-platform-icon[data-platform="instagram"] { color:#ef70a1; }
.dee-platform-icon[data-platform="telegram"] { color:#5ac9ef; }
.dee-platform-icon[data-platform="discord"] { color:#9b9ff7; }
.dee-platform-icon[data-platform="line"] { color:#4edb86; }
.dee-platform-icon[data-platform="tiktok"], .dee-platform-icon[data-platform="twitter"] { color:#e8ebef; }
.dee-preview-step { gap:9px; }
.dee-preview-step .dee-platform-icon { width:18px; height:18px; flex-basis:18px; }
.dee-preview-label { flex:1; }
.dee-preview.is-updating { border-color:rgba(var(--signal-rgb),.65); box-shadow:0 0 0 2px rgba(var(--signal-rgb),.06); }
@media(prefers-reduced-motion:no-preference) {
 .dee-preview-step.is-new { animation:dee-step-arrive .24s ease-out; }
}
@keyframes dee-step-arrive { from { opacity:0; transform:translateY(5px); } to { opacity:1; transform:translateY(0); } }
@media(prefers-reduced-motion:reduce) { .dee-preview-step.is-new { animation:none; } }

/* Make remaining visitor steps stand out without adding extra panels. */
.step-launch-help { display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px; padding:0 4px 4px; font-size:12px; color:var(--text-muted); }
.step-launch-help[hidden] { display:none; }
.step-launch-help a { color:var(--signal); text-decoration:underline; text-underline-offset:3px; padding:5px 0; }
.step-launch-help a:focus-visible { outline:2px solid var(--signal); outline-offset:3px; border-radius:2px; }
.dee-unlock-page .step-btn:not(.is-done) { border-color:rgba(var(--signal-rgb),.55); }
.dee-unlock-page .step-btn:hover:not(.is-waiting):not(.is-done) { border-color:rgba(var(--signal-rgb),.8); }
.dee-unlock-page .step-btn.is-done,
.dee-unlock-page .step-btn.is-done:hover { background:#14171c; border-color:#272b33; box-shadow:none; }
.dee-unlock-page .step-btn.is-done .step-btn-label { color:#b7bfca; }
.dee-unlock-page .step-btn.is-done .step-btn-meta { color:#969fac; }
.dee-unlock-page .step-btn.is-done .step-btn-icon { opacity:.55; filter:saturate(.6); }
.dee-unlock-page .step-btn.is-done .check-mark::before { border-color:#aab1bc; }
