
*{box-sizing:border-box}body{margin:0;font-family:'Noto Sans SC',sans-serif;background:var(--bg);color:var(--text);line-height:1.7}
a{color:inherit;text-decoration:none}img{max-width:100%;display:block}
.top{position:sticky;top:0;z-index:20;display:flex;justify-content:space-between;align-items:center;gap:14px;padding:14px 5vw;background:var(--header);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.logo{font-weight:900;font-size:18px;letter-spacing:.02em}
nav{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center}
nav a{font-size:14px;opacity:.78;padding:8px 10px;border-radius:999px}
nav a.on{opacity:1;background:rgba(127,127,127,.1)}
nav a.dl{background:var(--accent);color:var(--on);opacity:1;font-weight:800}
.menu{display:none;border:0;background:var(--accent);color:var(--on);padding:8px 12px;border-radius:10px;font-weight:700}
footer{border-top:1px solid var(--line);padding:24px 5vw;margin-top:24px}
.f{width:min(1080px,92vw);margin:0 auto;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;opacity:.8}
.f a{margin-right:12px}

.wrap{width:min(1080px,92vw);margin:0 auto}
.head{padding:48px 0 18px}.head h1{font-size:clamp(32px,5vw,48px);margin:8px 0}
.eye{font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:800;opacity:.7}
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;padding:8px 0 40px;width:min(1080px,92vw);margin:0 auto}
.card{border-radius:18px;overflow:hidden;background:var(--card);border:1px solid var(--line)}
.card a{display:block;color:inherit;height:100%}
.card img{width:100%;height:140px;object-fit:cover}
.card div{padding:14px 16px 18px}.card span{font-size:12px;font-weight:800;color:var(--accent)}
.card h3{margin:8px 0;font-size:16px;line-height:1.35}.card p{margin:0;font-size:13px;opacity:.72}
.pager{display:flex;gap:8px;justify-content:center;padding:0 0 48px}
.pager a{min-width:38px;text-align:center;padding:8px 10px;border:1px solid var(--line);border-radius:10px}
.pager a.on{background:var(--accent);color:var(--on);border-color:var(--accent)}
.article{width:min(760px,92vw);margin:40px auto 60px}
.article img{width:100%;max-height:360px;object-fit:cover;border-radius:16px;margin:16px 0}
.lead{font-size:18px;opacity:.8}.prose h2{margin-top:24px;font-size:18px;color:var(--accent)}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
.btn,.line{display:inline-flex;align-items:center;justify-content:center;padding:12px 18px;border-radius:999px;font-weight:800}
.btn{background:var(--accent);color:var(--on)}.line{border:1px solid var(--accent);color:var(--accent)}
@media(max-width:860px){.grid{grid-template-columns:1fr}.menu{display:inline-flex!important}nav{display:none;width:100%}body.open nav{display:flex;flex-direction:column}}

:root{--bg:#fff;--text:#0f172a;--header:#fff;--line:#e2e8f0;--card:#f8fafc;--accent:#2563eb;--on:#fff}
h1,h2,.logo{font-family:Manrope,'Noto Sans SC',sans-serif}
.app{width:min(980px,92vw);margin:28px auto;display:grid;grid-template-columns:120px 1fr auto;gap:20px;align-items:center}
.app .icon{width:120px;height:120px;border-radius:28px;object-fit:cover;border:1px solid var(--line);box-shadow:0 10px 30px rgba(15,23,42,.08)}
.meta h1{margin:0 0 6px;font-size:34px}.meta p{margin:0;color:#64748b}
.store-cta{display:flex;flex-direction:column;gap:8px}
.shots-row{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(200px,240px);gap:12px;overflow-x:auto;padding:8px 5vw 28px}
.shots-row img{height:420px;width:100%;object-fit:cover;border-radius:18px;border:1px solid var(--line)}
.bullets{width:min(980px,92vw);margin:0 auto 36px;display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.bullets article{padding:18px;border:1px solid var(--line);border-radius:16px;background:#f8fafc}
@media(max-width:860px){.app{grid-template-columns:1fr}.store-cta{flex-direction:row;flex-wrap:wrap}.bullets{grid-template-columns:1fr}.shots-row img{height:320px}}

