.header-nav{display:flex;align-items:center;gap:22px}.credit-badge{display:inline-flex;align-items:center;gap:7px;padding:8px 11px;border:1px solid var(--line);color:var(--ink);font:600 .72rem Arial,sans-serif;text-decoration:none}.credit-badge:hover{border-color:var(--terracotta);color:var(--terracotta-dark)}.credit-badge strong{font-size:.9rem}.credit-dot{color:var(--terracotta)}
.upload-copy{display:flex;flex-direction:column;gap:5px}.upload-copy strong{font-size:1rem}.upload-copy small{color:var(--muted);font:.72rem Arial,sans-serif}.effect-option{position:relative;align-items:flex-start}.effect-option-wide{grid-column:1/-1}.effect-copy{padding-right:42px}.effect-cost{position:absolute;right:10px;top:11px;color:var(--terracotta-dark);font:600 .64rem Arial,sans-serif;white-space:nowrap}.effect-picker legend{margin-bottom:10px;font:700 .8rem Arial,sans-serif}.button-outline{min-height:40px;padding:10px 14px;border:1px solid var(--terracotta);color:var(--terracotta-dark);background:transparent}.button-outline:hover{background:#fdf0e8}.alert-success{border-left:3px solid #69816a;background:#edf4ed;color:#405a42}
.credit-section{width:min(1120px,100%);margin:auto;padding:clamp(65px,9vw,110px) clamp(22px,6vw,70px);display:grid;grid-template-columns:minmax(240px,.8fr) 1.2fr;gap:clamp(35px,7vw,100px);border-top:1px solid var(--line)}.credit-section h2{font-size:clamp(2rem,4vw,3.7rem);font-weight:400;line-height:1;letter-spacing:-.05em;margin:0}.section-copy{margin-top:18px;color:var(--muted);font:.9rem/1.5 Arial,sans-serif}.credit-packs{border-top:1px solid var(--line)}.credit-pack{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:17px 0;border-bottom:1px solid var(--line)}.credit-pack strong,.credit-pack span{display:block}.credit-pack strong{font-size:1.05rem}.credit-pack span{margin-top:4px;color:var(--muted);font:.76rem Arial,sans-serif}
.flow-progress{display:flex;align-items:center;justify-content:center;gap:9px;margin:-7px 0 40px;color:#a79d91;font:600 .67rem Arial,sans-serif;text-transform:uppercase;letter-spacing:.04em}.flow-progress span{display:flex;align-items:center;gap:5px}.flow-progress i{width:26px;height:1px;background:var(--line)}.flow-progress .is-current{color:var(--terracotta-dark)}.flow-progress .is-failed{color:#a43f36}.result-figure figcaption{padding:3px 0 10px;color:var(--muted);font:600 .68rem Arial,sans-serif;text-align:left;text-transform:uppercase;letter-spacing:.08em}.result-next{margin:28px auto 0;padding:16px 20px;max-width:650px;background:#eee8df;color:#514941;text-align:center;font:.82rem/1.5 Arial,sans-serif}.result-next .text-link{margin-left:8px}.result-next-muted{background:#f0e5df}.site-footer{min-height:72px}
@media (max-width:700px){.header-nav{gap:10px}.credit-badge{padding:7px 8px}.header-link{letter-spacing:.05em}.effect-picker{grid-template-columns:1fr}.effect-option-wide{grid-column:auto}.credit-section{display:block}.credit-section>div:first-child{margin-bottom:38px}.credit-pack{align-items:flex-start}.flow-progress{gap:5px;margin-bottom:30px;font-size:.58rem}.flow-progress i{width:12px}.flow-progress b{display:none}.result-next .text-link{display:block;margin:6px 0 0}}
.htmx-indicator { opacity: 0; visibility: hidden; }
.htmx-request .htmx-indicator,
.htmx-request.htmx-indicator { opacity: 1; visibility: visible; transition: opacity 200ms ease-in; }