:root { color-scheme: light; --ink:#183042; --muted:#687984; --line:#dbe4e8; --sea:#0f766e; --orange:#e7762d; --paper:#ffffff; --bg:#f2f6f5; --soft:#eef7f5; }
* { box-sizing:border-box; }
[hidden] { display:none !important; }
body { margin:0; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC",sans-serif; color:var(--ink); background:var(--bg); }
body.app-booting > * { visibility:hidden; }
header { padding:22px max(5vw,22px); color:white; background:linear-gradient(120deg,#123e4a,#0f766e); display:flex; align-items:end; justify-content:space-between; box-shadow:0 8px 30px rgba(18,62,74,.18); }
header div { display:flex; align-items:baseline; gap:16px; }
header strong { font-size:30px; letter-spacing:3px; }
header span { font-size:20px; }
header p { margin:0; opacity:.78; }
.header-actions { align-items:center; gap:14px; }
.top-tool-button { display:inline-flex; align-items:center; justify-content:center; min-height:38px; padding:8px 14px; border:1px solid rgba(255,255,255,.55); border-radius:999px; color:white; background:rgba(255,255,255,.14); font-size:13px; font-weight:850; text-decoration:none; box-shadow:0 8px 18px rgba(0,0,0,.08); }
.button.top-tool-button, button.top-tool-button { font-family:inherit; cursor:pointer; }
.top-tool-button:hover { background:rgba(255,255,255,.22); }
.user-pill { display:inline-flex; align-items:center; min-height:34px; padding:7px 12px; border-radius:999px; color:white; background:rgba(255,255,255,.12); font-size:12px; font-weight:850; }
.modal-dialog { width:min(440px,92vw); border:0; border-radius:16px; padding:0; box-shadow:0 24px 80px rgba(18,48,66,.28); }
.modal-dialog::backdrop { background:rgba(15,35,45,.42); }
.modal-dialog form { display:grid; grid-template-columns:1fr; gap:12px; padding:22px; }
.modal-dialog h3 { margin:0 0 4px; color:var(--ink); font-size:18px; }
.dialog-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:4px; }
main { width:min(1180px,94vw); margin:18px auto 64px; }
.workflow { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-bottom:14px; }
.workflow div { display:grid; grid-template-columns:34px 1fr; gap:2px 10px; align-items:center; padding:12px 14px; border:1px solid #cfe2de; border-radius:15px; background:rgba(255,255,255,.86); box-shadow:0 8px 22px rgba(35,69,76,.04); }
.workflow span { grid-row:1/3; display:grid; place-items:center; width:32px; height:32px; border-radius:50%; background:var(--sea); color:#fff; font-weight:900; }
.workflow strong { font-size:13px; }
.workflow small { color:var(--muted); font-size:11px; }
form { display:grid; grid-template-columns:minmax(0,1fr) 350px; align-items:start; gap:16px; }
.card { background:var(--paper); border:1px solid var(--line); border-radius:16px; padding:18px; box-shadow:0 10px 30px rgba(35,69,76,.06); }
form > .card:not(.summary-panel), form > .primary, form > #result, form > .history-card { grid-column:1; }
h2 { margin:0 0 14px; font-size:19px; } h3 { margin:18px 0 10px; font-size:14px; color:var(--muted); }
.grid { display:grid; gap:12px; }.grid.two { grid-template-columns:repeat(2,1fr); }.grid.three { grid-template-columns:repeat(3,1fr); }.wide { grid-column:1/-1; }
label { display:grid; gap:6px; color:#415762; font-size:12.5px; font-weight:700; }
input,select,textarea { width:100%; border:1px solid #cbd8dd; border-radius:10px; padding:9px 11px; background:white; color:var(--ink); font:inherit; min-height:40px; }
input:focus,select:focus,textarea:focus { outline:3px solid rgba(15,118,110,.14); border-color:var(--sea); }
.auto-country { align-self:end; margin:0; padding:10px 12px; border:1px solid #d7e5e2; border-radius:10px; background:#f8fcfb; color:var(--sea); font-size:12.5px; font-weight:800; }
.options { display:grid; grid-template-columns:repeat(2,1fr); gap:9px; }
.manual-equipment-price { display:grid; grid-template-columns:1fr 220px auto; gap:12px; align-items:end; margin:12px 0 16px; padding:12px; border:1px solid #d7e5e2; border-radius:13px; background:#fbfefd; }
.manual-equipment-price div { display:grid; gap:4px; }
.manual-equipment-price span { color:var(--muted); font-size:13px; font-weight:700; line-height:1.45; }
.manual-equipment-price b { color:var(--orange); }
.option { display:grid; grid-template-columns:auto 1fr auto; gap:9px; align-items:center; border:1px solid var(--line); padding:10px; border-radius:11px; cursor:pointer; background:#fff; }
.option:has(input:checked) { border-color:var(--sea); background:#effaf8; }.option.disabled { opacity:.52; cursor:not-allowed; background:#f3f5f6; }.option.disabled small::after { content:" · requires enclosed cabin"; }.option input { width:auto; min-height:0; }.option span { display:grid; gap:2px; }.option small { color:var(--muted); }
.gift-toggle { border:1px solid #d6e4e2; border-radius:999px; padding:5px 9px; background:#fff; color:var(--muted); font-size:12px; font-weight:900; cursor:pointer; white-space:nowrap; }
.gift-toggle:disabled { opacity:.42; cursor:not-allowed; }
.gift-toggle.active { border-color:var(--orange); background:#fff4ea; color:#b45309; }
.confirm-line { display:flex; align-items:center; gap:12px; margin-top:16px; }.secondary { border:1px solid var(--sea); border-radius:10px; padding:10px 16px; color:var(--sea); background:#effaf8; font-weight:800; cursor:pointer; }.secondary.confirmed { color:#fff; background:var(--sea); }.locked { opacity:.7; }.locked input,.locked select { pointer-events:none; }
.equipment-list { display:grid; gap:9px; margin-top:12px; }
.equipment-item { display:flex; justify-content:space-between; align-items:center; gap:14px; padding:11px 12px; border:1px solid #cfe2de; border-radius:12px; background:#f8fcfb; }
.equipment-item div { display:grid; gap:3px; min-width:0; }
.equipment-item span,.equipment-item small { color:var(--muted); font-size:12px; }
.equipment-item small { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:720px; }
.ghost { border:1px solid #ead1c0; border-radius:999px; padding:6px 10px; color:#a0471b; background:#fff8f2; font-weight:800; cursor:pointer; white-space:nowrap; }
.section-line { display:flex; justify-content:space-between; gap:20px; align-items:start; margin-bottom:12px; }.section-line.compact { margin:18px 0 10px; }.section-line h2 { margin-bottom:4px; }.section-line .hint { margin:0; }.accessory-filters { display:grid; grid-template-columns:220px 190px; gap:10px; }.category-label { min-width:0; }.catalog-count { margin:0 0 12px; color:var(--sea); font-size:13px; font-weight:700; }
.section-line.topless { margin-top:0; }
.packaging-settings { margin-top:14px; padding:14px; border:1px solid #d7e5e2; border-radius:13px; background:#fbfefd; }
.packaging-items { display:grid; gap:9px; }
.packaging-item { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:10px 11px; border:1px solid #d7e5e2; border-radius:12px; background:white; }
.packaging-item.gifted { border-color:#f2b36d; background:#fff8ef; }
.packaging-item div { display:grid; gap:3px; min-width:0; }
.packaging-item span { color:var(--muted); font-size:12px; }
.discount-inputs { margin-bottom:12px; }
.loading-page { display:grid; gap:16px; }
.loading-hero { display:flex; justify-content:space-between; align-items:center; gap:20px; background:linear-gradient(135deg,#ffffff,#eef8f6); }
.loading-hero h1 { margin:2px 0 0; font-size:30px; color:var(--ink); }
.loading-helper-card { border-color:#cfe2de; background:linear-gradient(180deg,#ffffff,#f8fcfb); }
.loading-open { text-decoration:none; text-align:center; white-space:nowrap; }
.loading-inputs { align-items:end; }
.loading-add { min-height:40px; }
.loading-items { display:grid; gap:9px; margin-top:13px; }
.loading-item { display:flex; justify-content:space-between; align-items:center; gap:14px; padding:11px 12px; border:1px solid #d7e5e2; border-radius:12px; background:white; }
.loading-item div { display:grid; gap:3px; min-width:0; }
.loading-item span { color:var(--muted); font-size:12px; }
.loading-results { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; margin-top:14px; }
.loading-result { padding:14px; border:1px solid #cfe2de; border-radius:14px; background:#f2faf8; }
.loading-result h3 { margin:0 0 10px; color:var(--ink); font-size:15px; }
.loading-result.over { border-color:#f3b5a3; background:#fff6f2; }
.loading-meter { height:10px; overflow:hidden; border-radius:999px; background:#dfe9e7; }
.loading-meter span { display:block; height:100%; border-radius:999px; background:linear-gradient(90deg,var(--sea),#24a494); }
.loading-result.over .loading-meter span { background:#dc5f45; }
.loading-usage { margin:9px 0 10px; color:var(--muted); font-size:13px; }
.loading-usage strong { color:var(--ink); }
.loading-over { margin:0; padding:10px 11px; border-radius:10px; color:#a13a28; background:#fff0ed; font-size:13px; font-weight:800; }
.loading-suggestions { display:grid; gap:6px; list-style:none; margin:0; padding:0; }
.loading-suggestions li { display:flex; justify-content:space-between; gap:10px; padding:7px 9px; border-radius:9px; background:white; color:var(--muted); font-size:12px; }
.loading-suggestions strong { color:var(--sea); }
.loading-results-shell { display:block; }
.loading-page .loading-results { align-items:start; }
.loading-page .loading-result { min-height:260px; }
.machine-parameters { margin-bottom:16px; padding:15px; border:1px solid #cfe2de; border-radius:14px; background:#f2faf8; }
.machine-parameter-item + .machine-parameter-item { margin-top:14px; padding-top:14px; border-top:1px dashed #b8d8d2; }
.machine-parameter-head { display:flex; justify-content:space-between; align-items:center; gap:18px; margin-bottom:12px; }
.machine-parameter-head h2 { margin:2px 0 0; }
.machine-parameter-head img { width:150px; height:105px; object-fit:contain; border-radius:10px; background:white; }
.machine-parameters ol { margin:0; padding-left:20px; columns:2; column-gap:36px; font-size:13px; line-height:1.55; }
.machine-parameters li { break-inside:avoid; margin:0 0 3px; }
.selected-accessories-block { margin-bottom:18px; }
.selected-accessories { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; margin-bottom:18px; }
.selected-accessory { display:grid; grid-template-columns:72px 1fr; gap:10px; align-items:center; padding:10px; border:1px solid var(--line); border-radius:12px; background:#fff; }
.selected-accessory img { width:72px; height:58px; object-fit:contain; border-radius:8px; background:#f8fbfa; }
.selected-accessory div { min-width:0; display:grid; gap:2px; }
.selected-accessory strong { color:var(--ink); font-size:13px; }
.selected-accessory span { color:var(--muted); font-size:12px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.selected-accessory small { color:var(--orange); font-weight:800; font-size:12px; }
.collapsible-catalog { margin-top:16px; border:1px solid #d7e5e2; border-radius:14px; background:#fbfefd; overflow:hidden; }
.collapsible-catalog summary { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:13px 14px; color:var(--sea); font-weight:900; cursor:pointer; list-style:none; }
.collapsible-catalog summary::-webkit-details-marker { display:none; }
.collapsible-catalog summary::after { content:"展开"; color:var(--muted); font-size:12px; }
.collapsible-catalog[open] summary::after { content:"收起"; }
.collapsible-catalog summary small { color:var(--muted); font-weight:600; }
.collapsible-catalog[open] { padding-bottom:14px; }
.collapsible-catalog[open] .section-line,.collapsible-catalog[open] .catalog-count,.collapsible-catalog[open] .accessories { margin-left:14px; margin-right:14px; }
.accessories { display:grid; grid-template-columns:repeat(2,1fr); gap:11px; }.accessory { position:relative; display:grid; grid-template-columns:92px 1fr; gap:10px; min-height:150px; padding:10px; border:1px solid var(--line); border-radius:13px; background:#fff; }.accessory.selected { border-color:var(--sea); background:#f0faf8; }.accessory.gifted,.selected-accessory.gifted { border-color:#f2b36d; background:#fff8ef; }.accessory.unavailable { opacity:.58; background:#f5f6f6; }.accessory img { width:92px; height:92px; object-fit:contain; border-radius:8px; background:white; }.accessory-main { min-width:0; display:flex; flex-direction:column; gap:4px; }.accessory-title { display:flex; align-items:start; gap:7px; color:var(--ink); font-weight:750; font-size:13px; }.accessory-title input { width:auto; min-height:0; margin-top:2px; }.accessory-en { color:var(--muted); font-size:12px; line-height:1.3; }.accessory-controls { margin-top:auto; display:flex; align-items:center; justify-content:space-between; gap:7px; flex-wrap:wrap; }.accessory-price { color:var(--orange); font-weight:800; }.accessory select { width:70px; min-height:34px; padding:5px 8px; }.accessory-spec { color:#6b7b83; font-size:11px; line-height:1.35; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.accessory-weight { color:var(--sea); font-size:11px; font-weight:700; }
.summary-panel { grid-column:2; grid-row:1 / span 5; position:sticky; top:14px; }
.preview { display:block; }
.machine { position:relative; height:230px; background:#f7faf9; border-radius:14px; overflow:hidden; margin-bottom:16px; padding:10px; }
.machine > img#product-image { position:absolute; inset:10px; width:calc(100% - 20px) !important; height:calc(100% - 20px) !important; max-width:none !important; max-height:none !important; object-fit:contain; object-position:center; display:block; }
.image-missing { display:flex; align-items:center; justify-content:center; min-width:120px; min-height:90px; border:1px dashed #bdd3d8; border-radius:16px; color:#6b7c86; background:#f5faf9; font-weight:700; }
.eyebrow { color:var(--sea); font-size:12px; font-weight:800; letter-spacing:1.2px; text-transform:uppercase; }
dl { margin:0; display:grid; gap:4px; } dl div { display:flex; justify-content:space-between; gap:12px; padding:7px 0; border-bottom:1px solid #edf1f2; } dt { color:var(--muted); } dd { margin:0; font-weight:750; text-align:right; }.total { font-size:19px; color:var(--orange); }
.rule { margin-top:18px; padding:10px 12px; border-radius:9px; background:#fff6ed; color:#9a4b1b; font-size:13px; }
.hint { margin:14px 0 0; color:var(--muted); font-size:13px; }
.freight-calculator { margin-top:14px; padding:14px; border:1px solid #cfe2de; border-radius:13px; background:#f2faf8; }.freight-breakdown { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-top:12px; }.freight-breakdown span { padding:9px; border-radius:9px; background:white; color:var(--muted); font-size:12px; }.freight-breakdown strong { display:block; margin-top:4px; color:var(--ink); font-size:14px; }.freight-warning { padding:10px 12px; margin:12px 0 0; border-radius:9px; color:#9a3412; background:#fff1e8; font-size:13px; font-weight:700; }
.primary { border:0; border-radius:13px; padding:15px 24px; background:var(--orange); color:white; font-size:17px; font-weight:800; cursor:pointer; box-shadow:0 8px 22px rgba(231,118,45,.24); }
.primary:disabled { opacity:.55; cursor:wait; }
#result { min-height:24px; }.success { background:#e9f8f2; color:#176849; padding:16px; border-radius:12px; }.success a { color:#0b5f59; font-weight:750; margin-right:18px; }.error { background:#fff0ed; color:#a13a28; padding:14px; border-radius:12px; }
.history { overflow:auto; }.history table { width:100%; border-collapse:collapse; font-size:13px; }.history th,.history td { padding:11px 10px; border-bottom:1px solid var(--line); text-align:left; white-space:nowrap; }.history th { color:var(--muted); font-size:12px; }.history a { color:var(--sea); font-weight:700; text-decoration:none; }.history-card h2 { margin-bottom:10px; }
.admin-panel { margin-top:16px; }
.admin-details { margin-top:14px; border:1px solid #d7e5e2; border-radius:14px; background:#fbfefd; overflow:hidden; }
.admin-details summary { padding:13px 14px; color:var(--sea); font-weight:900; cursor:pointer; list-style:none; border-bottom:1px solid #e4efed; }
.admin-details summary::-webkit-details-marker { display:none; }
.admin-details > *:not(summary) { margin:14px; }
.admin-inline-form { display:grid; grid-template-columns:repeat(5,1fr) auto; gap:10px; align-items:end; margin:14px; }
.inline-user-input { min-width:150px; min-height:34px; padding:6px 8px; border-radius:8px; }
.cost-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; max-height:420px; overflow:auto; padding-right:4px; }
.cost-save-line { display:flex; align-items:center; gap:12px; margin:14px; }
.cost-save-line .hint { margin:0; color:var(--sea); font-weight:800; }
.profit-filters,.history-filters { display:grid; grid-template-columns:2fr 1fr 1fr auto auto; gap:10px; align-items:end; margin:14px 0; }
.mini-action { border:1px solid #d7e5e2; border-radius:999px; padding:5px 10px; background:#fff; color:var(--sea); font-weight:850; cursor:pointer; }
.action-cell { display:flex; gap:8px; align-items:center; }
.accessory-price-table table { min-width:1120px; }
.accessory-price-table td:nth-child(4) { white-space:normal; min-width:280px; }
.accessory-price-table small { color:var(--muted); }
.price-input { width:130px; min-height:36px; padding:6px 8px; }
.positive-profit { color:#0f766e; font-weight:850; }
.negative-profit { color:#b42318; font-weight:850; }
.muted { color:var(--muted); }
.profit-inline-detail-row > td { padding:0 10px 18px; background:#f8fcfb; }
.profit-detail-card { margin-top:0; padding:14px; border:1px solid #d7e5e2; border-radius:14px; background:white; box-shadow:0 10px 24px rgba(15,76,88,.08); }
.profit-detail-card table { width:100%; border-collapse:collapse; margin-bottom:12px; }
.profit-detail-card th,.profit-detail-card td { padding:8px 10px; border-bottom:1px solid var(--line); text-align:left; }
.profit-lines ul { margin:8px 0 0; padding-left:18px; color:var(--muted); font-size:13px; line-height:1.5; }
.profit-lines table { width:100%; border-collapse:collapse; font-size:12.5px; }
.profit-lines th,.profit-lines td { padding:8px 9px; border-bottom:1px solid var(--line); text-align:left; vertical-align:top; }
.profit-lines small { color:var(--muted); font-size:11px; }
.profit-equipment-row { background:#f8fcfb; font-weight:850; }
.profit-child-row { background:#fffdf8; color:#50636d; }
.profit-child-row td:nth-child(2) { padding-left:28px; }
.login-body { min-height:100vh; display:grid; place-items:center; background:linear-gradient(135deg,#123e4a,#0f766e); }
.login-shell { width:min(440px,92vw); margin:0; }
.login-card { padding:28px; }
.login-brand { display:flex; align-items:baseline; gap:12px; margin-bottom:8px; color:var(--ink); }
.login-brand strong { font-size:32px; letter-spacing:3px; color:var(--sea); }
.login-brand span { font-size:18px; font-weight:850; }
.login-form { display:grid; grid-template-columns:1fr; gap:14px; margin-top:20px; }
.login-form label,.login-form input,.login-form button { width:100%; }
@media(max-width:1040px){
  .workflow { grid-template-columns:repeat(2,1fr); }
  form { grid-template-columns:1fr; }
  form > .card:not(.summary-panel), form > .primary, form > #result, form > .history-card, .summary-panel { grid-column:1; }
  .summary-panel { position:static; grid-row:auto; order:4; }
  .preview { display:grid; grid-template-columns:220px 1fr; gap:18px; }
  .machine { margin-bottom:0; height:190px; }
}
@media(max-width:900px){ .freight-breakdown,.loading-results{grid-template-columns:repeat(2,1fr)} }
@media(max-width:760px){
  header { align-items:start; padding:18px 16px; }
  header p{display:none}
  header strong { font-size:26px; }
  .header-actions{margin-left:auto}
  .top-tool-button{min-height:34px;padding:7px 10px;font-size:12px}
  main { width:calc(100vw - 20px); margin-top:10px; }
  .workflow { grid-template-columns:1fr 1fr; gap:8px; }
  .workflow div { padding:9px; grid-template-columns:28px 1fr; }
  .workflow span { width:26px; height:26px; font-size:12px; }
  .workflow small { display:none; }
  .card { padding:14px; border-radius:14px; }
  h2 { font-size:18px; margin-bottom:12px; }
  .grid.two,.grid.three,.options,.preview,.accessories,.selected-accessories,.freight-breakdown,.loading-results{grid-template-columns:1fr}
  .machine{height:190px}
  .section-line{display:grid}
  .accessory-filters{grid-template-columns:1fr}
  .confirm-line{align-items:start;flex-direction:column}
  .machine-parameter-head{align-items:start;display:grid}
  .machine-parameters ol{columns:1}
  .loading-hero{display:grid}
  .loading-open{width:100%}
  .profit-filters,.history-filters{grid-template-columns:1fr}
}

.portal-page main,.compare-page main { display:block; }
.portal-hero h1 { margin:0 0 10px; color:var(--ink); font-size:34px; }
.portal-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:18px; }
.portal-card { display:grid; gap:14px; min-height:260px; padding:24px; border:1px solid var(--line); border-radius:20px; background:#fff; text-decoration:none; color:var(--ink); box-shadow:0 12px 26px rgba(31,55,65,.08); transition:.18s ease; }
.portal-card:hover { transform:translateY(-2px); border-color:var(--sea); box-shadow:0 18px 32px rgba(31,55,65,.13); }
.portal-card h2 { margin:0; color:var(--sea); font-size:24px; }
.portal-card p { margin:0; color:var(--muted); line-height:1.65; }
.portal-card strong { align-self:end; color:var(--orange); }
.portal-index { width:48px; height:48px; display:grid; place-items:center; border-radius:14px; background:#eaf6f4; color:var(--sea); font-weight:900; }
.page-error { margin:12px; padding:14px; border-radius:12px; background:#fff0ed; color:#a13a28; }
.error-text { color:#a13a28; font-weight:800; }
.success-text { color:#176849; font-weight:800; }
.compare-page .freight-mini { margin-top:14px; }
.compare-keep-draft { display:flex; gap:12px; align-items:center; margin-top:14px; padding:12px 14px; border:1px solid #d7e7e4; border-radius:14px; color:#50636d; background:linear-gradient(180deg,#fbfefd,#f2faf8); font-weight:800; cursor:pointer; }
.compare-keep-draft input { position:absolute; opacity:0; width:1px; height:1px; min-height:0; padding:0; border:0; pointer-events:none; }
.compare-keep-draft > span:last-child { display:grid; gap:3px; min-width:0; }
.compare-keep-draft strong { color:#123e4a; font-size:13px; }
.compare-keep-draft small { color:#687984; font-size:12px; font-weight:650; line-height:1.45; }
.compare-keep-switch { position:relative; flex:0 0 auto; width:44px; height:24px; border-radius:999px; background:#cfdcda; box-shadow:inset 0 0 0 1px #bccdca; transition:.16s ease; }
.compare-keep-switch::after { content:""; position:absolute; top:3px; left:3px; width:18px; height:18px; border-radius:50%; background:white; box-shadow:0 2px 6px rgba(31,55,65,.18); transition:.16s ease; }
.compare-keep-draft:has(input:checked) { border-color:#b8d8d2; background:linear-gradient(180deg,#f7fffd,#eefaf8); }
.compare-keep-draft:has(input:checked) .compare-keep-switch { background:var(--sea); box-shadow:inset 0 0 0 1px rgba(15,118,110,.18); }
.compare-keep-draft:has(input:checked) .compare-keep-switch::after { transform:translateX(20px); }
.compare-list { display:grid; gap:12px; }
.compare-items-empty { padding:18px; border:1px dashed #c9d9d6; border-radius:14px; color:var(--muted); background:#fbfefd; }
.compare-list-item { display:grid; grid-template-columns:150px 1fr auto; gap:14px; align-items:center; padding:12px; border:1px solid var(--line); border-radius:14px; background:#fff; }
.compare-item-actions { display:flex; gap:8px; align-items:center; flex-wrap:wrap; justify-content:flex-end; }
.compare-list-item img { width:150px; height:110px; object-fit:contain; border-radius:10px; background:#f7faf9; }
.compare-list-item h3 { margin:0 0 6px; color:var(--sea); }
.compare-list-item p { margin:4px 0; color:var(--ink); }
.compare-list-item small { display:block; margin-top:6px; color:var(--muted); line-height:1.45; }
.compare-config-line { line-height:1.55; color:#415762 !important; }
.compare-config-line strong { color:#123e4a; }
.compare-page textarea { width:100%; resize:vertical; }
.compare-actions { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.compare-actions-bottom { justify-content:flex-end; margin-top:16px; padding-top:14px; border-top:1px solid #eef4f3; }
.compare-page main { width:min(1240px,94vw); }
.compare-page .card { border-color:#d4e4e1; box-shadow:0 14px 34px rgba(25,61,72,.07); }
.compare-page .card:hover { box-shadow:0 16px 38px rgba(25,61,72,.10); }
.compare-page .card > .section-line:first-child { padding-bottom:10px; border-bottom:1px solid #eef4f3; }
.compare-page .section-line h2 { color:#123e4a; }
.compare-page .primary { min-height:44px; padding:12px 20px; border-radius:999px; }
.compare-page .secondary { min-height:42px; border-radius:999px; }
.compare-page #compareDraftHint { padding:10px 12px; border-radius:11px; background:#f7fbfa; border:1px solid #e2eeeb; }
.compare-page .options { grid-template-columns:repeat(3,1fr); }
.compare-page .option { min-height:58px; transition:.15s ease; }
.compare-page .option:hover { border-color:#b8d8d2; transform:translateY(-1px); }
.compare-page .compare-list-item { border-color:#d4e4e1; box-shadow:0 8px 20px rgba(25,61,72,.04); }
.compare-page .compare-list-item h3 { font-size:15px; color:#123e4a; }
.compare-page .compare-list-item small { padding:8px 10px; border-radius:10px; background:#f7fbfa; color:#50636d; font-weight:700; }
.compare-page .compare-list-item p:last-of-type { padding:9px 10px; border-radius:10px; background:#fff8f2; color:#8a3a13; font-weight:800; }
.compare-preview { margin-top:18px; padding:16px; border:1px solid #cfe2de; border-radius:16px; background:#f7fbfa; }
.compare-preview h3 { margin:0 0 8px; color:var(--sea); }
.compare-preview-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; margin-top:14px; }
.compare-preview-card { padding:13px; border:1px solid var(--line); border-radius:14px; background:#fff; }
.compare-preview-card img { width:100%; height:150px; object-fit:contain; border-radius:10px; background:#fafafa; }
.compare-preview-card h4 { margin:10px 0; color:var(--sea); }
.compare-preview-card ol { margin:0; padding-left:20px; color:var(--ink); font-size:13px; line-height:1.55; }
.compare-preview-card p { margin:8px 0 0; font-size:13px; line-height:1.5; }
.compare-preview-card .red-line { color:#d32f2f; font-weight:850; }
.preview-reason { padding:9px; border-radius:10px; background:#f3f8fa; color:var(--muted); }
.commercial-page main { width:min(1320px,94vw); }
.commercial-page .card { margin-bottom:16px; }
.commercial-filters { grid-template-columns:2fr 1fr 1fr 1fr auto; }
.commercial-edit-block { position:relative; margin:16px 0; padding:16px; border:1px solid #d7e5e2; border-radius:16px; background:#fbfefd; box-shadow:0 8px 20px rgba(25,61,72,.035); }
.commercial-edit-block::before { content:""; position:absolute; left:0; top:14px; bottom:14px; width:5px; border-radius:0 999px 999px 0; background:var(--sea); }
.commercial-edit-block h3 { display:flex; align-items:center; gap:8px; margin:0 0 14px; color:#123e4a; font-size:16px; font-weight:900; }
.commercial-edit-block h3::before { content:""; width:9px; height:9px; border-radius:50%; background:var(--sea); }
.commercial-edit-basic { background:#f8fcfb; }
.commercial-edit-buyer { background:#fffaf4; border-color:#f0d5bf; }
.commercial-edit-buyer::before,.commercial-edit-buyer h3::before { background:#e7762d; }
.commercial-edit-shipment { background:#f3f8fb; border-color:#cfe0e8; }
.commercial-edit-shipment::before,.commercial-edit-shipment h3::before { background:#2f6f92; }
.commercial-edit-lines { background:#f9fbff; border-color:#d3ddeb; }
.commercial-edit-lines::before,.commercial-edit-lines h3::before { background:#355c9a; }
.commercial-edit-logistics { background:#f7fbf7; border-color:#d3e5d1; }
.commercial-edit-logistics::before,.commercial-edit-logistics h3::before { background:#4d8b45; }
.commercial-edit-block label {
  display:block;
  padding:10px 11px 11px;
  border:1px solid #d6e4e2;
  border-radius:14px;
  background:#edf6f4;
  color:#0f4754;
  font-size:12px;
  font-weight:900;
  letter-spacing:.01em;
}
.commercial-edit-block input,
.commercial-edit-block select,
.commercial-edit-block textarea {
  margin-top:7px;
  border-radius:12px;
  background:#ffffff;
  color:#122b3a;
  font-size:14px;
  font-weight:750;
}
.commercial-edit-basic label { background:#eef8f6; border-color:#d5e8e5; }
.commercial-edit-buyer label { background:#fff2e8; border-color:#efcfb5; color:#8a3a13; }
.commercial-edit-buyer input,.commercial-edit-buyer textarea { border-color:#e8c5aa; background:#ffffff; }
.commercial-edit-shipment label { background:#eef7fb; border-color:#c9dce6; color:#24546f; }
.commercial-edit-shipment input,.commercial-edit-shipment select { border-color:#c9dce6; background:#ffffff; }
.commercial-edit-lines label { background:#f1f5ff; border-color:#d3ddeb; color:#274a7d; }
.commercial-edit-lines input,.commercial-edit-lines textarea { border-color:#cbd6ea; background:#ffffff; }
.commercial-edit-logistics label { background:#f1f8ef; border-color:#d3e5d1; color:#356a30; }
.commercial-edit-logistics input { border-color:#cbdcc8; background:#ffffff; }
.commercial-line-actions { display:flex; align-items:center; gap:12px; margin:6px 0 12px; }
.commercial-lines { display:grid; gap:12px; }
.commercial-line { padding:14px; border:1px solid #d3ddeb; border-radius:14px; background:#ffffff; box-shadow:0 6px 16px rgba(25,61,72,.035); }
.commercial-line-head { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:10px; }
.commercial-line-head strong { display:inline-flex; align-items:center; min-height:28px; padding:4px 10px; border-radius:999px; color:#ffffff; background:#355c9a; }
.commercial-line textarea { min-height:72px; resize:vertical; }
.commercial-generate-line { display:flex; align-items:center; justify-content:space-between; gap:14px; margin:14px 0 2px; padding:14px; border:1px solid #f0d5bf; border-radius:14px; background:#fff8f2; }
.commercial-generate-line .primary { min-width:180px; border-radius:999px; }
.commercial-page #commercialResult { flex:1; min-width:0; }
.commercial-page #commercialResult .success,.commercial-page #commercialResult .error { padding:11px 13px; }
.status-dialog p { margin:0; line-height:1.55; }
.commercial-preview-dialog { width:min(1180px,94vw); max-width:94vw; }
.commercial-preview-dialog form { width:100%; max-height:90vh; display:flex; flex-direction:column; overflow:hidden; }
.commercial-preview-dialog h3 { margin-bottom:10px; }
.commercial-preview-dialog .dialog-actions { position:sticky; bottom:0; margin:0 -4px -4px; padding:12px 4px 4px; background:#ffffff; border-top:1px solid #edf3f2; }
.commercial-preview-confirm { flex:1; min-height:0; overflow:auto; display:grid; gap:14px; margin:6px 0 0; padding:4px 4px 12px; color:#173142; }
.preview-topline { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.preview-topline div,
.preview-sections section {
  padding:13px;
  border:1px solid #d7e5e2;
  border-radius:14px;
  background:#f8fcfb;
}
.preview-topline span,
.preview-sections span { display:block; color:#6b7d86; font-size:12px; font-weight:900; }
.preview-topline strong { display:block; margin-top:5px; color:#123e4a; font-size:17px; }
.preview-topline .preview-total { background:#fff6ef; border-color:#efcfb5; }
.preview-topline .preview-total strong { color:#c84a22; font-size:20px; }
.preview-sections { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.preview-sections h4,
.preview-lines h4 { margin:0 0 9px; color:#0f4754; font-size:15px; }
.preview-sections p { display:grid; grid-template-columns:86px 1fr; gap:8px; margin:7px 0 0; line-height:1.45; }
.preview-sections p span { font-size:12px; }
.preview-sections p strong { min-width:0; overflow-wrap:anywhere; color:#173142; font-size:13px; }
.preview-lines { padding:13px; border:1px solid #d7e5e2; border-radius:14px; background:#ffffff; }
.preview-lines table { width:100%; border-collapse:collapse; font-size:13px; }
.preview-lines th { padding:9px; background:#eaf3f5; color:#0f4754; text-align:left; }
.preview-lines td { padding:9px; border-top:1px solid #e4eeec; vertical-align:top; }
.preview-lines td:nth-child(3),
.preview-lines td:nth-child(4) { max-width:240px; overflow-wrap:anywhere; }
.commercial-preview-confirm > .hint { margin:0; padding:10px 12px; border-radius:12px; background:#fff8f2; color:#8a3a13; font-weight:800; }
.ci-detail-row td { padding:0 16px 16px !important; background:#f8fcfb; }
.ci-diff-box { margin:0; padding:12px 14px; border:1px solid #d7e5e2; border-radius:14px; background:#ffffff; color:#173142; }
.ci-diff-box ul { margin:8px 0 0; padding-left:20px; line-height:1.55; }
@media(max-width:1040px){
  .portal-grid { grid-template-columns:repeat(2,1fr); }
}
@media(max-width:760px){
  .portal-grid { grid-template-columns:1fr; }
  .commercial-filters { grid-template-columns:1fr; }
  .compare-list-item { grid-template-columns:1fr; }
  .compare-list-item img { width:100%; }
  .compare-preview-grid { grid-template-columns:1fr; }
  .commercial-generate-line { display:grid; }
}

.pi-page main { width:min(1240px,94vw); }
.pi-page header { background:linear-gradient(120deg,#0f4754,#123e4a); border-bottom:5px solid #e9822e; }
.pi-page .workflow { gap:12px; margin-bottom:18px; }
.pi-page .workflow div {
  border-color:#d4e4e1;
  border-radius:18px;
  background:linear-gradient(180deg,#ffffff,#f8fcfb);
  box-shadow:0 12px 28px rgba(25,61,72,.06);
}
.pi-page .workflow span { background:#0f4754; box-shadow:0 5px 12px rgba(15,71,84,.18); }
.pi-page .workflow strong { color:#123e4a; font-size:14px; }
.pi-page .workflow small { color:#6f8590; font-weight:700; }
.pi-page .card {
  border-color:#d4e4e1;
  border-radius:18px;
  box-shadow:0 14px 34px rgba(25,61,72,.07);
}
.pi-page .card:hover { box-shadow:0 16px 38px rgba(25,61,72,.10); }
.pi-page .card > h2,
.pi-page .section-line h2 { color:#123e4a; }
.pi-page .card > h2 {
  padding-bottom:10px;
  border-bottom:1px solid #eef4f3;
}
.pi-page label { color:#415762; }
.pi-page input,
.pi-page select,
.pi-page textarea {
  border-color:#cbd8dd;
  border-radius:12px;
  background:#ffffff;
}
.pi-page input:focus,
.pi-page select:focus,
.pi-page textarea:focus {
  outline:3px solid rgba(15,71,84,.13);
  border-color:#0f4754;
}
.pi-page .secondary,
.pi-page .ghost,
.pi-page .top-tool-button,
.pi-page .gift-toggle,
.pi-page .mini-action { border-radius:999px; }
.pi-page .secondary {
  min-height:42px;
  border-color:#0f4754;
  color:#0f4754;
  background:#eef6f7;
}
.pi-page .secondary:hover { background:#e5f1f2; }
.pi-page .primary {
  min-height:48px;
  border-radius:999px;
  background:#e9822e;
  box-shadow:0 12px 26px rgba(233,130,46,.24);
}
.pi-page .primary:hover { background:#dc7626; }
.pi-page .options { gap:10px; }
.pi-page .option {
  min-height:58px;
  border-color:#d4e4e1;
  transition:.15s ease;
}
.pi-page .option:hover { border-color:#b8d8d2; transform:translateY(-1px); }
.pi-page .option:has(input:checked) {
  border-color:#0f4754;
  background:#eef6f7;
}
.pi-page .equipment-item,
.pi-page .packaging-item,
.pi-page .selected-accessory,
.pi-page .accessory {
  border-color:#d4e4e1;
  box-shadow:0 8px 20px rgba(25,61,72,.04);
}
.pi-page .equipment-item { background:#fbfefd; }
.pi-page .machine-parameters,
.pi-page .freight-calculator,
.pi-page .packaging-settings,
.pi-page .collapsible-catalog {
  border-color:#d4e4e1;
  background:#f7fbfa;
}
.pi-page .collapsible-catalog summary { color:#0f4754; }
.pi-page .summary-panel {
  border-color:#bfd4dc;
  background:linear-gradient(180deg,#ffffff,#f8fcfb);
}
.pi-page .summary-panel .machine { background:#f3f8fa; }
.pi-page .summary-panel dl div { border-bottom-color:#e4eef1; }
.pi-page .summary-panel .total { color:#c53d2d; }
.pi-page .rule { background:#fff6f0; color:#8a3a13; font-weight:750; }
.pi-page .freight-breakdown span,
.pi-page .auto-country,
.pi-page #compareDraftHint {
  border-color:#e2eeeb;
  background:#ffffff;
}
.pi-page .history table,
.pi-page .profit-lines table,
.pi-page .profit-detail-card table { background:#ffffff; }
.pi-page .admin-details {
  border-color:#d4e4e1;
  background:#fbfefd;
}
.pi-page .admin-details summary {
  color:#0f4754;
  background:#f7fbfa;
}
.pi-page #generate {
  width:100%;
  justify-content:center;
}
.pi-page .option-choice { display:flex; align-items:center; gap:8px; flex:1; min-width:180px; }
.pi-page .option-choice input { width:auto; min-height:0; }
.pi-page .option-price-edit { display:flex; align-items:center; gap:6px; margin:0; font-size:12px; color:#5e717a; }
.pi-page .option-price-edit input { width:92px; min-height:32px; padding:6px 8px; }
.pi-page .inline-price {
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:8px;
  font-size:12px;
  color:#5e717a;
}
.pi-page .inline-price input {
  width:120px;
  min-height:34px;
  padding:7px 9px;
}
.pi-page .packaging-item {
  grid-template-columns:minmax(0,1fr) auto auto;
  align-items:center;
}
.pi-page .history-filters,
.pi-page .profit-filters {
  grid-template-columns:2fr 1fr 1fr 1fr auto auto;
}
@media(max-width:900px){
  .pi-page .history-filters,
  .pi-page .profit-filters { grid-template-columns:1fr; }
}

.spec-page main { width:min(1320px,94vw); display:block; }
.spec-page .card { margin-bottom:16px; border-color:#d4e4e1; box-shadow:0 14px 34px rgba(25,61,72,.07); }
.spec-page .card > .section-line:first-child { padding-bottom:10px; border-bottom:1px solid #eef4f3; }
.spec-page .section-line h2 { color:#123e4a; }
.spec-page .primary { min-height:44px; padding:12px 22px; border-radius:999px; }
.spec-page .secondary { min-height:42px; border-radius:999px; }
.spec-page .options { grid-template-columns:repeat(3,1fr); }
.spec-page .option { min-height:58px; }
.spec-page .option:hover { border-color:#b8d8d2; transform:translateY(-1px); }
.spec-library-editor { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.spec-library-model { padding:14px; border:1px solid #d4e4e1; border-radius:16px; background:linear-gradient(180deg,#ffffff,#f8fcfb); }
.spec-library-model h3 { margin:0 0 12px; color:#0f4754; font-size:16px; }
.spec-library-model label { margin-bottom:10px; }
.spec-library-model textarea { min-height:90px; resize:vertical; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:12px; line-height:1.45; }
.spec-page .compare-list-item { border-color:#d4e4e1; box-shadow:0 8px 20px rgba(25,61,72,.04); }
.spec-page .compare-list-item h3 { font-size:15px; color:#123e4a; }
.spec-page .compare-list-item small { padding:8px 10px; border-radius:10px; background:#f7fbfa; color:#50636d; font-weight:700; }
@media(max-width:900px){
  .spec-page .options,
  .spec-library-editor { grid-template-columns:1fr; }
}