@font-face {
    font-family: Manrope;
    src: url('../fonts/manrope-latin.woff2') format('woff2');
    font-style: normal;
    font-weight: 400 800;
    font-display: swap;
}

:root {
    --ss-canvas: #faf9f6;
    --ss-ink: #222c2a;
    --ss-muted: #646d66;
    --ss-green: #214c3e;
    --ss-copper: #bf5437;
    --ss-border: #e3e4dd;
    --ss-surface: #fffefa;
    --dropdown-open-dur: 250ms;
    --dropdown-close-dur: 150ms;
    --dropdown-pre-scale: 0.97;
    --dropdown-closing-scale: 0.99;
    --dropdown-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

.ss-public {
    margin: 0;
    background: var(--ss-canvas);
    color: var(--ss-ink);
    font-family: Manrope, 'PingFang TC', 'Microsoft JhengHei', sans-serif;
    font-size: 16px;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    --market-cream: var(--ss-canvas);
    --market-paper: var(--ss-surface);
    --market-ink: var(--ss-ink);
    --market-ink-soft: #34493f;
    --market-muted: var(--ss-muted);
    --market-line: var(--ss-border);
    --market-terracotta: var(--ss-copper);
    --market-terracotta-dark: #9d4029;
    --market-green: var(--ss-green);
    --market-green-light: #dce5d7;
    --market-night: #18392f;
}
.ss-public *, .ss-public *::before, .ss-public *::after { box-sizing: border-box; }
.ss-public button, .ss-public input, .ss-public select, .ss-public textarea { font: inherit; }
.ss-public button, .ss-public select { cursor: pointer; }
.ss-public button { color: inherit; }
.ss-public img { max-width: 100%; }
.ss-public :where(a) { color: inherit; text-underline-offset: .22em; }
.ss-public :is(a, button, input, select, textarea):focus-visible { outline: 2px solid var(--ss-copper); outline-offset: 5px; }
.ss-public [hidden] { display: none !important; }
.ss-container, .ss-public .market-wrap { width: min(1160px, calc(100% - 64px)); margin-inline: auto; }
.ss-visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.ss-skip { position: fixed; left: 16px; top: -100px; padding: 12px 20px; background: var(--ss-green); color: var(--ss-surface) !important; z-index: 100; }
.ss-skip:focus { top: 12px; }
.ss-eyebrow { margin: 0 0 18px; color: var(--ss-green); font-size: 11px; font-weight: 750; line-height: 1.5; letter-spacing: .12em; text-transform: uppercase; }
.ss-section-heading { margin: 0; font-size: clamp(32px, 3.5vw, 48px); line-height: 1.15; font-weight: 600; letter-spacing: -.045em; text-wrap: balance; }
.ss-public .ss-button, .ss-public .market-button {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 22px;
    min-height: 48px;
    padding: 12px 23px;
    border: 1px solid var(--ss-green);
    border-radius: 6px;
    background: var(--ss-green);
    color: var(--ss-surface);
    font-size: 13px;
    font-weight: 650;
    line-height: 1.5;
    text-decoration: none;
}
.ss-public .ss-button:hover, .ss-public .market-button:hover { background: #173c2f; border-color: #173c2f; color: var(--ss-surface); }
.ss-public .ss-button--accent, .ss-public .market-button--accent { background: var(--ss-copper); border-color: var(--ss-copper); color: var(--ss-surface); }
.ss-public .ss-button--accent:hover, .ss-public .market-button--accent:hover { background: #a6422a; border-color: #a6422a; color: var(--ss-surface); }
.ss-public .ss-button--light { background: transparent; color: var(--ss-ink); border-color: #d4d8cf; }
.ss-public .ss-button--light:hover { background: #eeeee7; border-color: #c5cbc0; color: var(--ss-ink); }
.ss-button span[aria-hidden] { font-size: 18px; line-height: 1; }
.ss-announcement { padding: 9px 24px; background: #edf1e9; border-bottom: 1px solid #e1e7dc; text-align: center; font-size: 11px; color: #42584a; }
.ss-announcement a { margin-left: 10px; font-weight: 700; text-decoration: none; }
.ss-announcement a span { margin-left: 7px; }
.ss-header { position: relative; z-index: 30; border-bottom: 1px solid var(--ss-border); background: var(--ss-canvas); }
.ss-header-inner { display: flex; align-items: center; gap: 40px; min-height: 88px; }
.ss-brand { display: inline-flex; align-items: center; gap: 10px; flex-shrink: 0; text-decoration: none; font-size: 20px; font-weight: 750; letter-spacing: -.8px; white-space: nowrap; }
.ss-brand-mark { width: 27px; height: 29px; overflow: visible; color: var(--ss-green); }
.ss-brand-auto { margin-left: 4px; font-weight: 450; }
.ss-navigation { display: flex; justify-content: space-between; flex: 1; gap: 22px; align-items: center; }
.ss-nav-links { display: flex; align-items: center; gap: 24px; }
.ss-nav-links > a, .ss-nav-signin { padding-block: 14px; font-size: 11px; text-decoration: none; white-space: nowrap; font-weight: 600; color: #505c54; }
.ss-nav-links > a[aria-current], .ss-nav-links > a:hover, .ss-nav-signin:hover { color: var(--ss-green); }
.ss-nav-links > a[aria-current] { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 8px; }
.ss-nav-actions { display: flex; align-items: center; gap: 20px; }
.ss-nav-cta { font-size: 11px; gap: 16px; min-height: 40px; padding: 9px 15px; }
.ss-locale-form { display: flex; align-items: center; }
.ss-locale-form select { border: 0; background: transparent; font-size: 11px; min-height: 40px; padding: 5px 3px; color: #505c54; }
.ss-locale-save { border: 1px solid var(--ss-border); background: var(--ss-surface); border-radius: 4px; padding: 6px; font-size: 10px !important; }
.ss-menu-toggle { display: none; align-items: center; gap: 10px; background: transparent; border: 1px solid var(--ss-border); border-radius: 5px; min-height: 42px; padding: 8px 12px; font-size: 12px !important; }
.ss-menu-toggle svg { width: 20px; height: 20px; }
.ss-flashes { padding-top: 24px; }
.ss-public .alert { padding: 15px 20px; border: 1px solid #d4dfce; border-radius: 5px; background: #edf2e9; color: #2c4a33; margin-bottom: 12px; font-size: 14px; }
.ss-public .alert-error { background: #fff0e8; border-color: #e5c3b6; color: #963d25; }
.ss-footer { border-top: 1px solid var(--ss-border); background: #f2f2eb; }
.ss-footer-top { display: grid; grid-template-columns: 1.8fr 1fr 1.25fr 1fr; gap: 48px; padding: 75px 0 64px; }
.ss-footer-intro > p { max-width: 250px; color: #5b695e; font-size: 13px; line-height: 1.8; margin: 22px 0 18px; }
.ss-footer-location { color: #626e62; display: block; max-width: 230px; font-size: 10px; line-height: 1.8; }
.ss-footer-column h2 { font-size: 12px; margin: 3px 0 22px; font-weight: 700; }
.ss-footer-column > a { display: block; width: fit-content; margin-block: 13px; font-size: 11px; color: #5d685f; text-decoration: none; }
.ss-footer-column > a:hover { color: var(--ss-green); text-decoration: underline; }
.ss-footer-bottom { display: flex; justify-content: space-between; gap: 24px; border-top: 1px solid #dfe2d7; padding: 23px 0; font-size: 10px; color: #626e62; }
.ss-footer-bottom p { margin: 0; }
.ss-footer-bottom a { text-decoration: none; }
.ss-footer-bottom a span { margin-left: 15px; }

/* The account forms continue to use their existing field and POST contracts. */
.ss-public .signin-shell, .ss-public .auth-page { display: grid; grid-template-columns: 1fr 1fr; width: min(1160px, calc(100% - 64px)); margin: 68px auto 88px; min-height: 620px; background: #fffefa; border: 1px solid var(--ss-border); border-radius: 14px; overflow: hidden; }
.ss-public .signin-story, .ss-public .auth-intro { padding: 58px; background: #eef0e8; display: flex; flex-direction: column; justify-content: center; }
.ss-public .signin-back { display: inline-block; font-size: 12px; margin-bottom: 45px; text-decoration: none; color: #5c6a5f; }
.ss-public .market-kicker, .ss-public .landing-kicker { font-size: 11px; font-weight: 750; letter-spacing: .1em; color: var(--ss-green); margin: 0 0 24px; }
.ss-public .signin-story h1, .ss-public .auth-intro h1 { font-size: clamp(32px, 3.4vw, 46px); letter-spacing: -.05em; line-height: 1.17; font-weight: 600; margin: 0 0 24px; }
.ss-public .signin-story__content > p:not(.market-kicker), .ss-public .auth-intro > p:not(.landing-kicker) { color: #5c695e; font-size: 13px; line-height: 1.9; margin-bottom: 32px; }
.ss-public .signin-panel, .ss-public .auth-card { padding: 58px; display: flex; flex-direction: column; justify-content: center; }
.ss-public .signin-panel__heading > p, .ss-public .auth-card__eyebrow { font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--ss-muted); margin: 0 0 14px; font-weight: 650; }
.ss-public .signin-panel h2, .ss-public .auth-card h2 { margin: 0 0 14px; font-size: 29px; line-height: 1.3; font-weight: 650; letter-spacing: -.035em; }
.ss-public .signin-panel__heading > span { display: block; color: var(--ss-muted); font-size: 13px; margin-bottom: 32px; }
.ss-public .form-group { margin-bottom: 22px; }
.ss-public .form-group label, .ss-public .form-col label { display: block; margin-bottom: 9px; font-size: 12px; font-weight: 650; }
.ss-public .form-group input, .ss-public .form-col input { width: 100%; padding: 13px 14px; border: 1px solid #d4d9ce; background: #fffefa; color: var(--ss-ink); border-radius: 5px; font-size: 13px; min-height: 47px; }
.ss-public .form-group input:focus, .ss-public .form-col input:focus { border-color: var(--ss-green); }
.ss-public .form-group input::placeholder { color: #6b7669; }
.ss-public .signin-label-row { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; }
.ss-public .signin-label-row a { font-size: 10px; color: var(--ss-green); }
.ss-public .signin-remember { display: flex; align-items: center; gap: 9px; color: var(--ss-muted); font-size: 11px; margin-bottom: 25px; }
.ss-public .signin-remember input { accent-color: var(--ss-green); width: 15px; height: 15px; }
.ss-public .signin-submit, .ss-public .auth-card .btn-block { width: 100%; }
.ss-public .signin-register, .ss-public .auth-footer { text-align: center; font-size: 11px; color: #6a7569; margin-top: 27px; }
.ss-public .signin-register a, .ss-public .auth-footer a { color: var(--ss-green); font-weight: 650; }
.ss-public .signin-geo-note { font-size: 10px; line-height: 1.8; color: #697463; text-align: center; margin-top: 32px; }
.ss-public .signin-assurances, .ss-public .auth-proof-list { padding: 24px 0 0; border-top: 1px solid #d9dfd0; list-style: none; margin: 28px 0 0; }
.ss-public .signin-assurances li, .ss-public .auth-proof-list li { display: flex; align-items: baseline; gap: 11px; font-size: 11px; color: #4c6351; line-height: 1.8; margin-block: 10px; }
.ss-public .auth-proof-list li::before { content: '✓'; }
.ss-public .form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 17px; margin-bottom: 22px; }
.ss-public .form-col { min-width: 0; }
.ss-public .form-col small { display: block; color: #6f796c; font-size: 9px; line-height: 1.7; margin-top: 9px; }
.ss-public .auth-card > form { margin-top: 27px; }
.ss-public .auth-card .btn { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; background: var(--ss-green); color: #fffefa; border: 1px solid var(--ss-green); border-radius: 5px; padding: 12px 20px; font-size: 13px; font-weight: 650; text-decoration: none; }
.ss-public .auth-card .btn:hover { background: #173c2f; }
.ss-public .team-invite-card { width: min(540px, calc(100% - 40px)); margin: 80px auto; background: #fffefa; border: 1px solid var(--ss-border); border-radius: 12px; gap: 10px; }
.ss-public .team-invite-card > p:not(.auth-card__eyebrow) { font-size: 13px; color: var(--ss-muted); }
.ss-public .register-onboarding-note { margin-top: 26px; font-size: 11px; line-height: 1.9; color: #5e6e5e; border-top: 1px solid #d6ddce; padding-top: 20px; }
.ss-public .register-onboarding-note a { color: var(--ss-green); font-weight: 700; }
.ss-public .signin-story__scene { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; padding-top: 26px; margin-top: 10px; }
.ss-public .signin-hub { grid-column: 1 / -1; padding: 21px; border: 1px solid #d4ddcc; border-radius: 8px; background: #fafbf5; text-align: center; }
.ss-public .signin-hub > span { display: block; font-size: 18px; font-weight: 750; color: var(--ss-green); }
.ss-public .signin-hub > small { display: block; font-size: 9px; letter-spacing: .14em; color: #65785e; margin-top: 5px; }
.ss-public .signin-node { position: relative; background: #fafbf5; border: 1px solid #d4ddcc; border-radius: 6px; text-align: center; padding: 13px 4px; }
.ss-public .signin-node > span { display: block; color: var(--ss-copper); font-size: 19px; margin-bottom: 7px; }
.ss-public .signin-node > b { display: block; font-size: 9px; font-weight: 650; }
.ss-public .signin-node > small { display: block; font-size: 8px; color: #65735a; margin-top: 3px; }
.ss-public .signin-orbit { display: none; }

/* Existing editorial content is presented inside the new public site shell. */
.ss-public .blog-page { background: var(--ss-canvas); color: var(--ss-ink); }
.ss-public .blog-page .blog-footer { display: none; }
.ss-public .notes-masthead, .ss-public .blog-masthead { padding-top: 66px; }
.ss-public .notes-scene img { border-radius: 10px; }
.ss-public .notes-card-image img { border-radius: 7px; }
.ss-public .notes-card { padding-bottom: 24px; }
.ss-public .notes-filters a { border-color: #d7ddd1; border-radius: 5px; }
.ss-public .notes-bottom, .ss-public .blog-cta { border-radius: 12px; background: #e9eee2; }
.ss-public .blog-eyebrow { color: #9d4029; font-size: 10px; }
.ss-public .notes-intro h1 em { color: var(--ss-copper); }
.ss-public .notes-series { border-color: var(--ss-border); }
.ss-public .notes-grid { row-gap: 48px; }
.ss-public .notes-card h3 { font-weight: 650; }

/* transitions.dev menu dropdown: origin, open and close states are shared. */
.t-dropdown {
  transform-origin: top left;
  transform: scale(var(--dropdown-pre-scale));
  opacity: 0;
  pointer-events: none;
  transition:
    transform var(--dropdown-open-dur) var(--dropdown-ease),
    opacity   var(--dropdown-open-dur) var(--dropdown-ease);
  will-change: transform, opacity;
}
.t-dropdown[data-origin="top-right"]     { transform-origin: top right; }
.t-dropdown[data-origin="top-center"]    { transform-origin: top center; }
.t-dropdown[data-origin="bottom-left"]   { transform-origin: bottom left; }
.t-dropdown[data-origin="bottom-center"] { transform-origin: bottom center; }
.t-dropdown[data-origin="bottom-right"]  { transform-origin: bottom right; }
.t-dropdown.is-open {
  transform: scale(1);
  opacity: 1;
  pointer-events: auto;
}
.t-dropdown.is-closing {
  transform: scale(var(--dropdown-closing-scale));
  opacity: 0;
  pointer-events: none;
  transition:
    transform var(--dropdown-close-dur) var(--dropdown-ease),
    opacity   var(--dropdown-close-dur) var(--dropdown-ease);
}
@media (prefers-reduced-motion: reduce) {
  .t-dropdown { transition: none !important; }
}
@media (min-width: 1041px) {
    .ss-navigation { transform: none; opacity: 1; pointer-events: auto; will-change: auto; transition: none; }
}
@media (max-width: 1200px) {
    .ss-header-inner { gap: 27px; }
    .ss-nav-links { gap: 18px; }
    .ss-nav-actions { gap: 14px; }
    .ss-brand { font-size: 18px; }
    .ss-footer-top { gap: 32px; }
}
@media (max-width: 1040px) {
    .ss-header-inner { min-height: 74px; flex-wrap: wrap; justify-content: space-between; }
    .ss-nav-ready .ss-menu-toggle { display: inline-flex; }
    .ss-navigation { flex-basis: 100%; display: block; padding-block: 10px 24px; }
    .ss-nav-ready .ss-navigation { position: absolute; top: calc(100% - 1px); left: 24px; right: 24px; border: 1px solid var(--ss-border); border-radius: 8px; padding: 20px; background: #faf9f6; box-shadow: 0 16px 28px #18392f12; }
    .ss-nav-links { gap: 0; display: grid; grid-template-columns: repeat(2, 1fr); }
    .ss-nav-links > a { padding: 13px 8px; font-size: 13px; }
    .ss-nav-actions { padding: 20px 8px 0; margin-top: 14px; border-top: 1px solid var(--ss-border); justify-content: space-between; }
    .ss-nav-signin { font-size: 12px; }
    .ss-nav-cta { font-size: 12px; min-height: 44px; }
    .ss-locale-form select { font-size: 12px; }
    .ss-footer-top { grid-template-columns: 1.5fr 1fr 1.25fr; }
    .ss-footer-intro { grid-column: 1 / -1; }
    .ss-footer-intro > p { max-width: 400px; }
    .ss-footer-location { max-width: 400px; }
    .ss-public .signin-story, .ss-public .auth-intro, .ss-public .signin-panel, .ss-public .auth-card { padding: 40px 32px; }
}
@media (max-width: 700px) {
    .ss-container, .ss-public .market-wrap { width: calc(100% - 40px); }
    .ss-announcement { font-size: 9px; padding: 9px 15px; }
    .ss-announcement a { margin-left: 6px; }
    .ss-announcement a span { margin-left: 2px; }
    .ss-header-inner { min-height: 72px; }
    .ss-brand { font-size: 18px; }
    .ss-brand-mark { width: 25px; height: 26px; }
    .ss-nav-ready .ss-navigation { left: 16px; right: 16px; }
    .ss-nav-actions { gap: 10px; }
    .ss-nav-cta { gap: 10px; padding-inline: 13px; }
    .ss-footer-top { grid-template-columns: 1fr 1fr; column-gap: 20px; row-gap: 28px; padding: 48px 0 36px; }
    .ss-footer-intro { grid-column: 1 / -1; }
    .ss-footer-column h2 { margin-bottom: 18px; }
    .ss-footer-bottom { flex-wrap: wrap; gap: 10px; font-size: 9px; }
    .ss-footer-bottom p:nth-child(2) { order: 3; width: 100%; }
    .ss-footer-bottom a { margin-left: auto; }
    .ss-public .signin-shell, .ss-public .auth-page { grid-template-columns: 1fr; margin: 32px auto 48px; width: calc(100% - 32px); min-height: 0; }
    .ss-public .signin-story, .ss-public .auth-intro { padding: 32px 26px; }
    .ss-public .signin-panel, .ss-public .auth-card { padding: 36px 26px; }
    .ss-public .signin-back { margin-bottom: 30px; }
    .ss-public .signin-story h1, .ss-public .auth-intro h1 { font-size: 32px; }
    .ss-public .signin-story__scene, .ss-public .signin-assurances { display: none; }
    .ss-public .signin-story__content > p:not(.market-kicker) { margin-bottom: 0; }
    .ss-public .market-kicker, .ss-public .landing-kicker { font-size: 10px; }
    .ss-public .auth-proof-list { margin-top: 10px; padding-top: 16px; }
    .ss-public .register-onboarding-note { margin-top: 20px; }
    .ss-public .notes-masthead, .ss-public .blog-masthead { padding-top: 36px; }
}
@media (max-width: 390px) {
    .ss-announcement { font-size: 8px; }
    .ss-public .form-row { grid-template-columns: 1fr; gap: 20px; }
    .ss-nav-actions { flex-wrap: wrap; }
}
