:root{
  --bg:#dfe4ea;
  --shell:#f6f1e8;
  --paper:#fffdf8;
  --line:#ddd3c6;
  --text:#4d4036;
  --muted:#7d6f62;
  --brown:#5a4533;
  --brown-dark:#443224;
  --accent:#8d2e27;
  --accent-soft:#efe5d8;
  --shadow:0 18px 36px rgba(58,40,22,.16);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,"Microsoft YaHei","PingFang SC",Arial,sans-serif;
  background:radial-gradient(circle at top left,rgba(255,255,255,.42),transparent 36%),linear-gradient(180deg,#e9edf1,#dfe4ea);
  color:var(--text);
}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button,input,select,textarea{font:inherit}
.mobile-stage{min-height:100vh;padding:24px 12px 48px;display:flex;justify-content:center}
.phone-shell{width:min(100%,414px);background:var(--shell);border:1px solid rgba(92,72,55,.1);box-shadow:var(--shadow);border-radius:28px;overflow:hidden}
.mobile-page{min-height:100vh;background:linear-gradient(180deg,rgba(255,255,255,.34),transparent 220px),var(--shell)}
.mobile-page::before{content:"";display:block;width:72px;height:5px;margin:10px auto 6px;border-radius:999px;background:rgba(71,54,40,.18)}
.mobile-container{padding:0 16px}
.mobile-topbar{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:8px 16px 0;font-size:11px;color:var(--muted)}
.brand-mini{min-width:0}
.mini-en{font-size:10px;letter-spacing:.08em}
.mini-main{font-size:24px;line-height:1;font-weight:700;color:#26170e;margin-top:3px}
.mini-note{font-size:10px;line-height:1.35;margin-top:4px}
.lang-mini{display:flex;gap:6px;flex-wrap:nowrap}
.lang-mini button{border:1px solid #cdbdac;background:#fff8ee;color:#6e5e50;border-radius:999px;padding:0 9px;height:30px;font-size:11px;cursor:pointer}
.lang-mini button.active{background:var(--accent);border-color:var(--accent);color:#fff}
.search-strip{padding:10px 16px 0}
.search-box{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}
.search-box input{width:100%;min-width:0;height:38px;border:1px solid #ccbba9;background:#fff;border-radius:12px;padding:0 12px}
.search-btn{display:inline-flex;align-items:center;justify-content:center;min-width:74px;padding:0 14px;height:38px;border-radius:12px;background:var(--accent);color:#fff}
.mobile-nav{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:12px 16px 0}
.mobile-nav a{min-height:48px;border-radius:14px;background:var(--brown);color:#fff;font-size:10px;display:flex;align-items:center;justify-content:center;text-align:center;line-height:1.25;padding:8px 4px}
.mobile-nav a.active{background:var(--brown-dark)}
.hero-card,.section-card,.page-card,.cta-card,.cart-summary,.confirm-card,.order-card{background:var(--paper);border:1px solid var(--line);box-shadow:0 6px 20px rgba(64,42,24,.06)}
.hero-card{margin:14px 16px 0;padding:18px;border-radius:20px;background:linear-gradient(135deg,rgba(141,46,39,.08),rgba(91,69,51,.02)),var(--paper)}
.hero-label{font-size:11px;color:#8e7a6a;letter-spacing:.08em}
.hero-title{font-size:30px;line-height:1.05;color:#26170e;margin-top:6px;font-weight:700}
.hero-copy{font-size:12px;color:#655649;margin:10px 0 14px;line-height:1.7}
.hero-actions{display:flex;gap:8px;flex-wrap:wrap}
.hero-actions .btn{flex:1 1 140px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:0 14px;border-radius:12px;border:1px solid rgba(0,0,0,.08);font-size:12px;white-space:nowrap}
.btn.red{background:var(--accent);color:#fff}
.btn.brown{background:var(--brown);color:#fff}
.btn.ghost{background:var(--accent-soft);color:#5e4e40}
.btn.outline{background:transparent;color:var(--accent);border-color:#cfae97}
.btn.full{width:100%}
.section{padding:16px}
.section-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.section-title{font-size:16px;color:#4f3e2f;font-weight:700}
.section-link{font-size:11px;color:#2f63a8}
.recommend-grid,.category-list,.article-list,.related-list,.order-list{display:grid;gap:10px}
.product-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.product-card,.article-item,.category-item,.related-item,.cart-item{background:var(--paper);border:1px solid var(--line);border-radius:18px;overflow:hidden}
.product-card{display:flex;flex-direction:column}
.thumb,.article-thumb,.detail-photo,.recommend-thumb,.cart-thumb{position:relative;overflow:hidden;background:linear-gradient(135deg,#8b6f54,#c6ac88 50%,#5b4733)}
.thumb,.article-thumb,.recommend-thumb{height:112px}
.thumb::before,.article-thumb::before,.detail-photo::before,.recommend-thumb::before,.cart-thumb::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.2),transparent 38%,rgba(0,0,0,.08))}
.product-body,.article-body,.cart-body{padding:12px}
.tag{display:inline-flex;padding:4px 8px;border-radius:999px;background:#f4e7da;color:#7f5f49;font-size:10px;margin-bottom:8px}
.product-name,.article-title,.related-title{font-size:14px;color:#4a3a2c;line-height:1.45;margin:0 0 6px}
.product-copy,.article-copy,.related-copy,.meta-copy{font-size:11px;color:#726255;line-height:1.6}
.price{font-size:18px;color:var(--accent);font-weight:700;margin-top:8px}
.card-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:0 12px 12px}
.guide-card{display:grid;grid-template-columns:88px minmax(0,1fr);border-radius:20px;overflow:hidden}
.guide-label{display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#a5392f,#882521);color:#fff;font-size:16px;line-height:1.35;letter-spacing:.08em;text-align:center;padding:14px 8px}
.guide-body{padding:14px}
.breadcrumb{font-size:11px;color:#7a6b60;padding:14px 16px 0}
.breadcrumb a{color:#67584c}
.breadcrumb span{margin:0 5px;color:#aa998d}
.page-card{margin:10px 16px 0;border-radius:20px;padding:16px}
.page-title{font-size:24px;line-height:1.2;color:#332117;margin:0}
.page-summary{font-size:12px;color:#706054;line-height:1.7;margin:8px 0 0}
.filter-row{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:12px}
.filter-chip{padding:10px 12px;border-radius:14px;background:#f3ebdf;border:1px solid #dccdbf;font-size:11px;color:#6c5b4d}
.article-item,.related-item{display:grid;grid-template-columns:96px minmax(0,1fr)}
.article-info,.related-info{padding:12px}
.date-line{font-size:10px;color:#95877a;margin-bottom:5px}
.article-full p{font-size:13px;line-height:1.8;color:#53453a;margin:0 0 14px}
.article-full h2{font-size:16px;color:#4e3b2b;margin:18px 0 8px}
.detail-photo{height:220px;border-radius:18px}
.detail-name{font-size:24px;line-height:1.2;color:#342216;margin:14px 0 8px}
.detail-copy{font-size:12px;color:#6c5b4d;line-height:1.7}
.detail-price{font-size:24px;color:var(--accent);font-weight:700;margin:12px 0}
.detail-form{display:grid;gap:10px;margin-top:12px}
.field label{display:block;font-size:11px;color:#6d5d4f;margin-bottom:6px}
.field select,.field input,.field textarea{width:100%;border:1px solid #d5c6b8;border-radius:12px;background:#fff;padding:11px 12px}
.qty-box{display:inline-flex;align-items:center;border:1px solid #d6c7b8;border-radius:12px;overflow:hidden;background:#fff}
.qty-btn{width:34px;height:34px;border:0;background:#f2e8dc;color:#5c4c40}
.qty-value{min-width:40px;text-align:center;font-size:13px}
.cart-item{display:grid;grid-template-columns:84px minmax(0,1fr)}
.cart-thumb{height:100%}
.cart-meta{display:grid;gap:6px}
.mini-line{display:flex;justify-content:space-between;gap:8px;font-size:11px;color:#6e5e51}
.cart-summary,.order-card,.confirm-card{margin:12px 16px 0;padding:16px;border-radius:20px}
.summary-line{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-top:1px solid #e5d9cd;font-size:12px}
.summary-line:first-child{border-top:0;padding-top:0}
.summary-line.total{font-size:16px;color:var(--accent);font-weight:700}
.stack-actions{display:grid;gap:8px;margin-top:14px}
.success{padding:16px;border-radius:18px;background:linear-gradient(180deg,#fff7ee,#f4eadc);border:1px solid #dccbbb}
.success-title{font-size:22px;color:#452f21;margin:0}
.success-copy{font-size:12px;color:#675649;line-height:1.7;margin:8px 0 0}
.footer-note{padding:18px 16px 24px;text-align:center;font-size:11px;color:#8a7d71}
@media (max-width:460px){
  .mobile-stage{padding:0}
  .phone-shell{width:100%;border-radius:0;border:0;box-shadow:none}
  .mobile-page::before{display:none}
}

.login-mobile-card,
.login-mobile-form,
.login-mobile-links{
  background:linear-gradient(180deg,#fff8f0 0%,#f4e8da 100%);
  border:1px solid #dccbbb;
}

.login-mobile-note{
  display:inline-flex;
  align-items:center;
  padding:7px 12px;
  border-radius:999px;
  background:#efe2d2;
  color:#7b5f4d;
  font-size:11px;
  line-height:1.5;
}

.login-mobile-services{
  margin-top:14px;
  padding:14px;
  border-radius:18px;
  background:#fcf7f0;
  border:1px solid #e4d6c8;
}

.login-mobile-benefits{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  margin-top:12px;
}

.login-mobile-benefit{
  padding:10px 12px;
  border-radius:14px;
  background:#f1e5d8;
  color:#5f4b3f;
  font-size:11px;
  line-height:1.6;
  border:1px solid #e1d2c4;
}

.login-mobile-form{
  display:grid;
  gap:12px;
}

.login-mobile-form .field input{
  height:44px;
}

.login-mobile-remember{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:12px;
  color:#604d40;
}

.login-mobile-links .stack-actions{
  margin-top:12px;
}

.login-mobile-register{
  margin-top:14px;
  padding:14px;
  border-radius:16px;
  background:#fcf7f0;
  border:1px dashed #d9c8ba;
}

.section-title.small{
  font-size:15px;
}