.pw-page { max-width:1440px; margin:auto; color:#26374b; }
.pw-heading,.pw-result-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; margin:24px 0; }
.pw-heading h1 { margin:6px 0; font-size:36px; letter-spacing:-.025em; }
.pw-heading p { margin:8px 0; }
.pw-badge { background:#e8f0ed; border:1px solid #c2d8cb; border-radius:20px; padding:9px 15px; font-size:13px; white-space:nowrap; }
.pw-selection { display:grid; grid-template-columns:1fr 1fr; gap:16px; background:#fff; border:1px solid #d4dee8; padding:24px; border-radius:12px; }
.pw-selection label { display:flex; flex-direction:column; gap:8px; font-weight:650; min-width:0; }
.pw-selection select { width:100%; min-width:0; height:46px; padding:8px; font:inherit; font-size:14px; background:#fff; color:#24364b; border:1px solid #9eafbf; border-radius:6px; }
.pw-selection button { align-self:end; height:46px; border:0; border-radius:6px; background:#214f75; color:#fff; font:inherit; font-weight:650; cursor:pointer; }
.pw-selection button:hover { background:#153b5b; }
.pw-generation,.pw-note { color:#566a7d; font-size:13px; line-height:1.65; }
.pw-error { background:#fff3e8; border:1px solid #bd854d; padding:22px; border-radius:8px; margin:24px 0; }
.pw-error small,.pw-error a { display:block; margin-top:10px; }
.pw-empty { padding:55px 25px; text-align:center; background:#f1f5f8; border-radius:12px; margin:25px 0; }
.pw-identities { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin:28px 0; }
.pw-identity { padding:22px; border:1px solid #d4dee8; border-top:4px solid #1769aa; border-radius:10px; background:white; min-width:0; }
.pw-identity h2 { font-size:25px; margin:10px 0 20px; }
.pw-identity h2 span { font-size:18px; margin-left:10px; }
.pw-identity p { margin:0; color:#566a7d; }
.pw-identity dl { margin:0; display:grid; gap:12px; }
.pw-identity dl div { display:grid; grid-template-columns:145px 1fr; gap:10px; }
.pw-identity dt { color:#566a7d; font-size:13px; }
.pw-identity dd { margin:0; overflow-wrap:anywhere; }
.pw-jump { display:flex; flex-wrap:wrap; gap:18px; margin:24px 0; }
.pw-panel { background:#fff; border:1px solid #d4dee8; border-radius:10px; padding:22px; margin:22px 0; min-width:0; scroll-margin-top:16px; }
.pw-panel h2 { margin:0 0 14px; font-size:23px; }
.pw-panel p { line-height:1.65; }
.pw-panel .plotly-graph-div { width:100%; }
.comparison-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.comparison-roast { min-width:0; padding:12px; border:1px solid #d4dee8; border-radius:8px; }
.comparison-roast h3 { margin:4px 0 18px; font-size:18px; }
.comparison-chart { min-width:0; }
.comparison-chart .plotly-graph-div { width:100%; }
.pw-scroll { max-width:100%; overflow-x:auto; border:1px solid #dce4eb; border-radius:6px; }
.pw-scroll table { width:100%; border-collapse:collapse; font-size:13px; text-align:left; margin:0; }
.pw-scroll th,.pw-scroll td { padding:13px 12px; border-bottom:1px solid #e0e6ed; vertical-align:top; line-height:1.55; }
.pw-scroll thead th { background:#edf2f6; color:#354c61; }
.pw-scroll tbody th { font-weight:600; text-align:left; }
.pw-scroll tr:nth-child(even) { background:#fafcfd; }
.pw-scroll small { display:block; font-size:11px; color:#637689; margin-top:4px; font-weight:400; }
.pw-scroll .pw-reason { color:#856124; overflow-wrap:anywhere; max-width:190px; }
.pw-landmarks { min-width:1220px; }
.pw-landmarks th:first-child { min-width:170px; }
.pw-results { min-width:1120px; table-layout:fixed; }
.pw-results th:first-child { width:270px; }
.pw-results th:last-child { width:215px; }
.pw-results code { font-size:12px; overflow-wrap:anywhere; }
.pw-results td { overflow-wrap:anywhere; }
.pw-results summary { cursor:pointer; font-size:11px; font-weight:400; color:#286188; padding-top:8px; }
.pw-results pre { max-height:420px; max-width:245px; overflow:auto; font-size:11px; font-weight:400; white-space:pre-wrap; word-break:break-word; }
.pw-provenance { overflow-wrap:anywhere; font-size:13px; }
.pw-provenance summary { cursor:pointer; font-weight:650; }
.pw-provenance dd { margin:7px 0 18px; color:#637689; }
@media(max-width:700px) { .pw-heading,.pw-result-heading { align-items:flex-start; flex-direction:column; gap:8px; } .pw-heading h1 { font-size:30px; } .pw-selection,.pw-identities { grid-template-columns:1fr; } .pw-panel,.pw-selection,.pw-identity { padding:14px; } .pw-identity dl div { grid-template-columns:120px 1fr; } .pw-panel h2 { font-size:20px; } .pw-jump { gap:12px; font-size:13px; } .pw-scroll table { min-width:820px; } .pw-scroll .pw-landmarks { min-width:1220px; } .pw-scroll .pw-results { min-width:1120px; } }
@media(max-width:950px) { .comparison-grid { grid-template-columns:1fr; } }