*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
body{font-family:"Noto Sans SC",system-ui,sans-serif;background:#fff;color:#1a2e35;line-height:1.78;font-size:16px}
a{color:#0d9488;text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto;display:block}

.site-header{background:#fff;border-bottom:1px solid #ccfbf1;position:sticky;top:0;z-index:200;box-shadow:0 1px 0 rgba(13,148,136,.05)}
.header-inner{max-width:1180px;margin:0 auto;padding:12px 20px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{display:flex;align-items:center;gap:10px;color:#111;font-weight:600;font-size:.98rem}
.brand em{font-style:normal;color:#0d9488;font-weight:700}
.site-nav ul{display:flex;flex-wrap:wrap;gap:6px 18px;list-style:none}
.site-nav a{color:#444;font-size:.92rem}
.site-nav a.active{color:#0d9488;font-weight:600}
.nav-toggle{display:none;background:none;border:0;cursor:pointer;padding:8px}
.nav-toggle span{display:block;width:22px;height:2px;background:#333;margin:5px 0;border-radius:1px}

.ads-top-bar{background:#f0fdfa;border-bottom:1px solid #99f6e4;padding:10px 0}
#applist .applist-title{font-size:.85rem;color:#0f766e;margin-bottom:8px}
#ads{display:flex;flex-wrap:wrap;gap:12px}

.page-wrap{max-width:1180px;margin:0 auto;padding:0 20px 56px}

.play-hero{position:relative;background:linear-gradient(128deg,#ecfdf5 0%,#fff 38%,#fff7ed 100%);border:1px solid #a7f3d0;border-radius:20px;padding:34px 30px 28px;margin:26px 0 20px;overflow:hidden}
.play-hero::after{content:"";position:absolute;bottom:-30%;left:-5%;width:220px;height:220px;background:radial-gradient(circle,rgba(251,146,60,.12) 0%,transparent 68%);pointer-events:none}
.play-hero h1{font-size:clamp(1.36rem,3.6vw,1.95rem);line-height:1.32;margin-bottom:14px;color:#111;position:relative;max-width:820px}
.play-badge{display:inline-block;font-size:.81rem;color:#0f766e;background:#ccfbf1;padding:5px 13px;border-radius:999px;margin-bottom:12px;font-weight:500}
.play-lede{font-size:1.01rem;color:#444;max-width:760px;position:relative}
.play-lede+.play-lede{margin-top:10px}

.tag-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.tag-row span{font-size:.77rem;padding:4px 11px;border-radius:5px;background:#fff;border:1px solid #fde68a;color:#b45309}

.jump-links{display:flex;flex-wrap:wrap;gap:9px;margin:20px 0 8px;padding:0;list-style:none}
.jump-links a{display:inline-block;font-size:.83rem;padding:6px 15px;border-radius:8px;color:#0f766e;background:#f0fdfa;border:1px solid #99f6e4;transition:background .15s}
.jump-links a:hover{background:#ccfbf1;text-decoration:none}

.bento-play{display:grid;grid-template-columns:repeat(12,1fr);gap:16px;margin:24px 0}
.bento-cell{background:#fff;border:1px solid #d1fae5;border-radius:16px;padding:22px 24px;box-shadow:0 2px 6px rgba(13,148,136,.04);transition:box-shadow .18s,transform .18s}
.bento-cell:hover{box-shadow:0 5px 18px rgba(13,148,136,.09);transform:translateY(-1px)}
.bento-cell h2{font-size:1.08rem;margin-bottom:10px;color:#111;line-height:1.36}
.bento-cell p{margin-bottom:10px;color:#444;font-size:.95rem}
.bento-cell p:last-child{margin-bottom:0}
.bento-cell figure{margin:0}
.bento-cell figcaption{font-size:.79rem;color:#64748b;margin-top:8px;text-align:center}

.bc-7{grid-column:span 7}
.bc-5{grid-column:span 5}
.bc-8{grid-column:span 8}
.bc-4{grid-column:span 4}
.bc-6{grid-column:span 6}
.bc-12{grid-column:span 12}
.bc-stretch{align-self:stretch;display:flex;flex-direction:column;justify-content:center}

.bc-accent{background:linear-gradient(140deg,#f0fdfa 0%,#fff 55%);border-color:#5eead4}
.bc-warm{background:#fffbeb;border-color:#fcd34d}
.bc-warm:hover{box-shadow:0 4px 14px rgba(245,158,11,.07)}

.stat-pill{display:inline-flex;align-items:center;gap:6px;font-size:.83rem;color:#0f766e;background:#ecfdf5;padding:5px 12px;border-radius:7px;margin:6px 0 8px;font-weight:500}
.stat-pill::before{content:"";width:6px;height:6px;border-radius:50%;background:#14b8a6}

.check-list{list-style:none;padding:0;margin:10px 0}
.check-list li{position:relative;padding:6px 0 6px 20px;border-bottom:1px dotted #d1fae5;font-size:.93rem;color:#444}
.check-list li:last-child{border-bottom:0}
.check-list li::before{content:"";position:absolute;left:3px;top:13px;width:5px;height:5px;border-radius:50%;background:#2dd4bf}

.callout{background:#f8fafc;border-left:4px solid #14b8a6;padding:13px 16px;margin:12px 0;border-radius:0 10px 10px 0;font-size:.92rem;color:#444}

.faq-zone{margin-top:34px;padding-top:28px;border-top:2px solid #ccfbf1}
.faq-zone>h2{font-size:1.14rem;margin-bottom:16px;color:#111}
.faq-card{border:1px solid #d1fae5;border-radius:13px;padding:17px 20px;margin-bottom:12px;background:#fff}
.faq-card h3{font-size:.98rem;margin-bottom:7px;color:#111}

.more-read{padding:24px 0 8px}
.more-read h2{font-size:1.04rem;margin-bottom:10px}
.more-read ul{padding-left:1.2rem;line-height:1.88;color:#444}

.site-footer{background:#f0fdfa;border-top:1px solid #99f6e4;padding:26px 20px;text-align:center;font-size:.87rem;color:#64748b}
.footer-links{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 20px;margin-bottom:10px}
.footer-sub{font-size:.81rem;color:#94a3b8;margin-top:6px}
.prose-page{max-width:720px;margin:40px auto;padding:0 20px}
.prose-page h1{font-size:1.38rem;margin-bottom:16px}

@media(max-width:920px){
  .bc-7,.bc-5,.bc-8,.bc-4,.bc-6,.bc-12{grid-column:span 12}
}

@media(max-width:768px){
  .nav-toggle{display:block}
  .site-nav{position:absolute;top:100%;left:0;right:0;background:#fff;border-bottom:1px solid #ccfbf1;display:none;padding:12px 20px;box-shadow:0 4px 12px rgba(0,0,0,.05)}
  .site-nav.is-open{display:block}
  .site-header{position:relative}
  .play-hero{padding:24px 16px}
  .bento-cell{padding:16px 14px}
}