:root { color-scheme: light; --ink:#16332c; --muted:#667a73; --paper:#fbfaf4; --card:#fff; --leaf:#236b58; --mint:#dcebe3; --line:#dce4de; --danger:#9b2f2f; font-family: Inter, ui-sans-serif, system-ui, sans-serif; }
.shared > img { display:block; width:100%; height:auto; margin:20px 0; border-radius:18px; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:radial-gradient(circle at 20% 0,#edf5ea,transparent 34rem),var(--paper); min-height:100vh; }
header { height:70px; max-width:1180px; margin:auto; padding:0 24px; display:flex; align-items:center; justify-content:space-between; }
.brand { font-family:Georgia,serif; font-size:1.55rem; color:var(--ink); text-decoration:none; }
main { max-width:1180px; margin:auto; padding:40px 24px 80px; }
h1,h2 { font-family:Georgia,serif; font-weight:500; line-height:1.08; }
h1 { font-size:clamp(2.5rem,6vw,5.3rem); margin:.15em 0; max-width:850px; }
h2 { font-size:1.8rem; }
.eyebrow { text-transform:uppercase; letter-spacing:.14em; color:var(--leaf); font-weight:750; font-size:.74rem; }
.login-card { max-width:760px; padding:50px 0; }
.login-card p { max-width:580px; font-size:1.12rem; }
label { display:grid; gap:7px; color:var(--muted); font-size:.88rem; font-weight:650; }
#create-form [data-place-field][hidden], #create-form [data-selection-note]:empty { display:none; }
input,textarea,select { width:100%; border:1px solid var(--line); background:#fff; color:var(--ink); border-radius:11px; padding:12px 14px; font:inherit; }
textarea { resize:vertical; }
button { border:0; border-radius:999px; padding:12px 20px; background:var(--leaf); color:#fff; font:inherit; font-weight:750; cursor:pointer; }
button:disabled { opacity:.45; cursor:not-allowed; }
.quiet { background:var(--mint); color:var(--ink); }
form { display:grid; gap:16px; }
.login-card form { max-width:440px; margin-top:28px; }
.hero { display:flex; justify-content:space-between; gap:30px; align-items:flex-end; }
.hero h1 { font-size:clamp(2.7rem,5vw,4.7rem); }
.balance { background:var(--ink); color:#fff; border-radius:22px; padding:20px 24px; min-width:180px; display:grid; gap:4px; }
.balance strong { font-size:1.8rem; }.balance button { margin-top:8px; }
.tabs { display:flex; gap:8px; flex-wrap:wrap; margin:40px 0 24px; border-bottom:1px solid var(--line); padding-bottom:12px; }
.tabs button { background:transparent; color:var(--muted); padding:9px 14px; }.tabs button.active { color:var(--leaf); background:var(--mint); }
.toolbar { display:flex; gap:14px; align-items:center; margin-bottom:22px; }.toolbar input[type=search] { max-width:420px; }.toolbar label { display:flex; align-items:center; white-space:nowrap; }.toolbar input[type=checkbox] { width:auto; }
.story-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:16px; }
.story-card,.panel,.stack>div { background:var(--card); border:1px solid var(--line); border-radius:18px; padding:20px; box-shadow:0 10px 35px #214f3b0b; }
.story-card { cursor:pointer; min-height:190px; display:flex; flex-direction:column; }.story-card h3 { font-family:Georgia,serif; font-size:1.4rem; margin:.2rem 0; }.story-card .meta { margin-top:auto; color:var(--muted); font-size:.8rem; display:flex; justify-content:space-between; }
.status { display:inline-flex; border-radius:999px; background:var(--mint); padding:4px 9px; font-size:.72rem; width:max-content; }.status.failed { background:#f5dddd; }.status.generating,.status.queued { background:#f6edcd; }
.form-grid,.split { display:grid; grid-template-columns:1fr 1fr; gap:18px; }.panel { max-width:820px; }.split .panel { align-self:start; }
fieldset { border:1px solid var(--line); border-radius:12px; padding:14px; }.checks { display:flex; flex-wrap:wrap; gap:12px; }.checks label { display:flex; align-items:center; }.checks input { width:auto; }
.stack { display:grid; gap:12px; }.stack h3 { margin:0; }.stack .actions { display:flex; gap:8px; margin-top:12px; }.stack button { padding:7px 12px; }
.message { color:var(--muted); }.hidden { display:none !important; }.danger { border-color:#eccaca; }.danger-button { background:var(--danger); }
dialog { width:min(820px,calc(100% - 30px)); border:0; border-radius:20px; padding:26px; color:var(--ink); }dialog::backdrop { background:#102b2488; }.close { float:right; padding:4px 11px; font-size:1.4rem; background:var(--mint); color:var(--ink); }.story-actions { display:flex; flex-wrap:wrap; gap:8px; margin:20px 0; }.story-text { font-family:Georgia,serif; font-size:1.08rem; line-height:1.7; white-space:pre-wrap; }.shared { max-width:760px; }.shared article { background:#fff;border:1px solid var(--line);padding:30px;border-radius:20px;font-family:Georgia,serif;font-size:1.1rem;line-height:1.75; }.summary { color:var(--muted); }
@media(max-width:700px){main{padding-top:20px}.hero,.toolbar{align-items:stretch;flex-direction:column}.balance{width:100%}.form-grid,.split{grid-template-columns:1fr}.toolbar input[type=search]{max-width:none}}

/* Shared personal character/place flow; no external UI or font dependency. */
.region-choice { min-width:0; }
.profile-fields > .region-choice,.form-grid > .region-choice { grid-column:1 / -1; }
.region-preview { background:#f0f6f1; border:1px solid var(--line); border-radius:12px; padding:18px 20px; margin-top:12px; overflow-wrap:anywhere; }
.region-preview h3 { font-family:Georgia,serif; font-size:1.3rem; font-weight:500; margin:0 0 10px; }
.region-preview h4 { font-size:.9rem; margin:16px 0 6px; }
.region-preview p,.region-preview li { font-size:.92rem; line-height:1.55; margin:0; }
.region-preview ul { padding-left:20px; margin:0; }
.region-preview li+li { margin-top:8px; }
.region-preview li span { display:block; color:var(--muted); }
.region-preview summary { cursor:pointer; padding:12px 0; min-height:44px; font-size:.92rem; }
:focus-visible { outline:3px solid #b37820; outline-offset:4px; }
.profiles-active .hero { display:none; }
.profiles-active .tabs { margin-top:0; }
.profile-heading h2 { font-size:clamp(2rem,4vw,3rem); margin:8px 0 22px; }
.personal-profiles { max-width:1050px; }
.profile-toolbar { display:flex; flex-wrap:wrap; gap:12px; align-items:end; margin-bottom:24px; }
.profile-toolbar label { margin-left:auto; min-width:190px; }
.profile-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,290px),1fr)); gap:18px; }
.profile-card,.profile-empty { background:var(--card); border:1px solid var(--line); border-radius:18px; padding:24px; overflow-wrap:anywhere; }
.profile-card h3,.profile-empty h3 { font-family:Georgia,serif; font-size:1.5rem; font-weight:500; margin:18px 0 10px; }
.profile-card p { line-height:1.6; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:4; overflow:hidden; }
.profile-card-top,.profile-card .actions { display:flex; flex-wrap:wrap; align-items:center; gap:10px; }
.profile-recognition { color:var(--muted); font-size:.9rem; }
.profile-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; }
.profile-fields > * { min-width:0; }
.profile-body > form { max-width:900px; padding:28px; border:1px solid var(--line); border-radius:18px; background:var(--card); }
.profile-body > p { max-width:700px; line-height:1.6; }
.profile-body label { font-size:.96rem; color:var(--ink); }
.profile-body input,.profile-body textarea,.profile-body select { font-size:1rem; line-height:1.5; }
.profile-body textarea { min-height:105px; }
.field-hint { display:block; font-size:.85rem; color:var(--muted); font-weight:400; line-height:1.5; margin-top:4px; }
.optional-questions,.profile-original { margin:5px 0; }
.optional-questions > summary,.profile-original > summary,.profile-privacy summary { padding:12px 0; cursor:pointer; min-height:44px; }
.optional-questions .profile-fields { margin-top:16px; }
.profile-privacy { border-left:3px solid var(--leaf); padding:16px 20px; margin:12px 0; background:#f0f6f1; border-radius:0 12px 12px 0; }
.profile-privacy p { margin:8px 0 0; line-height:1.6; font-size:.93rem; }
.profile-privacy summary { font-size:.92rem; }
.profile-form-actions { display:flex; flex-wrap:wrap; align-items:center; gap:12px; padding-top:10px; }
.text-button { background:transparent; color:var(--leaf); text-decoration:underline; text-underline-offset:4px; }
.profile-body button { min-height:44px; }
.profile-error,.profile-notice { border-radius:12px; padding:16px 20px; line-height:1.6; }
.profile-error { background:#fff1ef; color:#862b2b; border:1px solid #e3b4b0; }
.profile-notice { background:var(--mint); }
.profile-drafts { margin-bottom:28px; padding:22px; background:#f1f5ef; border-radius:16px; }
.profile-drafts h3 { margin-top:0; }
.profile-draft { display:flex; flex-wrap:wrap; align-items:center; gap:12px; padding:14px 0; border-top:1px solid var(--line); }
.profile-draft > div { margin-right:auto; min-width:0; overflow-wrap:anywhere; }
.profile-pending { padding:40px 24px; max-width:700px; border:1px solid var(--line); border-radius:18px; background:white; text-align:center; line-height:1.6; }
.profile-spinner { display:inline-block; width:28px; height:28px; border:3px solid var(--mint); border-top-color:var(--leaf); border-radius:50%; animation:profile-spin 1s linear infinite; }
@keyframes profile-spin { to { transform:rotate(360deg); } }
.profile-conflicts { max-width:800px; padding:24px; margin-bottom:20px; border:1px solid #dcb982; background:#fff8e9; border-radius:16px; line-height:1.6; }
.profile-original dd { margin:5px 0 18px; white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.5; }
.profile-original dt { font-weight:650; }
@media(prefers-reduced-motion:reduce) { .profile-spinner { animation:none; } }
@media(max-width:700px) { .profile-fields { grid-template-columns:1fr; }.profile-body > form { padding:20px 16px; }.profile-toolbar { align-items:stretch; }.profile-toolbar label { margin-left:0; width:100%; }.profile-toolbar > button { flex:1; }.profile-form-actions { align-items:stretch; flex-direction:column; }.profile-card { padding:20px; }.profile-draft > div { width:100%; }.tabs button { min-height:44px; }.profile-body,.profile-feedback { min-width:0; } }
.subscription-facts { display:grid; grid-template-columns:minmax(110px,auto) minmax(0,1fr); gap:8px 20px; }
.subscription-facts dt { font-weight:600; }
.subscription-facts dd { margin:0; overflow-wrap:anywhere; }
.token-validity { margin-top:-8px; }
#checkout-draft-note:empty { display:none; }
@media(max-width:500px) { .subscription-facts { grid-template-columns:1fr; gap:4px; }.subscription-facts dd { margin-bottom:10px; } }

[aria-invalid="true"]{outline:2px solid #a42e35;outline-offset:2px}
[data-consent-error]{display:block;color:#a42e35;margin-block:.4rem}

.selection-warning{padding:.7rem 1rem;background:#fff3cd;color:#604500;border:1px solid #b48613;border-radius:.5rem}.selection-warning-field{border:2px solid #b48613;background:#fff9e5;color:#30280f}.job-filters{display:flex;flex-wrap:wrap;gap:1rem}

/* Token prices share the approved flat gold coin at a fixed button size. */
.token-coin { display:inline-flex; align-items:center; gap:6px; white-space:nowrap; font-variant-numeric:tabular-nums; flex:0 0 auto; vertical-align:middle; margin-inline:3px; line-height:1; }
.token-coin > svg { display:block; max-width:none; overflow:visible; }
.token-coin text { font-variant-numeric:tabular-nums; }

/* Dialog locking owns one attribute, never snapshots/restores unrelated inline styles. */
html[data-portal-modal-lock] { overflow:hidden; }
html[data-portal-modal-lock] body { position:fixed; top:var(--portal-scroll-top); left:var(--portal-scroll-left); width:100%; overflow:hidden; padding-right:var(--portal-scroll-padding); }

.token-price-confirmation { max-width:min(540px,calc(100vw - 24px)); border:1px solid #ad9668; border-radius:16px; background:#fffae8; color:#241204; padding:24px; }
.token-price-confirmation::backdrop { background:#0b151299; }

.token-amount { white-space:nowrap; font-variant-numeric:tabular-nums; }
.token-costs { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:14px 16px; align-items:center; margin:22px 0; }
.token-costs dt,.token-costs dd { margin:0; }
.token-costs dd { justify-self:end; }
.token-history-pages { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-items:center; gap:12px; margin-top:20px; }
.token-history-pages span { grid-column:1 / -1; grid-row:1; text-align:center; }
.character-image-actions { display:flex; align-items:center; gap:12px; }
.character-image-actions > :first-child { flex:1; }
.portal-page .character-image-actions .image-delete-button,.portal-page .kw-pick-actions .image-delete-button { display:inline-flex; flex:0 0 44px; align-items:center; justify-content:center; width:44px; min-width:44px; height:44px; min-height:44px; padding:0; border:1px solid #853c2f; background:#fffbed; color:#853c2f; }

.story-card-details { display:grid; gap:3px; margin:8px 0 12px; color:var(--muted); font-size:.85rem; line-height:1.4; overflow-wrap:anywhere; hyphens:auto; }

[data-detail-section="covers"] [data-action="variant"] { margin-top:16px; }
