.component-landing{box-sizing:border-box;display:flex;flex-direction:column;gap:clamp(var(--space-6),5vw,3.5rem);width:100%;padding-block:0 var(--space-8);--landing-bleed:var(--space-4);--landing-ease:cubic-bezier(0.16,1,0.3,1);--landing-mark-travel:260ms;--landing-develop:420ms}@media (width < 768px){.component-landing{--landing-bleed:var(--space-3)}}@media (width >= 1024px){.component-landing{--landing-bleed:var(--space-6)}}.component-landing-band{margin-inline:calc(var(--landing-bleed) * -1);overflow:hidden}.component-landing-band-inner{box-sizing:border-box;padding-inline:var(--landing-bleed)}.component-landing-hero{position:relative;display:flex;align-items:flex-end;min-height:clamp(20rem,42vh,30rem);isolation:isolate}.component-landing-hero-art{z-index:0;-o-object-fit:cover;object-fit:cover;visibility:hidden;opacity:0;transition:opacity var(--landing-develop) var(--landing-ease),visibility var(--landing-develop) var(--landing-ease)}.component-landing-hero-scrim{position:absolute;inset:0;z-index:1;pointer-events:none;background:var(--brand-hero-scrim-base)}.component-landing-hero-copy{position:relative;z-index:2;display:flex;flex-direction:column;gap:var(--space-4);width:100%;padding-block:var(--space-8);background:linear-gradient(to bottom,var(--brand-hero-scrim-clear) 0,var(--brand-hero-scrim-text) var(--space-6),var(--brand-hero-scrim-text) 100%)}.component-landing .component-landing-title{font-size:clamp(2.5rem,6vw,4rem);font-weight:600;line-height:1.05;letter-spacing:-.02em;color:var(--brand-hero-ink)}.component-landing .component-landing-title,.component-landing-lead{max-width:var(--page-width-prose);margin:0;font-family:var(--font-narrative)}.component-landing-lead{font-size:var(--font-size-md);line-height:1.55;color:var(--brand-hero-ink-soft)}.component-landing-actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-4);margin-top:var(--space-2)}.component-landing-cta{display:inline-flex;align-items:center;min-height:var(--control-height-touch);padding-inline:var(--space-6);font-family:var(--font-interface);font-size:var(--font-size-base);font-weight:600;color:var(--color-on-accent);background:var(--color-accent);border-radius:var(--radius-md);text-decoration:none;transition:background-color .12s ease}.component-landing-cta:hover{color:var(--color-text-inverse);background:var(--color-accent-hover)}.component-landing-cta-secondary{display:inline-flex;align-items:center;min-height:var(--control-height-touch);font-family:var(--font-interface);font-size:var(--font-size-base);font-weight:500;text-decoration:underline;text-underline-offset:3px}.component-landing-hero-copy .component-landing-cta-secondary,.component-landing-hero-copy .component-landing-cta-secondary:hover{color:var(--brand-hero-ink)}.component-landing-cta-secondary:focus-visible,.component-landing-cta:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px;border-radius:var(--radius-sm)}.component-landing-hero-copy .component-landing-cta-secondary:focus-visible{outline-color:var(--brand-hero-ink)}.component-landing-selector{display:flex;flex-direction:column;gap:var(--space-3)}.component-landing-showing{display:flex;flex-wrap:wrap;gap:var(--space-2);font-size:var(--font-size-sm)}.component-landing-label,.component-landing-showing{margin:0;font-family:var(--font-system);color:var(--color-text-secondary)}.component-landing-label{font-size:var(--font-size-xs);font-weight:500;letter-spacing:.14em;text-transform:uppercase}.component-landing-plates{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-4);margin:0;padding:0;border:0;min-inline-size:0}@media (width < 640px){.component-landing-plates{grid-template-columns:repeat(2,minmax(0,1fr))}}.component-landing-plate{position:relative}.component-landing-plate-input{position:absolute;inset-block-start:50%;inset-inline-start:50%;width:1px;height:1px;margin:0;opacity:0;pointer-events:none}.component-landing-plate-label{display:flex;flex-direction:column;gap:var(--space-2);padding-block-end:var(--space-2);border-block-end:3px solid transparent;cursor:pointer;opacity:.6;transition:opacity var(--landing-mark-travel) var(--landing-ease),border-color var(--landing-mark-travel) var(--landing-ease)}.component-landing-plate-label:hover{opacity:.85}.component-landing-plate-thumb{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;border-radius:var(--radius-sm);background:var(--color-surface)}.component-landing-plate-thumb img{-o-object-fit:cover;object-fit:cover;transition:scale .3s var(--landing-ease)}.component-landing-plate-input:focus-visible+.component-landing-plate-label .component-landing-plate-thumb img,.component-landing-plate-label:hover .component-landing-plate-thumb img{scale:1.04}.component-landing-plate-caption{font-family:var(--font-interface);font-size:var(--font-size-sm);color:var(--color-text-primary)}.component-landing-pane{flex-direction:column;gap:clamp(var(--space-6),5vw,3.5rem)}.component-landing-heading{margin:0 0 var(--space-4);font-family:var(--font-interface);font-size:var(--font-size-lg);font-weight:600;color:var(--color-text-primary)}.component-landing-exchange-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);gap:var(--space-6);align-items:start}@media (width < 768px){.component-landing-exchange-grid{grid-template-columns:minmax(0,1fr)}}.component-landing-returned,.component-landing-typed{display:flex;flex-direction:column;gap:var(--space-3)}.component-landing-authored{display:flex;flex-direction:column;gap:var(--space-4)}.component-landing-typed{padding:var(--space-5);background:var(--brand-typed-surface);border-radius:var(--radius-md)}.component-landing-built{display:flex;flex-direction:column;gap:var(--space-3);border-inline-start:2px solid var(--color-border)}.component-landing-built,.component-landing-returned{padding:var(--space-4);background:var(--brand-page-wash)}.component-landing-traits{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--space-2) var(--space-3);margin:0}.component-landing-trait-term{font-family:var(--font-system);font-size:var(--font-size-xs);color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.08em;padding-block-start:var(--space-1)}.component-landing-trait-list{display:flex;flex-wrap:wrap;gap:var(--space-2);margin:0}.component-landing-trait{padding:var(--space-1) var(--space-2);font-family:var(--font-system);font-size:var(--font-size-sm);color:var(--color-text-primary);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-sm)}.component-landing-typed .component-landing-label,.component-landing-typed-text{color:var(--brand-typed-ink)}.component-landing-typed-text{margin:0;font-family:var(--font-system);font-size:var(--font-size-sm);line-height:1.6}.component-landing-prose{max-width:var(--page-width-prose);margin:0;font-family:var(--font-narrative);font-size:var(--font-size-lg);line-height:1.6;color:var(--color-text-primary)}.component-landing-decision-note{max-width:var(--page-width-prose);margin:0 0 var(--space-5);padding:var(--space-3) var(--space-4);font-family:var(--font-interface);font-size:var(--font-size-sm);line-height:1.5;color:var(--color-text-secondary);background:var(--brand-page-wash)}.component-landing-heading:has(+.component-landing-decision-note){margin-bottom:var(--space-2)}.component-landing-choices{display:flex;flex-direction:column;gap:var(--space-3);margin:0 0 var(--space-5);padding:0;list-style:none}.component-landing-choice{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-3);padding:var(--space-4) var(--space-5);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface)}.component-landing-choice-taken{border-color:var(--color-accent);background:var(--color-accent-soft)}.component-landing-choice-text{font-family:var(--font-narrative);font-size:var(--font-size-2xl);line-height:1.3;color:var(--color-text-primary)}@media (width < 640px){.component-landing-choice-text{font-size:var(--font-size-xl)}}.component-landing-choice-taken .component-landing-choice-text{color:var(--color-accent-strong)}.component-landing-choice-mark{font-size:var(--font-size-2xs);font-weight:600;color:var(--color-on-accent);background:var(--color-accent);padding:var(--space-1) var(--space-2);border-radius:var(--radius-sm)}.component-landing-check,.component-landing-choice-mark{font-family:var(--font-system);letter-spacing:.12em;text-transform:uppercase}.component-landing-check{display:flex;flex-wrap:wrap;gap:var(--space-2);margin:0;padding:var(--space-4) var(--space-4) var(--space-3);font-size:var(--font-size-xs);color:var(--color-text-secondary);background:var(--brand-page-wash)}.component-landing-check-skill{font-weight:600;color:var(--color-text-primary)}.component-landing-check-verdict{font-weight:600;color:var(--color-danger)}.component-landing-consequence{max-width:var(--page-width-prose);padding:0 var(--space-4) var(--space-4);background:var(--brand-page-wash)}.component-landing-consequence-lead{color:var(--color-accent-strong)}.component-landing-closing{background:var(--color-accent-soft);border-block:1px solid var(--color-border)}.component-landing-closing-inner{display:flex;flex-direction:column;align-items:center;gap:var(--space-4);padding-block:var(--space-8);text-align:center}.component-landing .component-landing-closing-text{max-width:var(--page-width-prose);margin:0;font-family:var(--font-interface);font-size:var(--font-size-md);font-weight:500;line-height:1.6;color:var(--color-text-primary)}.component-landing-footer{display:flex;flex-wrap:wrap;gap:var(--space-5);padding-top:var(--space-5);border-top:1px solid var(--color-border)}.component-landing-footer-link{display:inline-flex;align-items:center;min-height:var(--control-height-touch);font-family:var(--font-interface);font-size:var(--font-size-sm);color:var(--color-text-secondary);text-decoration:none}.component-landing-footer-link:hover{color:var(--color-accent)}.component-landing-footer-link:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px;border-radius:var(--radius-sm)}@media (width < 640px){.component-landing{gap:var(--space-4)}.component-landing-hero-copy{padding-block:var(--space-6);background:linear-gradient(to bottom,var(--brand-hero-scrim-clear) 0,var(--brand-hero-scrim-text) var(--space-4),var(--brand-hero-scrim-text) 100%)}.component-landing-plate-thumb{aspect-ratio:2/1}.component-landing-heading{margin-block-end:var(--space-3)}.component-landing-exchange-grid{gap:var(--space-4)}.component-landing-typed{padding:var(--space-4)}.component-landing-prose{font-size:var(--font-size-base);line-height:1.65}.component-landing-choices{gap:var(--space-2);margin-block-end:var(--space-4)}.component-landing-choice{padding:var(--space-3) var(--space-4)}.component-landing-closing-inner{padding-block:var(--space-6)}}.component-landing-plate-input:checked+.component-landing-plate-label{opacity:1;border-block-end-color:var(--color-accent)}@supports selector(:has(*)){@media (width >= 640px){.component-landing-plates{--landing-mark-index:0}.component-landing-plate-input:checked+.component-landing-plate-label{border-block-end-color:transparent}.component-landing-plates:after{content:"";position:absolute;inset-block-end:0;inset-inline-start:0;block-size:3px;inline-size:calc((100% - 3 * var(--space-4)) / 4);background:var(--color-accent);translate:calc(var(--landing-mark-index) * (100% + var(--space-4))) 0;transition:translate var(--landing-mark-travel) var(--landing-ease)}.component-landing-plates:has(#landing-world-survey-ship:checked){--landing-mark-index:1}.component-landing-plates:has(#landing-world-normandy:checked){--landing-mark-index:2}.component-landing-plates:has(#landing-world-debt-court:checked){--landing-mark-index:3}}}.component-landing-plate-input:focus-visible+.component-landing-plate-label{outline:2px solid var(--color-accent);outline-offset:3px;border-radius:var(--radius-sm)}.component-landing-hero-art[data-world=port-city]{visibility:visible;opacity:1}.component-landing-pane,.component-landing-showing{display:none}.component-landing-pane[data-world=port-city],.component-landing-showing[data-world=port-city]{display:flex}@supports selector(:has(*)){.component-landing:has(.component-landing-plate-input:checked) .component-landing-hero-art{visibility:hidden;opacity:0}.component-landing:has(.component-landing-plate-input:checked) .component-landing-pane,.component-landing:has(.component-landing-plate-input:checked) .component-landing-showing{display:none}.component-landing:has(#landing-world-debt-court:checked) .component-landing-hero-art[data-world=debt-court],.component-landing:has(#landing-world-normandy:checked) .component-landing-hero-art[data-world=normandy],.component-landing:has(#landing-world-port-city:checked) .component-landing-hero-art[data-world=port-city],.component-landing:has(#landing-world-survey-ship:checked) .component-landing-hero-art[data-world=survey-ship]{visibility:visible;opacity:1}.component-landing:has(#landing-world-debt-court:checked) .component-landing-showing[data-world=debt-court],.component-landing:has(#landing-world-normandy:checked) .component-landing-showing[data-world=normandy],.component-landing:has(#landing-world-port-city:checked) .component-landing-showing[data-world=port-city],.component-landing:has(#landing-world-survey-ship:checked) .component-landing-showing[data-world=survey-ship]{display:flex}.component-landing:has(#landing-world-debt-court:checked) .component-landing-pane[data-world=debt-court],.component-landing:has(#landing-world-normandy:checked) .component-landing-pane[data-world=normandy],.component-landing:has(#landing-world-port-city:checked) .component-landing-pane[data-world=port-city],.component-landing:has(#landing-world-survey-ship:checked) .component-landing-pane[data-world=survey-ship]{display:flex}}.badge{display:inline-flex;align-items:center;gap:var(--space-1);border:1px solid transparent;border-radius:var(--radius-full);font-family:var(--font-system);font-weight:600;text-transform:uppercase;letter-spacing:.05em;white-space:nowrap;line-height:1}.badge-sm{padding:var(--space-0_5) var(--space-1_5);font-size:var(--font-size-2xs)}.badge-md{padding:var(--space-0_5) var(--space-2);font-size:var(--font-size-2xs_5)}.badge-lg{padding:var(--space-1) var(--space-3);font-size:var(--font-size-xs)}.badge-default,.badge-default-static{background:var(--color-accent-soft);color:var(--color-accent);border-color:var(--color-accent)}.badge-secondary,.badge-secondary-static{background:var(--color-surface-hover);color:var(--color-text-secondary);border-color:var(--color-border)}.badge-outline,.badge-outline-static{background:transparent;color:var(--color-text-primary);border-color:var(--color-border)}.badge-destructive,.badge-destructive-static{background:color-mix(in srgb,var(--color-danger) 12%,transparent);color:var(--color-danger);border-color:var(--color-danger)}.badge-success,.badge-success-static{background:hsl(var(--success-muted));color:hsl(var(--success-text));border-color:hsl(var(--success-border))}.badge-warning,.badge-warning-static{background:var(--color-warning-soft);color:var(--color-warning);border-color:var(--color-warning-border)}.badge-info,.badge-info-static{background:hsl(var(--info-muted));color:hsl(var(--info-text));border-color:hsl(var(--info-border))}.badge-available{background:hsl(var(--success-muted));color:hsl(var(--success-text));border-color:hsl(var(--success-border))}.badge-unavailable{background:var(--color-surface-muted,var(--color-surface-hover));color:var(--color-text-muted);border-color:var(--color-border)}.badge-skill-requirement{background:var(--color-accent-soft);color:var(--color-accent);border-color:var(--color-accent)}.badge .badge-icon{display:inline-flex;align-items:center;justify-content:center}.badge .badge-icon svg{width:.75em;height:.75em}.badge .badge-count{display:inline-flex;align-items:center;justify-content:center;min-width:1.25em;padding:0 var(--space-1);margin-left:var(--space-1);border-radius:var(--radius-full);background:var(--color-surface);color:var(--color-text-primary);font-size:.85em;font-weight:700}.component-character-attribute-display .character-display-empty,.component-character-skill-display .character-display-empty{color:var(--color-text-muted);text-align:center;padding:var(--space-4) 0}.character-attribute-categories,.character-skill-categories{display:flex;flex-direction:column;gap:var(--space-6)}.character-attribute-category,.character-skill-category{display:flex;flex-direction:column}.character-attribute-category-heading,.character-skill-category-heading{margin:0 0 var(--space-3) 0;font-size:var(--font-size-md);font-weight:600;color:var(--color-text-primary);text-transform:capitalize}.character-attribute-grid,.character-skill-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:var(--space-4)}.character-attribute-card,.character-skill-card{padding:var(--space-4);background:var(--color-surface-hover);border:1px solid var(--color-border);border-radius:var(--radius-md)}.character-skill-card{background:var(--color-accent-soft)}.character-attribute-name,.character-skill-name{margin:0 0 var(--space-1) 0;font-size:var(--font-size-sm);font-weight:500;color:var(--color-text-muted)}.character-attribute-value,.character-skill-value{margin:0;font-size:var(--font-size-xl);font-weight:700;color:var(--color-text-primary)}.character-attribute-base,.character-skill-level-label{margin:0 0 var(--space-2) 0;font-size:var(--font-size-xs);color:var(--color-text-muted)}.character-attribute-description,.character-skill-description{margin:0;font-size:var(--font-size-xs);color:var(--color-text-muted)}.component-attributes-form,.component-background-form,.component-basic-info-form,.component-skills-form,.component-world-basic-info-form,.component-world-settings-form{display:flex;flex-direction:column;gap:var(--space-4)}.attributes-form-header,.skills-form-header{display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:var(--space-3)}.attributes-form-header h2,.skills-form-header h2{margin:0;font-family:var(--font-interface);font-size:var(--font-size-md);font-weight:600}.attributes-form-list,.skills-form-list{display:flex;flex-direction:column;gap:var(--space-3)}.attributes-form-row,.skills-form-row{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-3);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md)}.attributes-form-meta,.skills-form-meta{font-size:var(--font-size-xs);color:var(--color-text-muted)}.attributes-form-description,.skills-form-description{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.attributes-form-constraint,.skills-form-constraint{font-size:var(--font-size-xs_5);color:var(--color-warning);font-weight:500}.skills-form-label-row{display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:var(--space-2)}.skills-form-difficulty{display:inline-flex;align-items:center;padding:var(--space-0_5) var(--space-2);background:var(--color-surface-hover);color:var(--color-text-secondary);border:1px solid var(--color-border);border-radius:var(--radius-full);font-size:var(--font-size-2xs);font-weight:600;letter-spacing:.05em;text-transform:uppercase}.background-form-fields{display:flex;flex-direction:column;gap:var(--space-4)}.world-editor-form{display:flex;flex-direction:column;gap:var(--space-5);max-width:900px;margin:0 auto;width:100%}.world-editor-actions{display:flex;flex-direction:row;justify-content:flex-end;gap:var(--space-3);padding-top:var(--space-4);border-top:1px solid var(--color-border)}.world-editor-error,.world-editor-loading{text-align:center;padding:var(--space-8);color:var(--color-text-muted)}.devtools-section{display:flex;flex-direction:column;gap:var(--space-1);padding:var(--space-2);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-canvas)}.devtools-section-title{margin:0;font-size:var(--font-size-xs);font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-secondary)}.devtools-section-body{display:flex;flex-direction:column;gap:var(--space-1_5)}