:root {
  color-scheme: dark;
  --bg: #07111b;
  --bg-deep: #050c13;
  --panel: #0d1b29;
  --panel-soft: #122333;
  --line: rgba(185, 216, 224, .13);
  --line-strong: rgba(185, 216, 224, .23);
  --text: #f5f8f7;
  --muted: #9aadb6;
  --cyan: #7ee2d4;
  --lime: #c8f2a0;
  --orange: #eab477;
  --sans: "PingFang SC", "Microsoft YaHei UI", "Microsoft YaHei", "Noto Sans SC", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; overflow-x: clip; }
body { margin: 0; background: var(--bg); color: var(--text); font-family: var(--sans); -webkit-font-smoothing: antialiased; }
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
.hidden { display: none !important; }

.brand { display: inline-flex; align-items: center; gap: 13px; flex-shrink: 0; line-height: 1.15; }
.brand strong { display: block; font-size: 19px; letter-spacing: -.035em; font-weight: 760; }
.brand small { display: block; margin-top: 5px; color: #8faab3; font-size: 10px; letter-spacing: .18em; }
.brand-symbol { width: 37px; height: 37px; border: 1px solid rgba(126,226,212,.48); border-radius: 11px; display: flex; align-items: flex-end; justify-content: center; gap: 4px; padding: 7px; background: linear-gradient(145deg, rgba(126,226,212,.2), rgba(126,226,212,.02)); box-shadow: inset 0 0 22px rgba(126,226,212,.08); }
.brand-symbol span { width: 4px; border-radius: 4px; background: var(--cyan); transform: skewX(-16deg); }
.brand-symbol span:nth-child(1) { height: 12px; opacity: .6; }
.brand-symbol span:nth-child(2) { height: 20px; }
.brand-symbol span:nth-child(3) { height: 15px; opacity: .8; }

.button { min-height: 48px; display: inline-flex; align-items: center; justify-content: center; gap: 24px; padding: 0 21px; border-radius: 8px; border: 1px solid transparent; font-size: 14px; font-weight: 700; transition: transform .2s, background .2s, border-color .2s, box-shadow .2s; }
.button:hover { transform: translateY(-2px); }
.button span { font-size: 18px; line-height: 1; font-weight: 400; }
.button-primary { background: var(--cyan); color: #06231f; box-shadow: 0 8px 34px rgba(73,200,177,.16); }
.button-primary:hover { background: #a6f5e9; box-shadow: 0 12px 40px rgba(73,200,177,.26); }
.button-outline { border-color: rgba(126,226,212,.38); background: rgba(9,24,33,.5); color: #dffaf3; }
.button-outline:hover { border-color: var(--cyan); }
.button-quiet { color: #dce8e8; padding-left: 12px; }
.button-quiet:hover { color: var(--cyan); }
.section-index { display: inline-block; color: var(--cyan); font-size: 11px; font-weight: 750; letter-spacing: .22em; text-transform: uppercase; }

.landing { overflow-x: clip; }
.ambient { position: absolute; border-radius: 50%; filter: blur(80px); pointer-events: none; }
.ambient-one { top: 350px; right: 0; width: 600px; height: 600px; background: rgba(49,101,107,.11); }
.ambient-two { top: 1250px; left: -280px; width: 550px; height: 550px; background: rgba(83,134,113,.07); }
.site-header { height: 86px; padding: 0 max(5vw, 24px); display: flex; align-items: center; justify-content: space-between; position: absolute; z-index: 5; inset: 0 0 auto; border-bottom: 1px solid rgba(255,255,255,.09); background: rgba(5,12,19,.26); backdrop-filter: blur(16px); }
.site-header nav { display: flex; align-items: center; gap: clamp(22px,3.3vw,55px); color: #cedbd9; font-size: 13px; }
.site-header nav a:hover { color: var(--cyan); }
.header-cta { min-height: 40px; font-size: 12px; }

.hero { min-height: 780px; height: min(910px, 100svh); position: relative; display: grid; grid-template-columns: 52% 48%; align-items: center; padding: 100px max(5vw,24px) 40px; isolation: isolate; background: #0c151a; }
.hero-photo { position: absolute; inset: 0; z-index: -3; background: linear-gradient(90deg, rgba(5,12,19,.94) 0%, rgba(5,12,19,.78) 42%, rgba(5,12,19,.4) 77%, rgba(5,12,19,.28)), linear-gradient(0deg, #07111b 1%, transparent 28%), url("./assets/hero-restaurant-ai-bg.png") center 54% / cover no-repeat; }
.hero-grid { position: absolute; inset: 0; z-index: -2; opacity: .28; background-image: linear-gradient(rgba(129,226,213,.08) 1px, transparent 1px), linear-gradient(90deg, rgba(129,226,213,.08) 1px, transparent 1px); background-size: 74px 74px; mask-image: linear-gradient(90deg, #000, transparent 72%); }
.hero::before { content: ""; position: absolute; top: 6%; left: -20%; width: 66%; height: 70%; z-index: -1; background: radial-gradient(ellipse, rgba(74,175,168,.13), transparent 65%); filter: blur(30px); }
.hero-content { position: relative; z-index: 1; max-width: 690px; padding-bottom: 30px; }
.eyebrow { display: inline-flex; align-items: center; gap: 10px; color: #b4e5db; border: 1px solid rgba(126,226,212,.25); background: rgba(18,55,56,.23); padding: 9px 14px; border-radius: 99px; font-size: 11px; font-weight: 650; letter-spacing: .13em; }
.pulse-dot, .live-dot { width: 7px; height: 7px; border-radius: 50%; display: inline-block; background: var(--cyan); box-shadow: 0 0 0 5px rgba(126,226,212,.12); }
.hero h1 { font-size: clamp(52px, 5.55vw, 90px); line-height: 1.12; letter-spacing: -.07em; margin: 28px 0 26px; font-weight: 780; }
.hero h1 em { font-style: normal; color: var(--cyan); }
.hero-content > p { max-width: 540px; margin: 0; color: #d1dbd7; font-size: clamp(15px,1.35vw,19px); line-height: 1.95; }
.hero-actions { display: flex; gap: 18px; align-items: center; margin-top: 36px; }
.hero-note { display: flex; align-items: center; gap: 14px; margin-top: 53px; color: #abc3c3; font-size: 12px; letter-spacing: .04em; }
.hero-note-line { width: 24px; height: 1px; background: var(--cyan); }
.hero-showcase { width: min(100%,620px); position: relative; justify-self: end; margin-top: 50px; filter: drop-shadow(0 40px 90px rgba(0,0,0,.3)); }
.showcase-window { border: 1px solid rgba(187,232,228,.26); border-radius: 19px; overflow: hidden; background: linear-gradient(138deg, rgba(13,34,43,.94), rgba(8,20,29,.82)); backdrop-filter: blur(26px); box-shadow: inset 0 1px 0 rgba(255,255,255,.11), 0 30px 85px rgba(0,0,0,.28); transform: perspective(1100px) rotateY(-8deg) rotateX(3deg); }
.window-top { min-height: 45px; padding: 0 18px; border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; color: #bdcdd0; font-size: 11px; letter-spacing: .05em; }
.window-dots { display: flex; gap: 5px; }.window-dots i { height: 5px; width: 5px; border-radius: 50%; background: #7ba4a4; opacity: .7; }
.window-status { color: var(--cyan); }
.showcase-inner { display: grid; grid-template-columns: 1fr .8fr; gap: 14px; padding: 22px; }
.showcase-summary, .showcase-metric, .showcase-chat { border: 1px solid var(--line); border-radius: 12px; background: rgba(13,30,40,.74); padding: 22px; }
.showcase-summary > span, .showcase-metric > span:first-child { display: block; color: #a7bdc1; font-size: 11px; }
.showcase-summary strong { display: block; font-size: clamp(35px,3.1vw,50px); letter-spacing: -.07em; margin: 17px 0 8px; font-weight: 620; }
.showcase-summary strong span { font-size: .48em; }
.showcase-summary small { color: #88a3a5; font-size: 10px; }
.showcase-metric strong { display: block; margin-top: 21px; font-size: clamp(22px,2vw,29px); font-weight: 600; letter-spacing: -.04em; }
.micro-chart { display: flex; height: 48px; gap: 7px; align-items: end; margin-top: 16px; }.micro-chart i { flex: 1; background: linear-gradient(0deg,rgba(107,213,193,.15),var(--cyan)); border-radius: 3px 3px 0 0; opacity: .7; }.micro-chart i:nth-child(1){height:35%}.micro-chart i:nth-child(2){height:55%}.micro-chart i:nth-child(3){height:41%}.micro-chart i:nth-child(4){height:64%}.micro-chart i:nth-child(5){height:50%}.micro-chart i:nth-child(6){height:73%}.micro-chart i:nth-child(7){height:63%}.micro-chart i:nth-child(8){height:79%}.micro-chart i:nth-child(9){height:94%}
.showcase-chat { grid-column: 1 / -1; min-height: 180px; }
.chat-label { display: block; color: #a7bdc1; font-size: 11px; margin-bottom: 18px; }
.chat-user { margin-left: auto; width: max-content; max-width: 85%; padding: 10px 15px; border-radius: 11px 11px 2px 11px; background: rgba(111,210,190,.21); color: #ebfff7; font-size: 12px; }
.chat-agent { display: flex; align-items: flex-start; gap: 10px; width: max-content; max-width: 90%; margin-top: 12px; padding: 10px 14px; border: 1px solid rgba(139,211,205,.14); border-radius: 11px 11px 11px 2px; background: #172e37; font-size: 12px; line-height: 1.65; }
.chat-agent small { color: #9cbfc1; font-size: 10px; }
.chat-agent-icon { color: var(--cyan); }
.floating-chip { position: absolute; bottom: 3%; left: -7%; display: flex; gap: 10px; align-items: center; padding: 13px 17px; border: 1px solid rgba(151,225,209,.34); border-radius: 11px; background: rgba(9,29,31,.9); backdrop-filter: blur(14px); font-size: 12px; box-shadow: 0 16px 36px rgba(0,0,0,.24); }
.floating-chip > span { color: var(--cyan); font-size: 22px; }.floating-chip small { display: block; color: #93acaa; margin-top: 3px; }
.showcase-caption { display: block; text-align: right; color: #acc0be; font-size: 10px; margin: 12px 10px 0; }
.hero-scroll { position: absolute; bottom: 35px; left: max(5vw,24px); display: flex; gap: 18px; color: #95acae; font-size: 10px; letter-spacing: .2em; }
.hero-scroll span { color: var(--cyan); }

.section { position: relative; padding: clamp(95px,10vw,150px) max(5vw,24px); }
.section-heading { max-width: 720px; margin-bottom: 46px; }
.section-heading h2, .trust-copy h2, .cta-section h2 { margin: 16px 0 14px; font-size: clamp(37px,4vw,62px); letter-spacing: -.065em; line-height: 1.22; }
.section-heading p, .trust-copy > p { max-width: 620px; color: var(--muted); line-height: 1.9; font-size: 15px; }
.section-intro { background: #07111b; }
.feature-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 17px; }
.feature-card { min-height: 350px; display: flex; flex-direction: column; position: relative; overflow: hidden; padding: 30px; border: 1px solid var(--line); border-radius: 14px; background: linear-gradient(147deg,#112334,#0b1925); }
.feature-card::after { content: ""; position: absolute; top: -50%; right: -45%; height: 90%; width: 90%; border-radius: 50%; background: radial-gradient(ellipse,rgba(110,218,199,.07),transparent 70%); }
.feature-primary { border-color: rgba(126,226,212,.28); background: linear-gradient(150deg,#17403d,#0d232d 61%,#0b1925); }
.feature-icon { height: 49px; width: 49px; display: grid; place-items: center; border: 1px solid rgba(126,226,212,.3); border-radius: 10px; background: rgba(126,226,212,.08); color: var(--cyan); font-size: 25px; }
.feature-no { position: absolute; top: 34px; right: 30px; color: #718d93; font-size: 11px; letter-spacing: .14em; }
.feature-card h3 { margin: 51px 0 11px; font-size: 23px; letter-spacing: -.03em; }
.feature-card p { margin: 0; max-width: 350px; color: #abc0c4; line-height: 1.85; font-size: 13px; }
.feature-example, .feature-bottom { margin-top: auto; padding-top: 22px; border-top: 1px solid var(--line); color: #e9fbf4; font-size: 12px; }
.feature-example span { display: block; color: var(--cyan); margin-top: 6px; }
.feature-bottom { display: flex; justify-content: space-between; color: #a9c4c0; }
.feature-bottom span { color: var(--cyan); }
.workflow-section { background: #0b1925; }
.workflow-line { display: grid; grid-template-columns: repeat(4,1fr); border-top: 1px solid var(--line-strong); }
.workflow-step { position: relative; display: flex; flex-direction: column; padding: 26px 24px 0 0; min-height: 190px; }
.workflow-step::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--cyan); position: absolute; top: -4px; left: 0; box-shadow: 0 0 0 8px rgba(126,226,212,.08); }
.step-number { color: var(--cyan); font-size: 11px; letter-spacing: .13em; }
.workflow-step h3 { margin: 37px 0 8px; font-size: 18px; }.workflow-step p { max-width: 230px; margin: 0; color: #97afb5; font-size: 12px; line-height: 1.8; }
.trust-section { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 9vw; background: #07111b; }
.trust-visual { width: min(100%,500px); aspect-ratio: 1; position: relative; display: grid; place-items: center; margin: 0 auto; }
.trust-ring { position: absolute; border: 1px solid rgba(126,226,212,.24); border-radius: 50%; }.ring-one { width: 66%; aspect-ratio: 1; box-shadow: inset 0 0 50px rgba(126,226,212,.05), 0 0 30px rgba(126,226,212,.04); }.ring-two { width: 100%; aspect-ratio: 1; border-style: dashed; opacity: .4; }
.trust-ring::before { content: ""; position: absolute; width: 6px; height: 6px; background: var(--cyan); border-radius: 50%; top: 13%; right: 15%; }
.trust-center { display: grid; place-items: center; width: 31%; aspect-ratio: 1; border: 1px solid rgba(126,226,212,.5); border-radius: 22px; background: radial-gradient(circle at 50% 0,rgba(126,226,212,.2),#11272b 70%); color: var(--cyan); font-size: 44px; box-shadow: 0 0 70px rgba(126,226,212,.12); }
.trust-center small { font-size: 11px; margin-top: -36px; color: #dfefeb; }
.trust-tag { position: absolute; padding: 9px 14px; border: 1px solid rgba(126,226,212,.22); border-radius: 7px; background: #112430; color: #d4e9e6; font-size: 11px; box-shadow: 0 10px 27px rgba(0,0,0,.23); }
.tag-a { top: 15%; left: 3%; }.tag-b { bottom: 17%; right: 0; }.tag-c { bottom: 10%; left: 1%; color: var(--cyan); }
.trust-copy { max-width: 620px; }.trust-copy ul { list-style: none; padding: 0; margin: 32px 0 0; }.trust-copy li { display: flex; gap: 12px; align-items: center; padding: 13px 0; border-top: 1px solid var(--line); color: #dceae6; font-size: 13px; }.trust-copy li span { color: var(--cyan); }
.cta-section { margin: 30px max(5vw,24px) 0; padding: 100px 8vw; text-align: center; border: 1px solid rgba(126,226,212,.23); border-radius: 18px; background: radial-gradient(ellipse at 50% -25%,rgba(126,226,212,.23),transparent 65%),linear-gradient(150deg,#112c32,#0c1b27); }
.cta-section p { color: #a9bfbe; font-size: 14px; margin: 0 0 28px; }.cta-section h2 { font-size: clamp(43px,4.5vw,70px); }
.site-footer { padding: 70px max(5vw,24px) 35px; display: grid; grid-template-columns: 1fr auto; gap: 17px; border-top: 1px solid var(--line); margin-top: 90px; }.site-footer > p { color: #8da4a9; margin: 0; font-size: 12px; }.site-footer > div:not(.brand) { grid-column: 2; grid-row: 1 / span 2; display: flex; gap: 25px; align-items: center; font-size: 12px; color: #b5c9c8; }.site-footer > small { grid-column: 1 / -1; color: #6b8389; font-size: 10px; margin-top: 45px; }.site-footer a:hover { color: var(--cyan); }

/* Auth and product workspace */
.workspace-page { min-height: 100svh; background: #091520; }
.auth-screen { min-height: 100svh; display: flex; align-items: center; flex-direction: column; padding: 26px 20px 36px; background: radial-gradient(ellipse at 54% 5%,rgba(53,132,132,.19),transparent 43%),linear-gradient(135deg,rgba(125,220,206,.04) 1px,transparent 1px),#07111b; background-size: auto,44px 44px,auto; }
.auth-screen > .brand { align-self: flex-start; }
.auth-card { width: min(100%,490px); margin: auto 0; padding: clamp(28px,4vw,45px); border: 1px solid rgba(130,218,207,.21); border-radius: 16px; background: rgba(12,29,40,.91); box-shadow: 0 25px 100px rgba(0,0,0,.28); }
.auth-mark { width: 46px; height: 46px; display: grid; place-items: center; border: 1px solid rgba(126,226,212,.28); border-radius: 12px; background: rgba(126,226,212,.08); color: var(--cyan); font-size: 23px; margin-bottom: 28px; }
.auth-card h1 { margin: 13px 0; font-size: 41px; line-height: 1.18; letter-spacing: -.06em; }.auth-card > p:not(.form-error) { color: #a9bdc0; line-height: 1.8; font-size: 13px; margin-bottom: 25px; }
.auth-tabs { display: flex; gap: 20px; border-bottom: 1px solid var(--line); margin-bottom: 25px; }.auth-tabs button { border: 0; background: transparent; color: #9db1b7; padding: 12px 0; border-bottom: 2px solid transparent; font-size: 13px; }.auth-tabs button.active { color: var(--cyan); border-bottom-color: var(--cyan); font-weight: 700; }
.form-stack { display: grid; gap: 17px; }.form-stack label { display: grid; gap: 8px; color: #d5e3e1; font-size: 12px; font-weight: 650; }.form-stack input, .form-stack textarea, .form-stack select { width: 100%; min-height: 44px; color: #f4f9f7; background: #0a1925; border: 1px solid rgba(154,194,198,.23); border-radius: 8px; padding: 10px 13px; outline: none; font-size: 13px; transition: border-color .15s,box-shadow .15s; }.form-stack textarea { resize: vertical; line-height: 1.8; }.form-stack select { appearance: none; background-image: linear-gradient(45deg,transparent 50%,#7ee2d4 50%),linear-gradient(135deg,#7ee2d4 50%,transparent 50%); background-position: calc(100% - 19px) 19px,calc(100% - 14px) 19px; background-size: 5px 5px; background-repeat: no-repeat; }.form-stack input:focus, .form-stack textarea:focus, .form-stack select:focus { border-color: var(--cyan); box-shadow: 0 0 0 3px rgba(126,226,212,.1); }.form-stack input::placeholder, .form-stack textarea::placeholder { color: #657e87; }.form-stack .button { margin-top: 4px; width: 100%; justify-content: space-between; }.form-error { min-height: 20px; color: #ff9f91 !important; font-size: 12px !important; margin: 12px 0 0 !important; }.auth-foot { color: #6e8c90; font-size: 11px; }
.workspace { min-height: 100svh; display: grid; grid-template-columns: 225px minmax(0,1fr); }
.sidebar { display: flex; flex-direction: column; padding: 28px 17px; border-right: 1px solid var(--line); background: #0a1824; }.sidebar .brand { margin: 0 10px 60px; }.sidebar-section-label { margin: 0 14px 16px; color: #739097; font-size: 10px; letter-spacing: .18em; }.sidebar-nav { display: grid; gap: 6px; }.sidebar-nav a { display: flex; gap: 13px; align-items: center; padding: 13px 15px; border-radius: 8px; color: #a9bdc1; font-size: 12px; }.sidebar-nav a span { width: 17px; text-align: center; font-size: 18px; }.sidebar-nav a:hover, .sidebar-nav a.active { background: rgba(126,226,212,.09); color: var(--cyan); }.sidebar-bottom { margin-top: auto; border-top: 1px solid var(--line); padding: 23px 12px 0; color: #cbdcd7; font-size: 11px; line-height: 1.7; }.sidebar-bottom .live-dot { width: 5px; height: 5px; margin-right: 8px; }.sidebar-bottom small { color: #789398; margin-left: 17px; }
.workspace-main { min-width: 0; }.workspace-header { height: 72px; display: flex; justify-content: space-between; align-items: center; padding: 0 clamp(24px,4vw,65px); border-bottom: 1px solid var(--line); background: rgba(11,27,39,.8); }.workspace-breadcrumb { color: #78939b; font-size: 12px; }.workspace-breadcrumb span { margin: 0 10px; color: #53717c; }.workspace-breadcrumb strong { color: #d5e7e4; font-weight: 600; }.header-user { display: flex; align-items: center; gap: 23px; color: #cadcd9; font-size: 12px; }.text-button { border: 0; padding: 0; background: transparent; color: var(--cyan); font-size: 12px; }.text-button:hover { text-decoration: underline; }.workspace-content { max-width: 1450px; margin: 0 auto; padding: clamp(35px,5vw,70px) clamp(24px,4vw,65px) 90px; }
.dashboard-title { display: flex; align-items: end; justify-content: space-between; gap: 30px; margin-bottom: 38px; }.dashboard-title h1 { margin: 13px 0 12px; font-size: clamp(37px,4vw,60px); line-height: 1.19; letter-spacing: -.065em; }.dashboard-title p { color: #93abb1; font-size: 13px; margin: 0; }
.stat-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; margin-bottom: 20px; }.stat-card { display: flex; flex-direction: column; min-height: 180px; padding: 24px; border: 1px solid var(--line); border-radius: 11px; background: linear-gradient(135deg,#132638,#0f1f2b); }.stat-card > span { color: #9bb3b6; font-size: 12px; }.stat-card strong { margin-top: 30px; font-size: clamp(25px,2.5vw,37px); font-weight: 670; letter-spacing: -.05em; }.stat-card small { color: #78939b; margin-top: 6px; font-size: 11px; }.stat-revenue { border-color: rgba(126,226,212,.28); background: linear-gradient(135deg,#1c4546,#102932); }.stat-revenue strong { color: #d8fff0; }
.panel { min-width: 0; border: 1px solid var(--line); border-radius: 11px; background: #0d1d2b; padding: 25px; }.panel-heading { display: flex; align-items: end; justify-content: space-between; gap: 10px; margin-bottom: 25px; }.panel-heading h2 { margin: 8px 0 0; font-size: 19px; letter-spacing: -.025em; }.panel-heading a { color: var(--cyan); font-size: 12px; }.table-scroll { overflow-x: auto; }.data-table { width: 100%; border-collapse: collapse; text-align: left; font-size: 12px; }.data-table th { color: #829ca3; font-weight: 500; border-bottom: 1px solid var(--line); padding: 13px 8px; white-space: nowrap; }.data-table td { border-bottom: 1px solid rgba(168,202,209,.08); padding: 16px 8px; color: #d3e1df; }.data-table tr:last-child td { border-bottom: none; }.data-table td:last-child, .data-table th:last-child { text-align: right; }.data-table .empty-row { text-align: center; color: #78949a; padding: 44px 10px; }.tag { display: inline-flex; border-radius: 5px; padding: 5px 8px; color: #a9ede1; background: rgba(126,226,212,.11); font-size: 11px; }.tag.warn { color: #f4cb99; background: rgba(234,180,119,.11); }.tag.off { color: #9caab0; background: rgba(153,171,182,.1); }
.record-layout, .admin-layout { display: grid; grid-template-columns: 1.05fr .95fr; align-items: start; gap: 18px; }.record-panel, .draft-panel { min-height: 370px; }.notice { display: flex; align-items: flex-start; gap: 12px; margin-top: 22px; padding: 14px; border: 1px solid rgba(234,180,119,.15); border-radius: 8px; background: rgba(234,180,119,.06); color: #b8c0bd; font-size: 11px; line-height: 1.7; }.notice > span { display: grid; place-items: center; width: 19px; height: 19px; flex: 0 0 auto; border-radius: 50%; color: var(--orange); border: 1px solid currentColor; }.notice p { margin: 0; }.draft-placeholder { display: grid; place-items: center; min-height: 220px; color: #78939b; text-align: center; font-size: 12px; }.field-hint { margin: -4px 0 0; color: #8ba3a8; font-size: 11px; line-height: 1.7; }.preferences-panel { max-width: 740px; }.admin-note ul { list-style: none; padding: 0; margin: 0; }.admin-note li { padding: 12px 0; border-bottom: 1px solid var(--line); color: #d1dedb; font-size: 12px; }.admin-note li span { color: var(--cyan); margin-right: 12px; }.admin-note > p { color: #849da2; font-size: 11px; line-height: 1.7; margin-top: 22px; }.admin-layout { margin-bottom: 18px; }.invite-result { display: grid; gap: 8px; margin-top: 25px; padding: 17px; border: 1px solid rgba(126,226,212,.3); border-radius: 8px; background: rgba(126,226,212,.07); }.invite-result span,.invite-result small { color: #9cb9b6; font-size: 11px; }.invite-result strong { color: #dffef6; font-size: 16px; overflow-wrap: anywhere; }
.toast { position: fixed; z-index: 30; bottom: 25px; right: 25px; max-width: min(360px,calc(100vw - 40px)); padding: 13px 17px; border: 1px solid rgba(126,226,212,.3); border-radius: 8px; color: #dffcf7; background: #173138; box-shadow: 0 13px 35px rgba(0,0,0,.24); font-size: 12px; }

@media (max-width: 1100px) {
  .hero { grid-template-columns: 1fr 1fr; }.hero h1 { font-size: clamp(51px,5.3vw,68px); }.showcase-window { transform: none; }.floating-chip { left: -3%; }
  .feature-grid { gap: 12px; }.feature-card { padding: 24px; }.trust-section { gap: 3vw; }
}
@media (max-width: 800px) {
  .site-header { height: 70px; }.site-header nav { display: none; }.hero { min-height: 1060px; height: auto; grid-template-columns: 1fr; padding-top: 145px; padding-bottom: 75px; }.hero-photo { background-position: 67% center; }.hero-content { max-width: 600px; }.hero h1 { font-size: clamp(51px,9vw,78px); }.hero-showcase { justify-self: center; width: min(100%,560px); margin: 48px 0 0; }.hero-scroll { bottom: 27px; }.feature-grid { grid-template-columns: 1fr; }.feature-card { min-height: 270px; }.feature-card h3 { margin-top: 30px; }.workflow-line { grid-template-columns: repeat(2,1fr); row-gap: 20px; }.trust-section { grid-template-columns: 1fr; }.trust-visual { order: 2; width: min(100%,420px); }.trust-copy { order: 1; }.workspace { grid-template-columns: 1fr; }.sidebar { flex-direction: row; align-items: center; justify-content: space-between; padding: 10px 22px; border-right: 0; border-bottom: 1px solid var(--line); }.sidebar .brand { margin: 0; }.sidebar-section-label,.sidebar-bottom { display: none; }.sidebar-nav { display: flex; }.sidebar-nav a { padding: 10px; }.sidebar-nav a span { display: none; }.workspace-header { height: 56px; }.dashboard-title { align-items: start; }.stat-grid { gap: 9px; }.stat-card { padding: 17px; }.record-layout,.admin-layout { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .brand strong { font-size: 16px; }.brand small { font-size: 9px; }.brand-symbol { width: 33px; height: 33px; }.header-cta { padding: 0 12px; min-height: 36px; font-size: 11px; }.site-header { padding: 0 19px; }
  .hero { min-height: 910px; padding: 121px 22px 76px; }.hero h1 { font-size: clamp(48px,12vw,66px); }.hero-content > p { font-size: 15px; }.hero-actions { align-items: stretch; flex-direction: column; gap: 8px; }.hero-actions .button { justify-content: space-between; }.hero-note { margin-top: 25px; font-size: 10px; }.hero-showcase { margin-top: 33px; }.showcase-window { border-radius: 11px; }.showcase-inner { padding: 12px; gap: 8px; }.showcase-summary,.showcase-metric,.showcase-chat { padding: 13px; }.showcase-summary strong { font-size: 29px; }.showcase-metric strong { font-size: 17px; }.showcase-chat { min-height: 150px; }.floating-chip { display: none; }.hero-scroll { display: none; }
  .section { padding: 80px 22px; }.section-heading h2,.trust-copy h2 { font-size: 37px; }.workflow-line { grid-template-columns: 1fr; }.workflow-step { min-height: 133px; }.workflow-step h3 { margin-top: 21px; }.cta-section { margin: 15px 18px 0; padding: 70px 18px; }.cta-section h2 { font-size: 43px; }.site-footer { padding: 60px 22px 35px; grid-template-columns: 1fr; }.site-footer > div:not(.brand) { grid-column: 1; grid-row: auto; }.site-footer > small { margin-top: 20px; }
  .sidebar { align-items: flex-start; gap: 13px; flex-direction: column; padding: 15px 20px 10px; }.sidebar-nav { width: 100%; justify-content: space-between; }.sidebar-nav a { font-size: 11px; }.workspace-header { padding: 0 20px; }.workspace-content { padding: 32px 20px 70px; }.dashboard-title { flex-direction: column; gap: 18px; }.dashboard-title h1 { font-size: 42px; }.stat-grid { grid-template-columns: 1fr; }.stat-card { min-height: 135px; }.stat-card strong { margin-top: 14px; }.panel { padding: 18px; }.auth-screen { padding: 20px 14px; }.auth-card { padding: 26px 22px; }
}
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; } }
