:root{--orange:#ff6b00;--orange-hover:#f57c20;--ink:#242424;--muted:#646464;--line:#e5ded8;--soft:#fff0e3}
body{background:#faf7f4;color:var(--ink)}
button{background:var(--orange);color:#211a14;min-height:44px;border-radius:10px;font-weight:750;transition:background .15s,box-shadow .15s}
button:hover{filter:none;background:var(--orange-hover)}
button:disabled{cursor:default}
button.light{background:#f0ece8;color:var(--ink)}
button.light:hover{background:#e6dfd9}
button.danger{background:#a22c25;color:white}
button.yellow{background:var(--orange);color:#211a14}
button.yellow:hover{background:var(--orange-hover)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #a84100;outline-offset:3px}
input,select,textarea{color:var(--ink);border-color:#bdb4ac;font-size:16px;border-radius:9px;min-width:0}
input[type=checkbox]{accent-color:#b84900;width:19px;height:19px;flex:none}
header{background:#222;color:white;border-bottom:4px solid var(--orange);padding:16px max(5vw,20px);gap:24px}
.brand-home{padding:8px;border-radius:12px}
.brand-home img{width:96px}
header nav{gap:10px;max-width:none}
header nav a,header nav button{display:inline-flex;justify-content:center;align-items:center;gap:7px;padding:12px 16px;min-height:46px;border:1px solid #666;border-radius:10px;font-size:14px;font-weight:650;line-height:1.3;text-align:center;text-decoration:none}
header nav a{background:#303030;color:white;transition:background .15s,border-color .15s}
header nav a:hover{background:#454545;border-color:#aaa}
header nav a[aria-current=page]{background:var(--orange);border-color:var(--orange);color:#211a14;font-weight:800}
header nav a:focus-visible,header nav button:focus-visible{outline-color:#fff}
header nav #cartButton{background:var(--orange);border-color:var(--orange);color:#211a14;font-weight:800}
header nav #cartButton:hover{background:#ff8a36}
nav b{background:#fff;min-width:25px;min-height:25px;margin:0;color:var(--ink);font-size:13px}
main{padding-top:30px}
.hero{padding:32px 36px;border-radius:20px;background:var(--orange);color:#211a14;gap:30px;margin-bottom:24px}
.hero h1{font-size:clamp(30px,3.7vw,48px);line-height:1.12;letter-spacing:-1.4px}
.hero .eyebrow,.hero .muted{color:#34251b}
.hero .muted{max-width:580px}
.hero .badge{background:#fff7ee;border:1px solid #ffd0aa;padding:24px;border-radius:14px;min-width:238px;box-shadow:0 6px 24px #6d290010}
.badge strong{font-size:28px;margin:6px 0}
.badge small{display:block;color:#5b4b3e}
.eyebrow,.brand{color:#91400c}
.muted,.codes,.unit,th,footer{color:var(--muted)}
.filters{border-color:var(--line);padding:24px;border-radius:16px;box-shadow:0 4px 18px #41230c08;gap:16px}
.filters>label{min-width:0}
.filters .check{min-height:46px;padding-bottom:0;gap:9px;cursor:pointer}
.filters .check input{margin:0}
.results{margin:22px 0 16px}
.results #count{font-weight:700;color:#45403c}
.card{border-color:var(--line);border-radius:16px;box-shadow:0 2px 8px #32221304;transition:border-color .15s,box-shadow .15s}
.card:hover{border-color:#eea975;box-shadow:0 6px 20px #6d29000c}
.image{border-bottom-color:#f1ece8}
.placeholder{color:#77716c}
.placeholder strong{color:#d5cbc2}
.card .brand{font-size:11px;letter-spacing:.7px}
.card h3{font-size:15px}
.price{color:#242424;font-size:25px;letter-spacing:-.5px}
.unit,.codes{font-size:12px}
.add input{min-height:44px}
.panel,.account-order{border-color:var(--line);border-radius:16px}
.tabs .active{background:var(--orange);color:#211a14}
th,td{border-bottom-color:var(--line)}
.status{background:var(--soft);color:#853500}
.info{background:var(--soft);border-left-color:var(--orange);border-radius:0 8px 8px 0}
.warning{background:#fff3d7;border-left-color:#a86800}
dialog{color:var(--ink);border-radius:18px;box-shadow:0 24px 80px #0003}
dialog::backdrop{background:#171717b8}
.close{background:transparent;color:#333;min-width:44px;min-height:44px}
.close:hover{background:#f2ece7}
#notice{background:#262626;border-left:4px solid var(--orange)}
.empty{color:var(--muted)}
footer{background:#fff;border-top:3px solid var(--orange);padding-top:24px}
footer b{color:var(--ink)}
.brand-footer img{width:108px}
.text-button{color:#91400c;background:transparent}
.text-button:hover{background:var(--soft)}
.account-action{background:var(--orange);color:#211a14;min-height:44px;border-radius:10px}
.account-action:hover{background:var(--orange-hover)}
.hero .account-action{background:#242424;color:white}
.account-order:hover{background:#fff5ed;border-color:#eca26a}
.account-order small,.account-note{color:var(--muted)}
.account-note{border-top-color:var(--line)}
.catalog-modes .selected{background:#242424;color:white}
.catalog-modes a{background:var(--orange);border-color:var(--orange);color:#211a14}
.book-heading{padding:24px 28px;background:var(--orange);border-radius:18px}
.book-heading .eyebrow,.book-heading .muted{color:#34251b}
.book-heading h1{margin-top:10px}
.mode-link{display:inline-flex;align-items:center;justify-content:center;min-height:44px;background:#242424;color:white;border:0;padding:12px 16px;border-radius:10px;white-space:nowrap}
.book-price-note{background:#fff1e4;border-color:#f0c8a6;color:#52301b}
.book-controls,.book-aside,.book-search-results{border-color:var(--line);border-radius:14px}
.book-paper-panel{background:#e8e3de;border-color:#d6cfc8}
.book-help,.book-aside-heading,.book-manual{background:#fff6ee;color:#64412a;border-color:var(--line)}
.book-item,.book-match{border-color:var(--line)}
.book-coverage-note{color:var(--muted)}
.code-key{background:#ff9c3d44;border-color:#ba5100}
.book-hotspot{background:#ff980024;border-color:#aa460065;min-height:0;border-radius:2px}
.book-hotspot:hover,.book-hotspot:focus-visible{background:#ff980066;border-color:#8f3e00}
.book-product-header .eyebrow{color:#91400c}
@media(max-width:1100px){
  header nav a,header nav button{padding:11px 12px;font-size:13px}
  .hero{padding:28px}
  .filters{gap:16px}
}
@media(max-width:750px){
  header{display:grid;grid-template-columns:88px minmax(0,1fr);padding:14px 16px;gap:16px;align-items:center}
  .brand-home{padding:7px;border-radius:10px}
  .brand-home img{width:74px}
  header nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;width:100%;max-width:none;min-width:0}
  header nav a,header nav button{width:100%;padding:10px 7px;font-size:12px;min-height:44px;border-radius:8px}
  nav b{min-width:22px;min-height:22px;font-size:12px}
  main{padding:22px 15px 40px}
  .hero{padding:24px 22px;border-radius:16px;display:block}
  .hero h1{font-size:34px;letter-spacing:-1px}
  .hero p{font-size:14px}
  .hero .badge{display:block;min-width:0;padding:12px 16px;margin-top:20px;box-shadow:none;border-radius:10px}
  .hero .badge .eyebrow{display:none}
  .hero .badge strong{font-size:20px;margin:0 0 3px}
  .hero .badge small{font-size:12px}
  .hero .badge br{display:none}
  .filters{grid-template-columns:repeat(2,minmax(0,1fr));padding:18px 16px;gap:15px 12px}
  .filters>label:first-child,.filters .check{grid-column:1/-1}
  .filters .check{min-height:32px}
  .filters label{font-size:13px}
  .filters select{padding-right:6px}
  .card{border-radius:12px}
  .card h3{font-size:13px}
  .price{font-size:22px}
  .add input{width:48px;font-size:16px}
  .add button{padding:9px 6px;font-size:12px}
  .results{font-size:13px}
  .book-heading{padding:22px 20px}
  .book-heading h1{font-size:30px}
  .mode-link{white-space:normal;font-size:13px}
  .book-controls{padding:14px 10px}
  .book-pager button{padding:10px}
  .book-manual input{font-size:16px}
  .brand-footer img{width:94px}
  footer span{max-width:230px}
}
@media(max-width:380px){
  header{grid-template-columns:72px minmax(0,1fr);gap:10px;padding:12px}
  .brand-home img{width:58px}
  header nav a,header nav button{font-size:11px;padding:9px 5px}
  .hero h1{font-size:30px}
  .add{gap:6px}
  .add input{width:44px}
}
@media(max-width:480px){
  .hero{padding:20px}
  .hero h1{font-size:30px}
  .hero .badge{display:none}
  .filters{grid-template-columns:minmax(0,1fr)}
}
@media(prefers-reduced-motion:reduce){button,header nav a,.card{transition:none}}
@media print{header,footer{display:none}.hero{background:white;color:black;box-shadow:none}body{background:white}.panel{box-shadow:none}}
