*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#0f172a;--bg2:#1e293b;--bg3:#334155;
  --text:#e2e8f0;--text-dim:#94a3b8;--text-muted:#64748b;
  --accent:#d97706;--accent-light:#fbbf24;--accent-dark:#92400e;
  --green:#16a34a;--yellow:#ca8a04;--red:#dc2626;
  --radius:8px;--radius-lg:12px;
  --font:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  --max-width:1200px;
}
html{font-size:16px;scroll-behavior:smooth}
body{font-family:var(--font);background:var(--bg);color:var(--text);line-height:1.6;min-height:100vh}
a{color:var(--accent-light);text-decoration:none}
a:hover,a:focus{text-decoration:underline}
img,svg{max-width:100%;height:auto}

/* Header */
.site-header{background:var(--bg2);border-bottom:1px solid var(--bg3);position:sticky;top:0;z-index:100}
.header-inner{max-width:var(--max-width);margin:0 auto;padding:.75rem 1.5rem;display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.logo{display:flex;align-items:center;gap:.5rem;color:var(--text);font-weight:700;font-size:1.1rem}
.logo:hover{text-decoration:none}
.logo-text{letter-spacing:-.01em}
.main-nav{margin-left:auto;display:flex;gap:1.25rem;font-size:.9rem}
.main-nav a{color:var(--text-dim);padding:.25rem 0}
.main-nav a:hover{color:var(--text)}

/* App Shell */
.app-shell{max-width:var(--max-width);margin:0 auto;padding:2rem 1.5rem;display:grid;grid-template-columns:300px 1fr;gap:2rem;align-items:start}

/* Search Panel */
.search-panel{background:var(--bg2);border:1px solid var(--bg3);border-radius:var(--radius-lg);padding:1.5rem;position:sticky;top:70px;max-height:calc(100vh - 90px);overflow-y:auto}
.panel-title{font-size:1.1rem;margin-bottom:1rem;color:var(--text)}
.field-label{display:block;font-size:.8rem;color:var(--text-dim);margin-bottom:.35rem;text-transform:uppercase;letter-spacing:.04em}
.text-input{width:100%;padding:.6rem .75rem;background:var(--bg);border:1px solid var(--bg3);border-radius:var(--radius);color:var(--text);font-size:.95rem;margin-bottom:.35rem}
.text-input:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:transparent}
.help-text{font-size:.78rem;color:var(--text-muted);margin-bottom:1rem}
.preset-list{list-style:none;margin-bottom:1rem}
.preset-list li{padding:.55rem .75rem;border-radius:var(--radius);cursor:pointer;font-size:.88rem;color:var(--text-dim);transition:background .15s}
.preset-list li:hover,.preset-list li:focus{background:var(--bg3);color:var(--text);outline:none}
.preset-list li.active{background:var(--accent-dark);color:var(--text)}
.edition-picker{margin-bottom:1rem}
.select-input{width:100%;padding:.6rem .75rem;background:var(--bg);border:1px solid var(--bg3);border-radius:var(--radius);color:var(--text);font-size:.95rem}
.select-input:focus{outline:2px solid var(--accent);outline-offset:1px}
.btn-primary{width:100%;padding:.7rem;background:var(--accent);color:#fff;border:none;border-radius:var(--radius);font-size:1rem;font-weight:600;cursor:pointer;transition:background .15s}
.btn-primary:hover{background:var(--accent-dark)}
.btn-primary:focus{outline:2px solid var(--accent-light);outline-offset:2px}
.history-block{margin-top:1.5rem;border-top:1px solid var(--bg3);padding-top:1rem}
.history-title{font-size:.85rem;color:var(--text-dim);margin-bottom:.5rem}
.history-list{list-style:none}
.history-list li{padding:.4rem .5rem;font-size:.82rem;color:var(--text-muted);cursor:pointer;border-radius:4px}
.history-list li:hover{background:var(--bg3);color:var(--text-dim)}

/* Results Area */
.results-area{min-width:0}
.empty-state{text-align:center;padding:4rem 1rem;color:var(--text-dim)}
.empty-state svg{margin-bottom:1rem;opacity:.5}
.empty-heading{font-size:1.3rem;margin-bottom:.5rem;color:var(--text)}
.empty-text{max-width:400px;margin:0 auto;font-size:.95rem}

.comparison-result{background:var(--bg2);border:1px solid var(--bg3);border-radius:var(--radius-lg);padding:2rem}
.result-header{margin-bottom:2rem;padding-bottom:1.5rem;border-bottom:1px solid var(--bg3)}
.result-title{font-size:1.5rem;margin-bottom:.25rem}
.result-subtitle{font-size:.95rem;color:var(--text-dim);margin-bottom:1rem}
.verdict-badge{display:inline-block;padding:.4rem 1rem;border-radius:999px;font-weight:700;font-size:.9rem}
.verdict-yes{background:#14532d;color:#86efac}
.verdict-maybe{background:#713f12;color:#fde68a}
.verdict-no{background:#7f1d1d;color:#fca5a5}

.section-heading{font-size:1.1rem;margin-bottom:.75rem;color:var(--text)}
.section-text{font-size:.92rem;color:var(--text-dim);margin-bottom:.75rem}

.diff-section{margin-bottom:2rem}
.diff-table-wrap{overflow-x:auto}
.diff-table{width:100%;border-collapse:collapse;font-size:.88rem}
.diff-table th{text-align:left;padding:.6rem .75rem;background:var(--bg3);color:var(--text-dim);font-weight:600;font-size:.78rem;text-transform:uppercase;letter-spacing:.04em}
.diff-table td{padding:.6rem .75rem;border-bottom:1px solid var(--bg3);vertical-align:top}
.diff-table tr:last-child td{border-bottom:none}
.impact-low{color:var(--green);font-weight:600}
.impact-med{color:var(--yellow);font-weight:600}
.impact-high{color:var(--red);font-weight:600}

.problem-section{margin-bottom:2rem}
.problem-list{list-style:none;display:grid;gap:.5rem}
.problem-list li{padding:.5rem .75rem;background:var(--bg);border-radius:var(--radius);font-size:.88rem;color:var(--text-dim)}
.problem-list li strong{color:var(--text)}

.price-section{margin-bottom:2rem}
.price-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem;margin-bottom:.75rem}
.price-card{background:var(--bg);border-radius:var(--radius);padding:1rem;text-align:center}
.price-card .edition-label{font-size:.8rem;color:var(--text-muted);margin-bottom:.25rem}
.price-card .price-range{font-size:1.2rem;font-weight:700;color:var(--text)}
.price-card .price-source{font-size:.75rem;color:var(--text-muted);margin-top:.25rem}
.price-note{font-size:.8rem;color:var(--text-muted)}

.edge-section{margin-bottom:2rem}
.edge-list{list-style:none;display:grid;gap:.5rem}
.edge-list li{padding:.5rem .75rem .5rem 1.75rem;background:var(--bg);border-radius:var(--radius);font-size:.88rem;color:var(--text-dim);position:relative}
.edge-list li::before{content:"!";position:absolute;left:.75rem;color:var(--accent);font-weight:700}

.action-section{border-top:1px solid var(--bg3);padding-top:1.5rem}
.action-buttons{display:flex;gap:.75rem;flex-wrap:wrap;margin-bottom:.5rem}
.btn-secondary{padding:.55rem 1rem;background:var(--bg3);color:var(--text);border:1px solid var(--bg3);border-radius:var(--radius);font-size:.88rem;cursor:pointer;transition:background .15s}
.btn-secondary:hover{background:var(--bg)}
.btn-secondary:focus{outline:2px solid var(--accent);outline-offset:1px}
.action-note{font-size:.82rem;color:var(--text-muted);min-height:1.2em}

/* Guide Section */
.guide-section{background:var(--bg2);border-top:1px solid var(--bg3);margin-top:3rem}
.guide-inner{max-width:var(--max-width);margin:0 auto;padding:3rem 1.5rem}
.guide-heading{font-size:1.4rem;margin-bottom:1.5rem}
.guide-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.25rem;margin-bottom:2.5rem}
.guide-card{background:var(--bg);border-radius:var(--radius-lg);padding:1.25rem}
.guide-card h3{font-size:.95rem;margin-bottom:.4rem;color:var(--accent-light)}
.guide-card p{font-size:.88rem;color:var(--text-dim)}
.guide-why,.guide-faq,.guide-checklist{margin-bottom:2rem}
.guide-why h3,.guide-faq h3,.guide-checklist h3{font-size.95rem;margin-bottom:.5rem;color:var(--text)}
.guide-why p{font-size:.92rem;color:var(--text-dim);line-height:1.7}
.guide-faq dl{display:grid;gap:.75rem}
.guide-faq dt{font-weight:600;font-size:.9rem;color:var(--text)}
.guide-faq dd{font-size:.88rem;color:var(--text-dim);padding-left:1rem}
.guide-checklist ol{display:grid;gap:.5rem;padding-left:1.25rem}
.guide-checklist li{font-size:.9rem;color:var(--text-dim)}

/* Footer */
.site-footer{background:var(--bg2);border-top:1px solid var(--bg3);margin-top:0}
.footer-inner{max-width:var(--max-width);margin:0 auto;padding:2rem 1.5rem;text-align:center;font-size:.82rem;color:var(--text-muted)}
.footer-inner p{margin-bottom:.35rem}
.footer-inner a{color:var(--text-dim)}

/* Responsive */
@media(max-width:860px){
  .app-shell{grid-template-columns:1fr}
  .search-panel{position:static;max-height:none}
  .comparison-result{padding:1.25rem}
}
@media(max-width:480px){
  .header-inner{padding:.6rem 1rem}
  .main-nav{gap:.75rem;font-size:.82rem}
  .app-shell{padding:1rem}
  .guide-inner{padding:1.5rem 1rem}
  .action-buttons{flex-direction:column}
  .btn-secondary{width:100%;text-align:center}
}

/* Focus visible */
:focus-visible{outline:2px solid var(--accent-light);outline-offset:2px}

/* Scrollbar */
.search-panel::-webkit-scrollbar{width:6px}
.search-panel::-webkit-scrollbar-track{background:transparent}
.search-panel::-webkit-scrollbar-thumb{background:var(--bg3);border-radius:3px}

/* Print */
@media print{
  .site-header,.search-panel,.action-section,.site-footer,.guide-section{display:none}
  .app-shell{display:block;padding:0}
  .comparison-result{border:none;padding:0}
  body{background:#fff;color:#000}
}


/* Factory-injected deployment helpers. The AI owns the site design above this block. */
.ad-unit {
  width: min(100%, 720px);
  min-height: 120px;
  margin: 24px auto;
  display: block;
}

.legal-page {
  width: min(900px, calc(100% - 32px));
  margin: 40px auto;
}

.factory-fallback-nav {
  width: min(900px, calc(100% - 32px));
  margin: 24px auto 0;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
  align-items: center;
  font-size: 0.95rem;
}

.factory-fallback-nav a {
  color: inherit;
  text-decoration: none;
  border-bottom: 1px solid currentColor;
}