/* The same neutral night surface across the public site and creation tools. */
body.site-surface{position:relative;isolation:isolate;min-height:100vh;min-height:100dvh}
body.site-surface{background:var(--ui-background);color:var(--ui-ink)}
[data-theme="dark"] .site-surface .workspace,[data-theme="dark"] .site-surface .workspace>#main,[data-theme="dark"] .site-surface .topbar{background:transparent}

/* Public templates map their semantic tokens onto the same theme. */
body.lut-public{
 --paper:var(--ui-background);--ink:var(--ui-ink);--muted:var(--ui-muted);--line:var(--ui-line);
 --accent:var(--ui-ink);--tint:var(--ui-soft);
 background:var(--paper);color:var(--ink);
}
[data-theme="dark"] .lut-public .site-header,[data-theme="dark"] .lut-public .site-footer{background:transparent}
[data-theme="dark"] .lut-public .hero h1 span{color:#b9bdc3}
[data-theme="dark"] .lut-public .hero-index .mode-mark{background:#181a1ed9;border-color:#ffffff24;color:#e0e2e5}
[data-theme="dark"] .lut-public .hero-index a:hover .mode-mark{background:#2a2d32}
[data-theme="dark"] .lut-public .notice{color:#b9bdc3;background:#17191cdd;border-color:var(--line)}
[data-theme="dark"] .lut-public .legal-document p,[data-theme="dark"] .lut-public .legal-document ul{color:#c3c5c8}
[data-theme="dark"] .lut-public .creator-plan{background:#17191ce8;border-color:var(--line)}
[data-theme="dark"] .lut-public .plan-featured{background:#22252aeb;border-color:#ffffff45}
[data-theme="dark"] .lut-public .plan-featured .bonus-badge{background:#353940;color:#e2e4e7}
[data-theme="dark"] .lut-public .plan-featured .plan-features li{border-color:var(--line)}
[data-theme="dark"] .lut-public .plan-features li{border-color:var(--line)}
[data-theme="dark"] .lut-public .skip{background:#d7dadd;color:#18191b}
[data-theme="dark"] .lut-public button:disabled,[data-theme="dark"] .lut-public .plan-featured button:disabled{background:#25282d;color:#92969d;border-color:var(--line)}
[data-theme="dark"] .lut-public ::selection{background:#c5c9d0;color:#101114}

/* Small server-rendered pages use one layout instead of inline styles. */
.lut-message,.lut-community{margin:0;font:17px/1.65 var(--ui-font);overflow-wrap:anywhere}
.lut-message main{max-width:570px;margin:12vh auto;padding:28px}
.lut-message h1{font-size:clamp(28px,6vw,36px);line-height:1.2}
.lut-message .message-action{display:inline-block;margin-top:12px;padding:13px 22px;text-decoration:none}
.lut-community main{max-width:960px;margin:32px auto;padding:0 20px}
.lut-community article{margin:32px 0;padding:20px;border:1px solid var(--ui-line);border-radius:16px;background:var(--ui-sidebar)}
.lut-community img,.lut-community video{display:block;max-width:100%;width:auto;height:auto;max-height:75vh}
.lut-community a{color:inherit;padding:10px 0;display:inline-block}
.lut-community h2{font-size:1.25rem}
.lut-community nav{display:flex;gap:24px;flex-wrap:wrap}
@media(max-width:480px){.lut-message main{margin:8vh auto;padding:22px}.lut-community main{margin:20px auto;padding:0 16px}}