
:root{
  --s5-bg:#f4f1e8;
  --s5-panel:#fffdf7;
  --s5-ink:#173f3a;
  --s5-muted:#65746f;
  --s5-line:#dfe4df;
  --s5-accent:#1f625a;
  --s5-accent-soft:#e8f1ee;
  --s5-warm:#f1e7d3;
  --s5-shadow:0 10px 30px rgba(31,98,90,.08);
  --s5-radius:24px;
}
html,body{background:var(--s5-bg)!important;color:var(--s5-ink)!important}
body{font-family:Inter,ui-rounded,"SF Pro Rounded","Avenir Next",system-ui,-apple-system,sans-serif!important}
button,a,input{font:inherit}
a{color:inherit}
.s5-unified-topbar{
  position:sticky;top:0;z-index:9998;display:flex;align-items:center;gap:12px;
  min-height:66px;padding:10px clamp(14px,3vw,28px);
  background:rgba(255,253,247,.96);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--s5-line)
}
.s5-unified-brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:900;letter-spacing:.4px}
.s5-unified-mark{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:var(--s5-accent);color:#fff}
.s5-unified-spacer{flex:1}
.s5-unified-nav{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.s5-unified-nav a{
  text-decoration:none;padding:9px 12px;border-radius:12px;border:1px solid var(--s5-line);
  background:#fff;color:var(--s5-ink);font-weight:800;font-size:14px
}
.s5-unified-nav a:hover,.s5-unified-nav a:focus-visible{background:var(--s5-accent-soft)}
.s5-unified-shell{width:min(1120px,calc(100% - 28px));margin:0 auto;padding:28px 0 44px}
.s5-unified-hero{
  background:linear-gradient(145deg,#fffdf7,#f0f5f2);border:1px solid var(--s5-line);
  border-radius:30px;padding:clamp(24px,5vw,48px);box-shadow:var(--s5-shadow)
}
.s5-unified-eyebrow{font-size:12px;font-weight:900;letter-spacing:1.2px;color:var(--s5-accent);text-transform:uppercase}
.s5-unified-hero h1{font-size:clamp(32px,6vw,58px);line-height:1.02;margin:8px 0 12px;color:var(--s5-ink)}
.s5-unified-hero p{font-size:clamp(16px,2vw,19px);line-height:1.55;color:var(--s5-muted);max-width:760px;margin:0}
.s5-unified-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:18px}
.s5-unified-card{
  display:block;text-decoration:none;background:var(--s5-panel);border:1px solid var(--s5-line);
  border-radius:24px;padding:20px;box-shadow:0 4px 16px rgba(31,98,90,.04);
  transition:.16s transform,.16s box-shadow,.16s border-color
}
.s5-unified-card:hover,.s5-unified-card:focus-visible{transform:translateY(-2px);box-shadow:var(--s5-shadow);border-color:#b9cdc7}
.s5-unified-card .kicker{font-size:12px;font-weight:900;letter-spacing:.9px;color:var(--s5-accent)}
.s5-unified-card h2,.s5-unified-card h3{margin:8px 0 6px;color:var(--s5-ink)}
.s5-unified-card p{margin:0;color:var(--s5-muted);line-height:1.45}
.s5-unified-folder{
  margin-top:16px;background:var(--s5-panel);border:1px solid var(--s5-line);border-radius:24px;overflow:hidden
}
.s5-unified-folder summary{
  list-style:none;cursor:pointer;padding:18px 20px;font-weight:900;font-size:18px;display:flex;align-items:center;gap:10px
}
.s5-unified-folder summary::-webkit-details-marker{display:none}
.s5-unified-folder summary::after{content:"＋";margin-left:auto;font-size:24px;font-weight:500}
.s5-unified-folder[open] summary::after{content:"−"}
.s5-unified-folder .inside{padding:0 16px 16px}
.s5-unified-badge{display:inline-flex;padding:5px 9px;border-radius:999px;background:var(--s5-accent-soft);color:var(--s5-accent);font-size:12px;font-weight:900}
.s5-unified-footer{padding:22px 14px 32px;text-align:center;color:var(--s5-muted);font-size:13px}
body.s5-unified-page .topbar,body.s5-unified-page header.topbar{display:none!important}
body.s5-unified-page .screen{background:transparent!important}
body.s5-unified-page .panel,
body.s5-unified-page .mission-card,
body.s5-unified-page .quick-card,
body.s5-unified-page .game-card,
body.s5-unified-page .badge-card,
body.s5-unified-page .flash-card{
  border-radius:24px!important;
  border-color:var(--s5-line)!important;
  box-shadow:none!important
}
body.s5-unified-page .mission-card{
  background:var(--s5-panel)!important;color:var(--s5-ink)!important;border:1px solid var(--s5-line)!important
}
body.s5-unified-page .mission-card p,
body.s5-unified-page .mission-meta span{color:var(--s5-muted)!important}
body.s5-unified-page .mission-meta span{background:var(--s5-accent-soft)!important;border-color:transparent!important}
body.s5-unified-page .start-btn,
body.s5-unified-page .primary-btn{
  background:var(--s5-accent)!important;color:#fff!important;border-radius:14px!important;box-shadow:none!important
}
body.s5-unified-page .secondary-btn{border-radius:14px!important}
body.s5-unified-page .quick-grid{gap:12px!important}
body.s5-unified-page .quick-card{background:var(--s5-panel)!important}
body.s5-unified-page .today-pill{background:var(--s5-warm)!important;color:#6d5629!important;border-color:#e2d0ac!important}
body.s5-unified-page .brand-mark{background:var(--s5-accent)!important}
body.s5-unified-page .progress-fill{background:var(--s5-accent)!important}
body.s5-unified-page .q-type{color:var(--s5-accent)!important}
body.s5-unified-page .drawer-nav button{border-radius:14px!important;background:#f7f7f3!important}
body.s5-unified-page .drawer{background:var(--s5-panel)!important}
@media(max-width:760px){
  .s5-unified-grid{grid-template-columns:1fr}
  .s5-unified-nav a:nth-child(n+3){display:none}
  .s5-unified-shell{width:min(100% - 20px,1120px);padding-top:18px}
}
