:root{font-family:Segoe UI,Helvetica Neue,Helvetica,Arial,sans-serif;color:#10263e;background:#ffffff;--page-bg: #f6f9fc;--surface: rgba(255, 255, 255, .9);--surface-strong: #ffffff;--text: #10263e;--muted: #58718a;--border: rgba(25, 60, 92, .12);--line: rgba(56, 93, 127, .12);--accent: #165d91;--accent-strong: #0f4b74;--teal: #14756e;--shadow: 0 24px 60px rgba(13, 41, 66, .1);--radius-xl: 28px;--radius-lg: 20px;--radius-md: 14px}*{box-sizing:border-box}body{margin:0;min-width:320px;background:linear-gradient(180deg,rgba(234,244,252,.75) 0%,rgba(246,249,252,0) 35%),var(--page-bg);color:var(--text)}button,input,select,textarea{font:inherit}a{color:inherit}.app-shell{min-height:100vh;position:relative;overflow:hidden}.backdrop-grid{position:absolute;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:48px 48px;-webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.8),transparent 80%);mask-image:linear-gradient(180deg,rgba(0,0,0,.8),transparent 80%);pointer-events:none}.app-frame{position:relative;max-width:1320px;margin:0 auto;padding:40px 24px 64px}.site-header{margin-bottom:22px}.header-bar{display:flex;gap:20px;align-items:flex-start}.brand-lockup{display:flex;align-items:center;gap:18px}.brand-stack{display:grid;gap:12px;min-width:0}.brand-logo{width:88px;height:88px;object-fit:contain;filter:drop-shadow(0 10px 20px rgba(16,75,116,.12))}.eyeline,.panel-kicker{display:inline-flex;letter-spacing:.08em;text-transform:uppercase;font-size:.78rem;font-weight:700;color:var(--teal)}.site-header h1{margin:8px 0 0;font-size:clamp(2.1rem,4vw,4rem);line-height:.98;letter-spacing:-.045em}.site-nav{display:flex;align-items:center;gap:8px;padding:6px;width:min(100%,760px);border:1px solid var(--border);border-radius:18px;background:rgba(255,255,255,.78);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 16px 32px #0d294214}.nav-link{border:0;background:transparent;color:var(--muted);font-weight:800;font-size:.92rem;padding:9px 14px;border-radius:12px;cursor:pointer;transition:background .2s ease,color .2s ease,transform .2s ease}.nav-link:hover{color:var(--accent-strong);transform:translateY(-1px)}.nav-link-active{background:linear-gradient(135deg,var(--accent) 0%,#0f4f77 100%);color:#fff;box-shadow:0 12px 24px #104b742e}.intro-panel,.panel,.metric-card,.metadata-chip,.empty-state,.error-banner{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.intro-panel{border:1px solid var(--border);border-radius:var(--radius-xl);background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(245,250,253,.92));box-shadow:var(--shadow);padding:28px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:center;margin-bottom:28px}.summary-band,.seo-copy-panel{margin-bottom:24px}.seo-copy-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.seo-copy-card{border:1px solid var(--border);border-radius:24px;background:rgba(255,255,255,.88);box-shadow:var(--shadow);padding:24px}.seo-copy-card h2{margin:0 0 10px;font-size:1.08rem;line-height:1.25;letter-spacing:-.03em}.seo-copy-card p{margin:0;color:var(--muted);line-height:1.75}.intro-copy h2{margin:10px 0 12px;max-width:700px;font-size:clamp(1.55rem,2vw,2.3rem);letter-spacing:-.04em;line-height:1.08}.intro-copy p:last-child{margin:0;max-width:760px;color:var(--muted);line-height:1.75;font-size:1rem}.read-more-button{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 22px;border-radius:16px;text-decoration:none;background:linear-gradient(135deg,var(--accent) 0%,#0f4f77 100%);color:#fff;font-weight:800;box-shadow:0 18px 34px #104b7433}.workspace-layout{display:grid;grid-template-columns:minmax(340px,430px) minmax(0,1fr);gap:24px}.panel{border:1px solid var(--border);border-radius:var(--radius-xl);background:var(--surface);box-shadow:var(--shadow);padding:28px}.panel-heading{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:24px}.panel-heading h2{margin:8px 0 0;font-size:1.45rem;letter-spacing:-.03em}.status-pill{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:8px 14px;background:#eef5fb;color:var(--accent-strong);font-size:.85rem;font-weight:700;white-space:nowrap}.status-pill.success{background:#e6f7f3;color:#146459}.generator-form{display:grid;gap:18px}.field{display:grid;gap:9px}.field span{font-size:.94rem;font-weight:700}.field small{color:var(--muted);line-height:1.45}.field input,.field select,.field textarea{width:100%;border:1px solid var(--border);background:rgba(255,255,255,.96);color:var(--text);border-radius:var(--radius-md);padding:14px 15px;outline:none;transition:border-color .2s ease,box-shadow .2s ease}.field textarea{min-height:138px;resize:vertical}.field input:focus,.field select:focus,.field textarea:focus{border-color:#165d9173;box-shadow:0 0 0 4px #165d9114}.field-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.generate-button{border:0;border-radius:16px;background:linear-gradient(135deg,var(--accent) 0%,#0f4f77 100%);color:#fff;font-weight:800;letter-spacing:-.01em;padding:16px 18px;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease,opacity .18s ease;box-shadow:0 18px 34px #104b7440}.generate-button:hover{transform:translateY(-1px)}.generate-button:disabled{opacity:.7;cursor:wait;transform:none}.error-banner{border:1px solid rgba(188,58,58,.18);background:rgba(255,241,241,.9);color:#8c2c2c;border-radius:14px;padding:14px 16px;line-height:1.5}.results-panel{display:grid;align-content:start}.result-summary{display:grid;grid-template-columns:1.15fr 1fr .95fr .95fr 1.15fr;gap:12px}.result-summary-wide{grid-template-columns:1.15fr repeat(4,minmax(0,.85fr))}.metric-card{border:1px solid var(--border);border-radius:18px;background:rgba(255,255,255,.94);padding:11px 13px;display:grid;gap:6px;min-height:82px}.metric-label{font-size:.72rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}.metric-card strong{font-size:1.22rem;letter-spacing:-.04em}.size-card{border-color:#165d913d;background:linear-gradient(135deg,rgba(22,93,145,.14),rgba(43,139,214,.18));box-shadow:0 16px 34px #165d9124}.size-card strong{color:var(--accent-strong);font-size:1.75rem}.average-card{border-color:#0f4b742e;background:linear-gradient(135deg,rgba(255,255,255,.96),rgba(230,241,250,.88))}.average-card strong{color:#13567f;font-size:1.18rem}.metric-card.compact strong{font-size:.98rem;line-height:1.2}.reduction-card{border-color:#14756e38;background:linear-gradient(135deg,rgba(22,93,145,.1),rgba(20,117,110,.16));box-shadow:0 14px 30px #14756e1f}.reduction-card strong{color:#0c8b6c;font-size:1.28rem}.reduction-card small{color:var(--accent-strong);font-weight:700;font-size:.78rem}.walkthrough-shell,.references-shell{display:grid;gap:24px}.walkthrough-hero,.references-hero,.walkthrough-panel{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.walkthrough-hero,.references-hero{border:1px solid var(--border);border-radius:var(--radius-xl);background:radial-gradient(circle at top right,rgba(35,136,196,.14),transparent 28%),linear-gradient(180deg,rgba(255,255,255,.96),rgba(245,250,253,.92));box-shadow:var(--shadow);padding:30px 28px;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(260px,.7fr);gap:24px;align-items:center}.references-hero{display:block}.walkthrough-hero-compact{grid-template-columns:minmax(0,1.4fr) minmax(220px,.6fr)}.walkthrough-hero h2,.references-hero h2{margin:10px 0 12px;font-size:clamp(1.7rem,2.4vw,2.8rem);letter-spacing:-.04em;line-height:1.06}.walkthrough-hero p:last-child,.references-hero p:last-child{margin:0;max-width:760px;color:var(--muted);line-height:1.75}.references-list{display:grid;gap:16px}.reference-card{border:1px solid var(--border);border-radius:24px;background:rgba(255,255,255,.9);box-shadow:var(--shadow);padding:22px 24px;display:grid;grid-template-columns:auto minmax(0,1fr);gap:18px;align-items:start}.reference-index{display:inline-flex;align-items:center;justify-content:center;min-width:56px;padding:10px 12px;border-radius:16px;background:linear-gradient(135deg,rgba(22,93,145,.12),rgba(20,117,110,.14));color:var(--accent-strong);font-weight:800}.reference-body{display:grid;gap:12px}.reference-citation{margin:0;color:var(--text);line-height:1.8;font-size:1rem}.reference-link{display:inline-flex;width:fit-content;align-items:center;justify-content:center;min-height:42px;padding:0 16px;border-radius:14px;text-decoration:none;background:linear-gradient(135deg,var(--accent) 0%,#0f4f77 100%);color:#fff;font-weight:800;box-shadow:0 14px 28px #104b7429}.walkthrough-stats{display:grid;gap:14px}.walkthrough-stats-inline{align-content:start}.walkthrough-stat{border:1px solid var(--border);border-radius:20px;background:rgba(255,255,255,.9);padding:18px 18px 16px;display:grid;gap:8px}.walkthrough-stat span{font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;font-weight:700;color:var(--muted)}.walkthrough-stat strong{font-size:2rem;letter-spacing:-.04em;color:var(--accent-strong)}.walkthrough-stat.emphasis{background:linear-gradient(135deg,rgba(22,93,145,.12),rgba(20,117,110,.14));border-color:#165d9133;box-shadow:0 14px 30px #104b741f}.walkthrough-actions{margin-top:20px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}.walkthrough-button{border:0;border-radius:14px;background:linear-gradient(135deg,var(--accent) 0%,#0f4f77 100%);color:#fff;font-weight:800;padding:12px 18px;box-shadow:0 14px 28px #104b742e;cursor:pointer}.walkthrough-button:disabled{opacity:.72;cursor:wait}.walkthrough-state{color:var(--muted);font-weight:700}.walkthrough-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr);gap:24px}.walkthrough-panel{min-height:100%}.walkthrough-figure{border:1px solid var(--border);border-radius:28px;background:rgba(255,255,255,.88);box-shadow:var(--shadow);padding:24px;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(280px,.75fr);gap:18px}.walkthrough-column{display:grid;gap:14px}.walkthrough-column-narrow{align-content:start}.walkthrough-column-title{display:inline-flex;width:fit-content;padding:10px 18px;background:#111111;color:#fff;font-weight:800;font-size:.96rem;border-radius:2px}.tuple-coverage-table,.suite-table{border:1px solid rgba(37,51,66,.2);background:rgba(255,255,255,.96)}.tuple-table-header,.suite-table-header,.suite-table-row{display:grid}.tuple-table-header{grid-template-columns:repeat(6,minmax(0,1fr))}.tuple-table-header div,.suite-table-header div{background:#4a4a4a;color:#fff;text-align:center;font-weight:800;padding:8px 6px;border-right:1px solid rgba(255,255,255,.16);font-size:.88rem}.tuple-table-header div:last-child,.suite-table-header div:last-child{border-right:0}.tuple-table-row{display:grid;grid-template-columns:repeat(6,minmax(0,1fr))}.tuple-table-cell{min-height:34px;border-right:1px solid rgba(37,51,66,.14);border-bottom:1px solid rgba(37,51,66,.14);display:flex;align-items:center;justify-content:center;font-family:Courier New,monospace;font-size:.92rem;color:#1e2d3b}.walkthrough-highlight-cell{animation:tuple-highlight-flash .9s ease;box-shadow:inset 0 0 0 1px #ffffff8c}.tuple-table-row .tuple-table-cell:last-child{border-right:0}.suite-table-header,.suite-table-row{grid-template-columns:repeat(5,minmax(0,1fr))}.suite-table-row div{min-height:34px;border-right:1px solid rgba(37,51,66,.14);border-bottom:1px solid rgba(37,51,66,.14);display:flex;align-items:center;justify-content:center;font-weight:700}.suite-table-row div:last-child{border-right:0}.case-blue{border-color:#165d913d;background:linear-gradient(135deg,rgba(22,93,145,.14),rgba(43,139,214,.18))}.case-teal{border-color:#14756e3d;background:linear-gradient(135deg,rgba(20,117,110,.14),rgba(62,177,151,.18))}.case-gold{border-color:#ad770e3d;background:linear-gradient(135deg,rgba(234,183,71,.2),rgba(252,221,137,.24))}.case-coral{border-color:#ba54363d;background:linear-gradient(135deg,rgba(240,145,117,.18),rgba(250,198,182,.24))}.case-indigo{border-color:#5260be3d;background:linear-gradient(135deg,rgba(109,121,224,.18),rgba(201,207,255,.24))}.case-mint{border-color:#44a1783d;background:linear-gradient(135deg,rgba(111,207,151,.18),rgba(214,248,226,.24))}.case-blue strong,.case-teal strong,.case-gold strong,.case-coral strong,.case-indigo strong,.case-mint strong{color:var(--text)}@keyframes pulse-active{0%,to{box-shadow:0 18px 30px #165d9129}50%{box-shadow:0 22px 34px #165d913d}}@keyframes tuple-highlight-flash{0%{transform:scale(.96);filter:saturate(.92)}45%{transform:scale(1.03);filter:saturate(1.14)}to{transform:scale(1);filter:saturate(1)}}.metadata-grid{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:18px}.convergence-panel{margin-bottom:18px;background:radial-gradient(circle at top right,rgba(35,136,196,.1),transparent 28%),linear-gradient(180deg,rgba(255,255,255,.97),rgba(242,247,252,.94))}.chart-shell{overflow:auto;border:1px solid var(--border);border-radius:28px;background:linear-gradient(180deg,rgba(255,255,255,.99),rgba(239,246,252,.95));padding:20px 18px 16px;box-shadow:inset 0 1px #ffffffe6}.convergence-chart{width:100%;min-width:1120px;display:block}.chart-grid-line{stroke:#809ebc47;stroke-width:1.1}.chart-grid-line-vertical{stroke-dasharray:6 10}.chart-axis-label{fill:#6c8399;font-size:13px;font-weight:800}.chart-axis-label-x{font-size:11px}.chart-axis-label-y{font-size:13px}.chart-title-label{fill:#274762;font-size:16px;font-weight:800}.chart-area{fill:#165d911f}.chart-line{fill:none;stroke:#165d91;stroke-linecap:round;stroke-linejoin:round}.chart-point{fill:#0f4b74;stroke:#fff;stroke-width:3}.chart-point-label{fill:#165d91;font-size:13px;font-weight:800}.convergence-pill{padding:14px 22px;font-size:.95rem;font-weight:800;background:linear-gradient(135deg,rgba(236,244,251,.96),rgba(226,238,248,.96));color:var(--accent-strong)}.metadata-chip{border:1px solid var(--border);background:rgba(255,255,255,.92);border-radius:999px;padding:10px 14px;color:var(--accent-strong);font-size:.9rem;font-weight:700}.table-shell{overflow:auto;border:1px solid var(--border);border-radius:20px;background:rgba(255,255,255,.96)}table{width:100%;border-collapse:collapse}thead th{text-align:left;padding:16px 18px;font-size:.8rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);background:rgba(239,247,252,.86)}tbody td{padding:15px 18px;border-top:1px solid var(--border)}tbody tr:nth-child(2n) td{background:rgba(248,251,253,.8)}.empty-state{border:1px dashed rgba(56,93,127,.22);border-radius:22px;background:rgba(255,255,255,.85);color:var(--muted);padding:24px}.empty-state.large{padding:42px 28px}.empty-state strong{display:block;margin-bottom:8px;color:var(--text)}.empty-state p{margin:0;line-height:1.6}.site-footer{margin-top:28px;padding:22px 24px;display:flex;justify-content:space-between;gap:18px;align-items:flex-start;color:var(--muted);border:1px solid var(--border);border-radius:24px;background:rgba(255,255,255,.82);box-shadow:0 18px 42px #0d294214;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.site-footer strong{display:block;color:var(--text);margin-bottom:6px}.site-footer p{margin:0;line-height:1.6}.footer-right{display:flex;align-items:center}.profile-link{display:inline-flex;align-items:center;gap:12px;text-decoration:none;color:var(--text)}.profile-avatar{width:52px;height:52px;border-radius:999px;object-fit:cover;border:2px solid rgba(22,93,145,.18);box-shadow:0 10px 24px #0d29421f}.profile-copy{display:grid;gap:2px}.profile-copy span{font-weight:800;color:var(--text)}.profile-copy small{color:var(--muted)}.footer-links{display:flex;flex-wrap:wrap;gap:18px;align-items:center;margin-top:14px}.footer-links a,.footer-links span{color:var(--accent-strong);text-decoration:none;font-weight:700}@media (max-width: 1080px){.header-bar,.walkthrough-hero,.intro-panel,.seo-copy-grid,.workspace-layout,.walkthrough-grid,.walkthrough-figure{grid-template-columns:1fr}.result-summary,.result-summary-wide{grid-template-columns:repeat(2,minmax(0,1fr))}.header-bar{align-items:stretch}.site-nav{width:100%}.site-footer{flex-direction:column}.footer-right{align-items:flex-start}.reference-card{grid-template-columns:1fr}}@media (max-width: 720px){.app-frame{padding:24px 14px 48px}.panel,.intro-panel{padding:20px;border-radius:24px}.field-row,.result-summary{grid-template-columns:1fr}.site-nav{width:100%;justify-content:space-between}.nav-link{flex:1}.brand-lockup{align-items:flex-start}.brand-logo{width:72px;height:72px}thead th,tbody td{padding-left:14px;padding-right:14px}}
