@import url('tokens/colors.css');
@import url('tokens/typography.css');
@import url('tokens/spacing.css');
@import url('tokens/glass.css');
@import url('tokens/motion.css');

@font-face{font-family:'Space Grotesk';font-style:normal;font-weight:300 700;font-display:swap;src:url('fonts/SpaceGrotesk-latin.woff2') format('woff2')}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/JetBrainsMono-400-normal-latin.woff2') format('woff2')}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:104px}
body{margin:0;background:var(--surface-page);color:var(--text-primary);font-family:var(--font-sans);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit}
button,a{-webkit-tap-highlight-color:transparent}
button{cursor:pointer}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%;object-fit:cover}
button{color:inherit}
button:disabled{cursor:default}
button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--focus-ring);outline-offset:5px}
::selection{background:var(--nc-tide-100);color:var(--text-primary)}
button,.button,a,summary{touch-action:manipulation}
[hidden]{display:none!important}
.wrap{width:min(100% - 112px,1320px);margin-inline:auto}
.skip-link{position:fixed;left:20px;top:12px;transform:translateY(-180%);background:var(--surface-page);padding:12px 20px;z-index:100;border:1px solid var(--border-strong);border-radius:var(--radius-control)}
.skip-link:focus{transform:none}
.preview-note{min-height:32px;padding:7px 20px;display:flex;align-items:center;justify-content:center;gap:9px;background:var(--surface-sunken);font-size:11px;color:var(--text-secondary);letter-spacing:.01em}
.signal{display:inline-block;width:6px;height:6px;background:var(--nc-tide-600);border-radius:50%;flex-shrink:0}
.preview-divider{margin:0 3px;color:var(--border-default)}
.site-header{position:sticky;top:0;background:rgba(255,255,255,.93);backdrop-filter:blur(16px);z-index:30;border-bottom:1px solid var(--border-subtle)}
.nav-shell{height:87px;display:flex;align-items:center;justify-content:space-between;gap:30px}
.brand{display:inline-flex;align-items:center;flex-shrink:0}
.brand img{object-fit:contain}
.main-nav{display:flex;gap:30px;align-items:center;margin-left:auto;margin-right:26px}
.main-nav a{position:relative;font-size:14px;font-weight:500;padding-block:12px;transition:color var(--dur-base)}
.main-nav a:hover{color:var(--text-accent)}
.main-nav a::after{content:'';position:absolute;bottom:6px;left:0;right:0;height:1px;background:var(--nc-tide-600);transform:scaleX(0);transform-origin:left;transition:transform var(--dur-panel) var(--ease-standard)}
.main-nav a:hover::after{transform:scaleX(1)}
.button{display:inline-flex;align-items:center;justify-content:center;gap:32px;padding:15px 22px;border:1px solid var(--action-primary-bg);background:var(--action-primary-bg);color:var(--action-primary-fg);border-radius:var(--radius-control);font-size:14px;line-height:22px;font-weight:500;min-height:52px;transition:background var(--dur-base),transform var(--dur-base),box-shadow var(--dur-base)}
.button:hover{background:var(--action-primary-bg-hover);transform:translateY(-2px);box-shadow:0 5px 15px -9px var(--nc-ink)}
.button:active{transform:translateY(0)}
.button>span{font-size:22px;font-weight:400;line-height:18px}
.button-small{min-height:44px;padding:10px 16px;font-size:13px;gap:24px}
.button-outline{background:var(--surface-page);color:var(--text-primary);border-color:var(--border-default)}
.button-outline:hover{background:var(--surface-hover)}
.menu-toggle{display:none}

dialog{border:1px solid var(--border-subtle);border-radius:20px;padding:45px;width:min(590px,calc(100% - 32px));max-height:calc(100dvh - 40px);color:var(--text-primary);background:var(--surface-page);box-shadow:0 20px 100px -20px rgba(11,27,43,.25);overscroll-behavior:contain}
dialog::backdrop{background:rgba(11,27,43,.4);backdrop-filter:blur(5px)}
dialog[open]{animation:dialog-in var(--dur-panel) var(--ease-enter)}
.dialog-close{position:absolute;right:13px;top:12px;width:44px;height:44px;border:0;border-radius:6px;background:var(--surface-sunken);font-size:25px;line-height:1}
dialog .eyebrow{font-size:10px;margin-bottom:15px;padding-right:25px}
dialog h2{font-size:34px;line-height:1.1;letter-spacing:-.04em;padding-right:15px}
#dialog-description,.result-intro,#privacy-dialog p:not(.eyebrow){font-size:13px;color:var(--text-secondary);line-height:1.65;margin-top:18px}
.journey-controls{margin-top:23px}
.journey-controls>button{flex:1;font-size:13px}
.form-field{display:flex;flex-direction:column;gap:7px;margin-top:20px;min-width:0}
.form-field label{font-size:13px;font-weight:500;line-height:1.3}
.form-field input,.form-field select,.form-field textarea{border:1px solid var(--border-default);background:var(--surface-page);color:var(--text-primary);border-radius:6px;padding:10px 12px;width:100%;min-height:44px;font-size:16px}
.form-field textarea{resize:vertical;min-height:100px}
.field-hint{font-size:10px;color:var(--text-secondary)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:15px}
.draft-disclosure{font-size:10px;line-height:1.7;color:var(--text-secondary);margin:20px 0}
.button-full{width:100%;justify-content:space-between}
#draft-result{margin:25px 0 0;padding:0}
#draft-result>div{padding:14px 0;border-bottom:1px solid var(--border-subtle)}
#draft-result dt{font:400 10px/1.5 var(--font-mono);text-transform:uppercase;letter-spacing:.08em;color:var(--text-secondary)}
#draft-result dd{margin:6px 0 0;font-size:14px;overflow-wrap:anywhere;white-space:pre-wrap}
.draft-followup{font-size:12px;color:var(--text-secondary);margin-top:22px;line-height:1.7;background:var(--surface-sunken);padding:15px;border-radius:10px}
.result-actions{display:flex;gap:10px;margin-top:25px;flex-wrap:wrap}
.download-status{font-size:11px;color:var(--text-secondary);margin-top:12px;min-height:16px}
body.modal-open{overflow:hidden}