:root{
  --bg:#FFF6E8;--deep-bg:#F5E4C4;--content:#FFFFFF;--sub:#F8EAD0;--title:#4A2208;--text:#4A2C14;
  --muted:#8A5A28;--aux:#B07A40;--yellow:#E8B020;--light-yellow:#F3C84A;--dark-yellow:#B88610;
  --red:#D43A2A;--light-red:#E85A3A;--dark-red:#9A2418;--cream:#FFF8EC;--border:rgba(212,58,42,.16);
  --focus:rgba(232,176,32,.50);--shadow:0 12px 28px rgba(74,34,8,.08);--max:1120px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:hidden}
body{margin:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;font-size:15px;line-height:1.7;overflow-x:hidden}
body.locked{overflow:hidden}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
button,input{font:inherit}
button{cursor:pointer}
.skip-link{position:fixed;left:12px;top:-80px;z-index:100;background:var(--cream);color:var(--title);padding:10px 14px;border-radius:8px}.skip-link:focus{top:8px}
.fruit-line{position:fixed;left:0;right:0;top:0;height:22px;background:var(--dark-red);color:var(--cream);z-index:50;font-size:12px}
.top-inner,.bar-inner,.short-inner{width:min(var(--max),calc(100% - 32px));height:100%;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:12px}
.top-brand{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.text-button{border:0;background:transparent;color:var(--cream);min-width:44px;height:22px;padding:0 6px}
.mango-bar{position:fixed;left:0;right:0;top:22px;height:60px;background:var(--content);border-bottom:1px solid var(--focus);z-index:49}
.brand-link,.app-link,.drawer-button{min-height:44px;display:inline-flex;align-items:center;justify-content:center}
.brand-link{min-width:132px;justify-content:flex-start}.brand-logo{height:28px;width:auto;object-fit:contain}.brand-text{font-size:16px;font-weight:800;color:var(--title)}
.drawer-button{border:1px solid var(--border);background:var(--cream);color:var(--title);border-radius:10px;min-width:84px;font-weight:700}
.app-link{padding:0 15px;border-radius:10px;background:linear-gradient(135deg,#F3C84A 0%,#E8B020 40%,#D43A2A 100%);color:var(--title);font-weight:800;white-space:nowrap}
.short-sign{position:fixed;left:0;right:0;top:82px;height:40px;background:var(--cream);border-bottom:1px solid var(--focus);z-index:48;font-size:13px}
.short-inner{justify-content:center;gap:12px}.short-sign a{height:28px;padding:2px 16px;border-radius:999px;display:flex;align-items:center}.short-sign a.active{background:var(--red);color:var(--cream)}
.site-main{padding:146px 16px 48px;min-height:70vh}
.container{width:min(var(--max),100%);margin:0 auto}
.page-hero{background:linear-gradient(135deg,var(--cream),var(--content));border:1px solid var(--border);border-radius:14px;padding:28px;box-shadow:var(--shadow);margin-bottom:22px}
.eyebrow{font-size:12px;letter-spacing:.08em;color:var(--red);font-weight:800;text-transform:uppercase}.page-hero h1,.cover-copy h1{font-size:24px;line-height:1.3;color:var(--title);margin:6px 0 12px}.page-hero p,.cover-copy p{margin:0;color:var(--muted)}
h2{font-size:20px;line-height:1.35;color:var(--title);margin:0 0 12px}h3{font-size:16px;line-height:1.4;color:var(--title);margin:0 0 8px}p{margin:0 0 12px}.lead{font-size:16px;color:var(--text)}
.cover{width:min(var(--max),100%);margin:0 auto 28px}.media-slot{width:100%;height:200px;background:var(--cream);border:1px solid var(--border);border-radius:14px;display:flex;align-items:center;justify-content:center;overflow:hidden}.media-slot img{width:100%;height:100%;object-fit:contain;object-position:center}.banner-slot{height:260px}.card-slot{height:180px}.app-slot{height:360px}.icon-slot{width:64px;height:64px;border-radius:14px}
.cover-copy{padding:20px 4px 0}.cover-copy p{max-width:820px}.button-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}.btn{min-height:42px;padding:0 18px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;font-size:14px;font-weight:800;white-space:nowrap}.btn-primary{background:linear-gradient(135deg,#F3C84A 0%,#E8B020 40%,#D43A2A 100%);color:var(--title)}.btn-secondary{background:#fff;border:1px solid var(--red);color:var(--title)}
.section{width:min(var(--max),100%);margin:0 auto 26px}.section-head{display:flex;align-items:end;justify-content:space-between;gap:16px;margin-bottom:12px}.section-head p{margin:0;color:var(--muted);max-width:700px}
.grid-3,.grid-2,.grid-4{display:grid;gap:16px}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-2{grid-template-columns:repeat(2,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}
.card,.article-card,.shelf-item,.faq-item,.note-card{background:var(--content);border:1px solid var(--border);border-radius:12px;padding:18px;box-shadow:var(--shadow)}.card .media-slot{margin-bottom:14px}.card p,.article-card p,.note-card p{color:var(--text)}
.number-card{position:relative;padding-top:52px}.number-badge{position:absolute;left:18px;top:16px;font-size:22px;line-height:1;font-weight:900;color:var(--red)}
.feature-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:18px;align-items:stretch}.feature-copy{background:var(--content);border:1px solid var(--border);border-radius:14px;padding:22px}
.shelf{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.shelf-item{min-height:150px}.shelf-item span{display:inline-flex;background:var(--sub);color:var(--red);font-weight:800;font-size:12px;padding:3px 8px;border-radius:999px;margin-bottom:10px}
.rank-list{display:grid;gap:10px}.rank-item{display:grid;grid-template-columns:64px 1fr;gap:14px;align-items:start;background:var(--content);border:1px solid var(--border);border-radius:12px;padding:16px}.rank-no{font-size:28px;font-weight:900;color:var(--red);line-height:1}
.timeline{position:relative;display:grid;gap:12px;padding-left:28px}.timeline:before{content:"";position:absolute;left:9px;top:6px;bottom:6px;width:2px;background:var(--focus)}.time-item{position:relative;background:var(--content);border:1px solid var(--border);border-radius:12px;padding:16px}.time-item:before{content:"";position:absolute;left:-25px;top:22px;width:10px;height:10px;border-radius:50%;background:var(--red);border:3px solid var(--cream)}.status{display:inline-block;font-size:12px;font-weight:800;color:var(--title);background:var(--light-yellow);padding:2px 8px;border-radius:999px;margin-bottom:8px}
.article-stack{display:grid;gap:14px}.spaced-top{margin-top:16px}.shelf-gap-top{margin-top:14px}.article-card h2{margin-bottom:8px}.article-card ul{margin:8px 0 0;padding-left:20px}.article-card li{margin:4px 0}.article-card .mini-link{display:inline-flex;margin-top:4px;color:var(--red);font-weight:800}
.meta-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}.tag{font-size:12px;background:var(--sub);color:var(--muted);padding:4px 9px;border-radius:999px}
.app-panel{display:grid;grid-template-columns:320px 1fr;gap:22px;align-items:start;background:var(--content);border:1px solid var(--border);border-radius:14px;padding:20px}.app-badge{display:flex;gap:12px;align-items:center;margin-bottom:14px}.app-badge strong{font-size:18px;color:var(--title)}
.notice{background:var(--sub);border-left:4px solid var(--red);padding:14px 16px;border-radius:10px;color:var(--title)}
.faq-list{display:grid;gap:12px}.faq-item h2{font-size:16px}.faq-item p{margin:0}
.site-footer{background:#3A1808;color:var(--cream);border-top:1px solid var(--yellow);padding:28px 16px calc(62px + env(safe-area-inset-bottom))}.footer-inner{width:min(var(--max),100%);margin:auto;display:grid;grid-template-columns:1.25fr 2fr;gap:30px}.footer-brand p{font-size:13px;color:#F5E4C4}.footer-brand-row{display:flex;align-items:center;gap:10px;margin-bottom:12px}.footer-logo{height:28px;width:auto;object-fit:contain}.footer-brand-row strong{display:block}.footer-brand-row span{display:block;font-size:12px;color:#F5E4C4}.footer-links{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.footer-links h2{font-size:13px;color:var(--light-yellow);margin-bottom:8px}.footer-links a{display:block;font-size:13px;color:var(--cream);padding:2px 0}.footer-bottom{width:min(var(--max),100%);margin:22px auto 0;padding-top:14px;border-top:1px solid rgba(255,246,232,.18);font-size:13px;color:#F5E4C4}
.overlay{position:fixed;inset:0;background:rgba(58,24,8,.38);z-index:70;opacity:0;visibility:hidden;pointer-events:none;transition:.2s}.overlay.active{opacity:1;visibility:visible;pointer-events:auto}
.mango-drawer{position:fixed;top:0;right:0;bottom:0;width:400px;max-width:86vw;background:var(--cream);z-index:80;transform:translateX(102%);visibility:hidden;pointer-events:none;transition:.25s;box-shadow:-16px 0 40px rgba(58,24,8,.15)}.mango-drawer.open{transform:translateX(0);visibility:visible;pointer-events:auto}.drawer-head{height:68px;display:flex;align-items:center;justify-content:space-between;padding:0 16px;border-bottom:1px solid var(--focus);background:#fff}.drawer-brand{display:flex;align-items:center;gap:10px}.drawer-brand img{height:28px;width:auto;object-fit:contain}.close-button,.search-head button{min-width:64px;min-height:44px;border:1px solid var(--red);border-radius:10px;background:#fff;color:var(--title)}.drawer-scroll{height:calc(100% - 68px);overflow-y:auto;padding:16px}.drawer-group{margin-bottom:18px}.drawer-group h2{font-size:14px;color:var(--red);margin-bottom:8px}.drawer-group a{display:block;padding:11px 12px;border-radius:10px;border:1px solid transparent}.drawer-group a:hover,.drawer-group a:focus-visible{background:#fff;border-color:var(--border)}.drawer-group strong{display:block}.drawer-group span{display:block;font-size:12px;color:var(--muted);margin-top:2px}
.search-layer{position:fixed;top:82px;left:0;right:0;z-index:79;visibility:hidden;pointer-events:none;opacity:0;transition:.2s}.search-layer.open{visibility:visible;pointer-events:auto;opacity:1}.search-card{width:min(760px,calc(100% - 32px));margin:0 auto;background:#fff;border:1px solid var(--focus);border-radius:0 0 14px 14px;padding:18px;box-shadow:var(--shadow)}.search-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.search-head h2{font-size:18px}.search-card label{display:block;margin:6px 0 8px;color:var(--muted)}.search-card input{width:100%;min-height:44px;border:1px solid var(--border);border-radius:10px;padding:0 12px;color:var(--title);background:var(--cream);outline:none}.preset-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.preset-list a{min-height:40px;display:inline-flex;align-items:center;padding:0 13px;border-radius:10px;background:var(--sub);color:var(--title);font-weight:700}
.mobile-bottom{display:none}
a:hover{color:var(--red)}a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
@media (max-width:820px){
  .short-sign{display:none}.site-main{padding-top:106px;padding-bottom:34px}.grid-3,.grid-4{grid-template-columns:1fr 1fr}.feature-row,.app-panel,.footer-inner{grid-template-columns:1fr}.shelf{grid-template-columns:1fr 1fr}.app-panel{gap:16px}.footer-links{grid-template-columns:1fr 1fr}.site-footer{padding-bottom:calc(72px + env(safe-area-inset-bottom))}
  .mobile-bottom{position:fixed;left:0;right:0;bottom:0;height:calc(48px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);display:grid;grid-template-columns:repeat(5,1fr);background:#fff;border-top:1px solid var(--focus);z-index:60}.mobile-bottom a{display:flex;align-items:center;justify-content:center;min-height:48px;font-size:12px;font-weight:700;color:var(--title)}.mobile-bottom a.active{background:var(--red);color:var(--cream)}
  .search-layer{top:0;bottom:0;background:var(--dark-red)}.search-card{width:100%;height:100%;border:0;border-radius:0;background:var(--dark-red);color:var(--cream);padding:22px 16px}.search-head h2,.search-card label{color:var(--cream)}.search-head button{background:var(--cream)}.search-card input{background:var(--cream);border-color:var(--cream)}.preset-list a{background:var(--cream)}
}
@media (max-width:560px){
  .top-inner,.bar-inner{width:calc(100% - 24px)}.bar-inner{gap:8px}.brand-link{min-width:0;max-width:36%}.brand-logo{max-width:118px}.brand-text{font-size:15px}.drawer-button{min-width:72px}.app-link{padding:0 10px}.page-hero{padding:20px}.grid-3,.grid-2,.grid-4,.shelf{grid-template-columns:1fr}.banner-slot{height:260px}.card-slot{height:180px}.feature-row{grid-template-columns:1fr}.rank-item{grid-template-columns:50px 1fr}.section-head{display:block}.section-head p{margin-top:5px}.footer-links{grid-template-columns:1fr 1fr}.site-main{padding-left:16px;padding-right:16px}
}
