@font-face { font-family: Roboto; src: url("assets/Roboto-Variable.ttf") format("truetype"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "Roboto Mono"; src: url("assets/RobotoMono-Variable.ttf") format("truetype"); font-weight: 100 700; font-display: swap; }
:root { --paper:#f8fafd; --surface:#fff; --ink:#202124; --muted:#5f6368; --rule:#dadce0; --blue:#0b57d0; --blue2:#1a73e8; --blue-soft:#d3e3fd; --rail:#202124; --amber:#f9ab00; --red:#d93025; --green:#188038; font-family:Roboto,"Segoe UI",sans-serif; color:var(--ink); background:var(--paper); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; font-size:16px; line-height:1.55; }
a { color:inherit; }
button,a { font:inherit; }
.site-nav { height:68px; padding:0 clamp(20px,5vw,76px); display:flex; align-items:center; gap:36px; position:fixed; z-index:20; inset:0 0 auto; background:rgba(248,250,253,.95); border-bottom:1px solid var(--rule); backdrop-filter:blur(12px); }
.wordmark { display:flex; align-items:center; gap:10px; text-decoration:none; font-weight:700; font-size:18px; }
.wordmark img { width:32px; height:32px; }
.site-nav nav { display:flex; align-items:center; gap:26px; margin-left:auto; }
.site-nav nav a,.nav-account { text-decoration:none; font-size:14px; color:var(--muted); }
.site-nav nav a:hover,.nav-account:hover { color:var(--blue); }
.nav-account { padding:7px 14px; border:1px solid var(--rule); border-radius:6px; }
.hero { position:relative; min-height:min(760px,calc(100vh - 34px)); padding:150px clamp(24px,7vw,110px) 70px; overflow:hidden; background:#edf3fc; border-bottom:1px solid var(--rule); }
.hero-copy { position:relative; z-index:3; max-width:580px; }
.eyebrow { margin:0 0 12px; color:var(--blue); font:600 11px/1.3 "Roboto Mono",monospace; text-transform:uppercase; letter-spacing:.08em; }
h1 { margin:0; font-size:clamp(64px,9vw,126px); line-height:.92; font-weight:650; letter-spacing:0; }
.hero-lede { max-width:540px; margin:26px 0; font-size:clamp(19px,2vw,25px); line-height:1.38; color:#3c4043; }
.hero-actions,.download-actions { display:flex; gap:10px; flex-wrap:wrap; }
.button { min-height:44px; padding:10px 18px; border:1px solid var(--rule); border-radius:7px; display:inline-flex; align-items:center; justify-content:center; text-decoration:none; font-weight:600; font-size:14px; background:var(--surface); color:var(--ink); }
.button.primary { background:var(--blue); border-color:var(--blue); color:#fff; }
.button:hover:not(:disabled) { border-color:var(--blue); color:var(--blue); }
.button.primary:hover:not(:disabled) { background:var(--blue2); color:#fff; }
.button:disabled { opacity:.55; cursor:not-allowed; }
.platform-note { margin:16px 0 0; color:var(--muted); font-size:13px; }
.product-scene { position:absolute; z-index:1; width:min(980px,64vw); right:-150px; top:115px; transform:rotate(-2deg); filter:drop-shadow(0 28px 42px rgba(32,33,36,.18)); }
.app-preview { aspect-ratio:1.48; display:grid; grid-template-columns:190px 1.2fr .9fr; overflow:hidden; border:1px solid #8b919a; border-radius:8px; background:var(--surface); font-size:11px; }
.app-preview aside { padding:16px 10px; background:var(--rail); color:#e8eaed; display:flex; flex-direction:column; }
.preview-brand { display:flex; align-items:center; gap:8px; margin:0 7px 22px; font-weight:700; font-size:14px; }
.preview-brand img { width:25px; height:25px; }
.app-preview aside small { margin:16px 8px 5px; color:#9aa0a6; font:8px "Roboto Mono"; }
.preview-nav { display:flex; padding:7px 9px; border-radius:5px; color:#bdc1c6; }
.preview-nav b { margin-left:auto; font:10px "Roboto Mono"; }
.preview-nav.active { background:#303134; color:#fff; box-shadow:inset 3px 0 #8ab4f8; }
.preview-list { border-right:1px solid var(--rule); min-width:0; }
.preview-toolbar { height:76px; padding:14px; display:flex; flex-direction:column; gap:10px; border-bottom:1px solid var(--rule); }
.preview-toolbar strong { font-size:16px; }
.preview-toolbar span { padding:6px 9px; border-radius:5px; background:#f1f3f4; color:var(--muted); }
.preview-columns { display:grid; grid-template-columns:1.3fr .8fr 50px; gap:10px; padding:7px 12px; color:var(--muted); background:var(--paper); font:8px "Roboto Mono"; text-transform:uppercase; }
.preview-row { min-height:67px; display:grid; grid-template-columns:38px minmax(95px,1.2fr) minmax(70px,.8fr) 48px; align-items:center; gap:10px; padding:9px 12px; border-top:1px solid var(--rule); }
.preview-row.selected { background:var(--blue-soft); box-shadow:inset 3px 0 var(--blue); }
.tile { width:34px; height:34px; display:grid; place-items:center; border-radius:7px; color:#fff; font-style:normal; font-weight:700; }
.tile.blue { background:var(--blue2); }.tile.red{background:var(--red)}.tile.green{background:var(--green)}.tile.amber{background:#b06000}
.preview-row span,.detail-title span { min-width:0; }
.preview-row b,.preview-row small,.detail-title b,.detail-title small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.preview-row small,.detail-title small,.preview-row em,.preview-row time { color:var(--muted); font-style:normal; font-size:9px; }
.preview-detail { padding:22px; background:var(--paper); }
.detail-title { display:flex; align-items:center; gap:10px; margin-bottom:28px; font-size:15px; }
.preview-detail label { display:block; margin-top:14px; color:var(--muted); font:8px "Roboto Mono"; }
.preview-detail p { margin:4px 0 0; padding-bottom:8px; border-bottom:1px solid var(--rule); font-size:11px; }
.masked { font-family:"Roboto Mono"; }
.trust-strip { min-height:86px; padding:20px clamp(24px,7vw,110px); display:grid; grid-template-columns:repeat(3,1fr); align-items:center; gap:28px; background:var(--surface); border-bottom:1px solid var(--rule); }
.trust-strip span { color:var(--muted); font-size:14px; }.trust-strip b{display:block;color:var(--ink);font-size:15px}
.section { padding:100px clamp(24px,7vw,110px); }
.section-intro { max-width:720px; }.section-intro h2,.security-band h2,.download-band h2,.account-band h2{margin:0;font-size:clamp(30px,4vw,52px);line-height:1.08;font-weight:550;letter-spacing:0}.section-intro>p:last-child{color:var(--muted);font-size:18px}
.feature-grid { display:grid; grid-template-columns:repeat(4,1fr); margin-top:70px; border-top:1px solid var(--rule); }
.feature-grid article { min-width:0; padding:25px 26px 10px 0; border-right:1px solid var(--rule); }
.feature-grid article+article { padding-left:26px; }.feature-grid article:last-child{border-right:0}.feature-grid span{color:var(--blue);font:11px "Roboto Mono"}.feature-grid h3{margin:28px 0 8px;font-size:18px}.feature-grid p{margin:0;color:var(--muted);font-size:14px}
.security-band { padding:90px clamp(24px,7vw,110px); display:grid; grid-template-columns:1fr 1fr; gap:70px; background:var(--rail); color:#e8eaed; }
.security-band .eyebrow{color:#8ab4f8}.security-points p{display:grid;grid-template-columns:140px 1fr;gap:20px;margin:0;padding:14px 0;border-bottom:1px solid #3c4043}.security-points span{color:#bdc1c6}.security-band>a{color:#8ab4f8;text-decoration:none}
.pricing-section { background:var(--surface); }
.pricing-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:55px; }
.price-card { padding:26px; border:1px solid var(--rule); border-radius:8px; display:flex; flex-direction:column; min-height:460px; }.price-card.featured{border:2px solid var(--blue);padding:25px;background:#f8fbff}.plan-name{display:block;color:var(--blue);font:600 11px "Roboto Mono";text-transform:uppercase}.price-card strong{display:block;margin-top:18px;font-size:38px;line-height:1}.price-card small{color:var(--muted)}.price-card ul{list-style:none;margin:30px 0;padding:0;flex:1}.price-card li{padding:9px 0;border-bottom:1px solid var(--rule);font-size:14px}.price-card li::before{content:"✓";color:var(--green);margin-right:9px}
.download-band,.account-band { padding:65px clamp(24px,7vw,110px); display:flex; align-items:center; justify-content:space-between; gap:45px; border-top:1px solid var(--rule); }.download-band p,.account-band p{color:var(--muted)}.download-band h2,.account-band h2{font-size:34px}.account-band{background:#edf3fc;justify-content:flex-start}.account-band img{width:68px;height:68px}.account-band .button{margin-left:auto}
footer { min-height:90px; padding:25px clamp(24px,7vw,110px); display:flex; align-items:center; gap:30px; color:#bdc1c6; background:var(--rail); font-size:13px; }footer nav{display:flex;gap:22px;margin-left:auto}footer a{text-decoration:none}
.legal-page { max-width:860px; min-height:calc(100vh - 90px); padding-top:150px; }
.legal-page h1 { margin-bottom:60px; font-size:clamp(48px,7vw,82px); }
.legal-page h2 { margin:38px 0 8px; font-size:22px; }
.legal-page p { color:var(--muted); font-size:17px; }
.account-page { min-height:calc(100vh - 90px); padding:145px clamp(24px,9vw,140px) 90px; }
.account-intro { max-width:800px; }
.account-intro h1 { font-size:clamp(48px,7vw,86px); line-height:1; }
.account-intro>p:last-child { max-width:680px; margin:26px 0 0; color:var(--muted); font-size:18px; }
.account-state { min-height:220px; margin-top:60px; padding:30px 0; border-top:1px solid var(--rule); border-bottom:1px solid var(--rule); }
.account-state[hidden],.account-dashboard[hidden] { display:none; }
.account-state h2,.activation-tool h2 { margin:0; font-size:26px; font-weight:550; }
.account-state p,.activation-tool>div>p:last-child { color:var(--muted); }
.account-loader { display:block; width:28px; height:28px; border:3px solid var(--rule); border-top-color:var(--blue); border-radius:50%; animation:spin .8s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }
.google-button { min-height:44px; margin-top:24px; }
.account-message { min-height:20px; color:var(--muted); font-size:13px; }
.account-dashboard { margin-top:60px; }
.account-summary { display:flex; align-items:end; justify-content:space-between; gap:24px; padding:26px 0; border-top:1px solid var(--rule); border-bottom:1px solid var(--rule); }
.plan-label { display:block; color:var(--blue); font:600 11px "Roboto Mono"; text-transform:uppercase; }
.account-summary strong { display:block; margin-top:8px; font-size:34px; }
.account-summary>span { color:var(--muted); }
.activation-tool { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:end; gap:28px; padding:46px 0; border-bottom:1px solid var(--rule); }
.activation-code { grid-column:1/-1; width:fit-content; padding:14px 18px; border:1px solid var(--blue); border-radius:8px; background:#edf3fc; color:var(--blue); font:600 30px "Roboto Mono"; letter-spacing:.14em; user-select:all; }
.activation-tool>.account-message { grid-column:1/-1; margin:0; }
.account-actions { display:flex; align-items:center; gap:22px; padding:24px 0; }
.text-command { padding:9px 0; border:0; background:none; color:var(--muted); text-decoration:underline; }
.account-privacy { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; margin-top:70px; padding-top:24px; border-top:1px solid var(--rule); color:var(--muted); font-size:13px; }
@media(max-width:900px){.site-nav nav{display:none}.product-scene{opacity:.2;width:1100px;right:-540px}.hero-copy{max-width:620px}.feature-grid{grid-template-columns:1fr 1fr}.feature-grid article:nth-child(2){border-right:0}.pricing-grid{grid-template-columns:1fr}.price-card{min-height:0}.security-band{grid-template-columns:1fr}.download-band,.account-band{align-items:flex-start;flex-direction:column}.account-band .button{margin-left:0}}
@media(max-width:600px){.site-nav{height:60px}.hero{padding:105px 24px 0;min-height:0}.hero-copy{max-width:100%}h1{font-size:64px}.hero-lede{max-width:100%;font-size:19px}.hero-actions .button{width:100%}.product-scene{position:relative;opacity:1;width:calc(100% + 48px);right:auto;top:auto;margin:48px 0 0 -24px;transform:none;filter:drop-shadow(0 18px 28px rgba(32,33,36,.15))}.app-preview{grid-template-columns:132px 1fr;aspect-ratio:1.08;border-right:0;border-left:0;border-radius:0}.preview-detail{display:none}.app-preview aside{padding:12px 7px}.preview-brand{margin-bottom:14px}.preview-nav{padding:6px}.preview-row{grid-template-columns:34px minmax(80px,1fr);gap:8px}.preview-row em,.preview-row time{display:none}.preview-columns{display:none}.trust-strip{grid-template-columns:1fr;gap:14px}.section{padding-top:70px;padding-bottom:70px}.feature-grid{grid-template-columns:1fr;margin-top:45px}.feature-grid article,.feature-grid article+article{padding:22px 0;border-right:0}.security-band{padding-top:70px;padding-bottom:70px;gap:40px}.security-points p{grid-template-columns:1fr;gap:3px}.account-page{padding:110px 24px 70px}.account-intro h1{font-size:48px}.account-summary{align-items:flex-start;flex-direction:column}.activation-tool{grid-template-columns:1fr;align-items:start}.activation-code,.activation-tool>.account-message{grid-column:1}.activation-code{font-size:24px}.account-privacy{grid-template-columns:1fr}.account-actions{align-items:stretch;flex-direction:column}.account-actions .button{width:100%}footer{align-items:flex-start;flex-direction:column}footer nav{margin-left:0}}
