:root { --ink:#20201d; --paper:#f4f0e9; --muted:#77736b; --line:rgba(32,32,29,.18); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; min-height:100vh; color:var(--ink); background:var(--paper); font-family:"Microsoft YaHei",sans-serif; font-weight:300; }
a { color:inherit; text-decoration:none; }
button,input { font:inherit; }
.page-header { height:88px; padding:0 4.2vw; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); }
.logo { display:inline-flex; flex-direction:column; line-height:1; }
.logo span { font-size:29px; font-weight:500; letter-spacing:.2em; }
.logo small { margin-top:7px; font-family:serif; font-size:9px; letter-spacing:.58em; }
.page-nav { display:flex; gap:30px; align-items:center; font-size:11px; letter-spacing:.12em; }
.page-nav a { padding-bottom:5px; border-bottom:1px solid transparent; }
.page-nav a:hover { border-color:currentColor; }
.auth-layout { min-height:calc(100vh - 88px); display:grid; grid-template-columns:1.05fr .95fr; }
.auth-visual { position:relative; overflow:hidden; min-height:680px; }
.auth-visual img { width:100%; height:100%; object-fit:cover; display:block; }
.auth-visual::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(0,0,0,.35),transparent 45%); }
.visual-copy { position:absolute; z-index:2; left:7vw; bottom:7vw; color:white; }
.visual-copy p,.eyebrow { margin:0 0 16px; font-size:9px; letter-spacing:.23em; }
.visual-copy h2 { margin:0; font-family:serif; font-weight:400; font-size:clamp(35px,4vw,60px); line-height:1.35; letter-spacing:.08em; }
.auth-panel { display:flex; align-items:center; justify-content:center; padding:70px 8vw; }
.auth-box { width:100%; max-width:420px; }
.eyebrow { color:var(--muted); margin-bottom:20px; }
.auth-box h1,.cart-title h1 { margin:0; font-family:serif; font-size:clamp(36px,4vw,54px); font-weight:400; letter-spacing:.08em; }
.auth-intro { margin:20px 0 42px; color:var(--muted); font-family:serif; font-size:13px; line-height:1.9; }
.field { display:block; margin-bottom:24px; }
.field span { display:block; margin-bottom:9px; font-size:10px; letter-spacing:.12em; }
.field input { width:100%; padding:14px 0; border:0; border-bottom:1px solid var(--line); border-radius:0; outline:0; background:transparent; color:var(--ink); font-size:13px; }
.field input:focus { border-color:var(--ink); }
.form-row { display:flex; justify-content:space-between; align-items:center; margin:-4px 0 32px; color:var(--muted); font-size:10px; }
.checkbox { display:flex; align-items:center; gap:8px; }
.checkbox input { accent-color:var(--ink); }
.primary-button { width:100%; padding:16px 20px; border:1px solid var(--ink); background:var(--ink); color:white; cursor:pointer; font-size:11px; letter-spacing:.15em; transition:.25s; }
.primary-button:hover { background:#4b463f; }
.primary-button:disabled { opacity:.45; cursor:not-allowed; }
.switch-auth { margin:26px 0 0; text-align:center; color:var(--muted); font-size:11px; }
.switch-auth a { margin-left:8px; color:var(--ink); border-bottom:1px solid var(--ink); }
.auth-message { min-height:18px; margin:18px 0 0; color:#755047; text-align:center; font-size:11px; }
.cart-main { padding:85px 6vw 120px; min-height:calc(100vh - 88px); }
.cart-title { display:flex; align-items:end; justify-content:space-between; margin-bottom:55px; }
.cart-title p { margin:0 0 8px; color:var(--muted); font-size:10px; letter-spacing:.14em; }
.cart-layout { display:grid; grid-template-columns:minmax(0,1.8fr) minmax(310px,.7fr); gap:7vw; align-items:start; }
.cart-list { border-top:1px solid var(--line); }
.cart-item { display:grid; grid-template-columns:150px minmax(0,1fr) auto; gap:26px; padding:25px 0; border-bottom:1px solid var(--line); align-items:center; }
.cart-thumb { width:150px; aspect-ratio:1; background-image:url("assets/product-grid.png"); background-repeat:no-repeat; background-size:400% 300%; }
.cart-item h2 { margin:0 0 10px; font-family:serif; font-size:16px; font-weight:400; letter-spacing:.06em; }
.cart-detail { margin:0 0 24px; color:var(--muted); font-size:10px; letter-spacing:.08em; }
.quantity-control { display:inline-grid; grid-template-columns:34px 38px 34px; height:34px; border:1px solid var(--line); }
.quantity-control button { border:0; background:transparent; cursor:pointer; font-size:15px; }
.quantity-control span { display:grid; place-items:center; font-size:11px; }
.item-end { align-self:stretch; display:flex; flex-direction:column; justify-content:space-between; align-items:flex-end; }
.item-price { font-size:12px; }
.remove-item { padding:0; border:0; border-bottom:1px solid var(--muted); background:transparent; color:var(--muted); cursor:pointer; font-size:9px; letter-spacing:.12em; }
.cart-summary { position:sticky; top:30px; padding:35px; background:#e9e3da; }
.cart-summary h2 { margin:0 0 30px; font-family:serif; font-size:24px; font-weight:400; letter-spacing:.08em; }
.summary-line { display:flex; justify-content:space-between; margin:16px 0; font-size:11px; }
.summary-total { margin-top:28px; padding-top:24px; border-top:1px solid var(--line); font-size:15px; }
.summary-note { margin:22px 0; color:var(--muted); font-size:9px; line-height:1.8; }
.empty-cart { padding:100px 20px; text-align:center; border-bottom:1px solid var(--line); }
.empty-cart h2 { margin:0 0 14px; font-family:serif; font-size:25px; font-weight:400; }
.empty-cart p { margin:0 0 30px; color:var(--muted); font-size:12px; }
.empty-cart a { display:inline-block; padding:14px 25px; background:var(--ink); color:white; font-size:10px; letter-spacing:.14em; }
.cart-toast {
  position:fixed; z-index:100; top:24px; right:24px; width:min(360px,calc(100vw - 32px)); padding:19px 48px 19px 20px;
  background:var(--ink); color:white; box-shadow:0 14px 45px rgba(0,0,0,.2); opacity:0; transform:translateY(-16px);
  pointer-events:none; transition:opacity .3s ease,transform .3s ease;
}
.cart-toast.is-visible { opacity:1; transform:none; }
.cart-toast strong { display:block; margin-bottom:7px; font-family:serif; font-size:13px; font-weight:400; letter-spacing:.08em; }
.cart-toast span { color:#cfc9c0; font-size:9px; letter-spacing:.1em; }
.cart-toast::after { content:"✓"; position:absolute; top:20px; right:20px; font-size:16px; }
.product-01{background-position:0 0}.product-02{background-position:33.333% 0}.product-03{background-position:66.666% 0}.product-04{background-position:100% 0}
.product-05{background-position:0 50%}.product-06{background-position:33.333% 50%}.product-07{background-position:66.666% 50%}.product-08{background-position:100% 50%}
.product-09{background-position:0 100%}.product-10{background-position:33.333% 100%}.product-11{background-position:66.666% 100%}.product-12{background-position:100% 100%}
@media(max-width:800px){
  .page-header{height:74px;padding:0 5vw}.logo span{font-size:25px}.page-nav{gap:15px}.page-nav .hide-mobile{display:none}
  .auth-layout{min-height:calc(100vh - 74px);grid-template-columns:1fr}.auth-visual{min-height:330px;height:42vh}.visual-copy{left:7vw;bottom:9vw}.auth-panel{padding:65px 7vw 90px}
  .cart-main{padding:60px 5vw 90px}.cart-title{align-items:flex-start;flex-direction:column;gap:18px}.cart-layout{grid-template-columns:1fr}
  .cart-item{grid-template-columns:100px minmax(0,1fr);gap:17px}.cart-thumb{width:100px}.item-end{grid-column:2;flex-direction:row-reverse;align-items:center}.cart-summary{position:static}
  .cart-toast{top:auto;right:16px;bottom:16px}
}