:root { color-scheme: light; --ink:#173d3b; --deep:#0d2926; --gold:#b69142; --paper:#fffaf0; --muted:#5f6f6c; --line:#d8c28a; --red:#8d2f2d; }
* { box-sizing: border-box; }
html { font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Yu Gothic",sans-serif; background:#f4eddd; color:var(--ink); line-height:1.8; }
body { margin:0; background:radial-gradient(circle at 50% 0,#fff7dc 0,#f4eddd 42%,#e8dfca 100%); min-height:100vh; }
.business-page { --ink:#182f52; --deep:#0a1e3d; --gold:#c5a358; --paper:#fffaf0; --muted:#5b6980; --line:#d9c68f; --red:#8d2f2d; background:radial-gradient(circle at 50% 0,#f7f4e8 0,#e7edf7 44%,#ccd8e9 100%); }
header { background:var(--deep); color:#fff4d2; border-bottom:3px solid var(--gold); }
.header-inner, main, footer { width:min(920px,calc(100% - 32px)); margin:auto; }
.header-inner { padding:28px 0; }
.brand { font-family:"Yu Mincho","Hiragino Mincho ProN",serif; font-size:1.45rem; font-weight:800; letter-spacing:.12em; text-decoration:none; color:inherit; }
.tag { margin:.3rem 0 0; color:#e7d7aa; font-size:.9rem; }
nav { display:flex; gap:8px; flex-wrap:wrap; margin-top:18px; }
nav a { color:#fff7dc; text-decoration:none; border:1px solid #7e8f87; border-radius:999px; padding:5px 12px; font-size:.9rem; }
main { padding:42px 0 60px; }
article, .hero, .support-card { background:rgba(255,250,240,.96); border:1px solid var(--line); border-radius:22px; box-shadow:0 12px 30px rgba(34,44,38,.1); }
article, .support-card { padding:clamp(22px,5vw,48px); }
.hero { padding:clamp(28px,6vw,56px); text-align:center; }
h1, h2 { font-family:"Yu Mincho","Hiragino Mincho ProN",serif; }
h1 { font-size:clamp(2rem,6vw,3.2rem); line-height:1.35; margin:.2em 0; }
h2 { font-size:1.35rem; margin:.4rem 0; }
.lead { font-size:1.05rem; color:var(--muted); max-width:680px; margin:1rem auto; }
.updated { font-size:.88rem; color:var(--muted); margin-bottom:2rem; }
section + section { border-top:1px solid #dfd4b8; margin-top:2rem; padding-top:1.2rem; }
p, li { font-size:1rem; }
a { color:#7d2928; text-underline-offset:3px; }
.cards { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:28px; }
.card { display:block; background:#fffaf0; border:1px solid var(--line); border-radius:18px; padding:24px; text-decoration:none; color:var(--ink); box-shadow:0 8px 20px rgba(34,44,38,.08); }
.card strong { display:block; font-size:1.15rem; margin-bottom:.4rem; }
.notice { border-left:5px solid var(--gold); padding:14px 18px; background:#fff5d9; border-radius:8px; }
.status { display:inline-block; background:#f0e3bc; border-radius:999px; padding:3px 12px; font-weight:700; }
.button { display:inline-block; background:var(--red); color:#fff; text-decoration:none; border-radius:14px; padding:13px 22px; font-weight:800; box-shadow:0 5px 0 #641d1b; }
.button[aria-disabled="true"] { background:#7f8783; box-shadow:none; cursor:not-allowed; }
.faq dt { font-weight:800; margin-top:1.3rem; }
.faq dd { margin:.25rem 0 0; }
footer { padding:28px 0 44px; color:#596763; font-size:.85rem; text-align:center; }
.site-header { position:sticky; top:0; z-index:10; background:rgba(13,41,38,.96); backdrop-filter:blur(14px); }
.business-page .site-header { background:rgba(10,30,61,.96); }
.header-row { display:flex; align-items:center; justify-content:space-between; gap:24px; }
.header-row nav { margin:0; }
.business-brand { display:flex; align-items:center; gap:12px; letter-spacing:.08em; }
.business-brand small { display:block; font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans",sans-serif; font-size:.58rem; letter-spacing:.18em; color:#d8c28a; }
.brand-mark { width:46px; height:46px; display:grid; place-items:center; overflow:hidden; border:1px solid var(--gold); border-radius:50%; background:linear-gradient(145deg,#22534c,#0b2422); }
.business-page .brand-mark { background:linear-gradient(145deg,#173f7a,#081a38); }
.brand-mark img { width:100%; height:100%; object-fit:cover; }
.business-main,.product-main { width:min(1120px,calc(100% - 32px)); }
.business-hero { min-height:560px; display:grid; grid-template-columns:1.28fr .72fr; align-items:center; gap:54px; padding:64px 0 82px; }
.hero-copy h1 { font-size:clamp(3rem,5vw,4rem); line-height:1.2; letter-spacing:.03em; margin:.12em 0 .28em; }
.kicker { color:#8d2f2d; font-size:.78rem; font-weight:900; letter-spacing:.2em; }
.hero-copy .lead { margin:20px 0; max-width:600px; }
.hero-actions { display:flex; align-items:center; gap:22px; flex-wrap:wrap; margin-top:32px; }
.text-link { font-weight:800; }
.hero-symbol { width:100%; max-width:340px; justify-self:center; aspect-ratio:1; display:grid; place-items:center; border-radius:50%; text-align:center; }
.business-page .hero-symbol { filter:drop-shadow(0 24px 44px rgba(10,30,61,.22)); }
.hero-symbol img { width:100%; height:100%; object-fit:contain; border-radius:50%; }
.business-section { margin:0 0 38px; padding:clamp(30px,6vw,64px); background:rgba(255,250,240,.9); border:1px solid var(--line); border-radius:28px; box-shadow:0 16px 45px rgba(34,44,38,.09); }
.section-heading h2,.business-section h2 { font-size:clamp(2rem,5vw,3rem); margin:.1em 0 .6em; }
.about-grid { display:grid; grid-template-columns:1fr 1fr; gap:64px; }
.statement { font-family:"Yu Mincho",serif; font-size:1.25rem; }
.statement p { font-size:inherit; }
.business-facts { margin:0; }
.business-facts div { display:grid; grid-template-columns:110px 1fr; gap:18px; padding:15px 0; border-bottom:1px solid #dfd4b8; }
.business-facts dt { font-size:.82rem; color:var(--muted); font-weight:800; }
.business-facts dd { margin:0; font-weight:700; }
.product-feature { display:grid; grid-template-columns:.85fr 1.15fr; gap:60px; align-items:center; background:#123b37; color:#fff5d2; border:0; border-radius:0; box-shadow:none; }
.product-feature .kicker { color:#dfbf62; }
.product-art { min-height:360px; display:grid; place-items:center; padding:18px; background:transparent; }
.product-art:before { content:none; }
.product-art img { width:min(78%,320px); border-radius:23%; box-shadow:0 22px 38px rgba(0,0,0,.28); }
.product-tagline { font-family:"Yu Mincho",serif; color:#ead89e; font-size:1.2rem; }
.release-note,.release-pill { display:inline-block; border:1px solid #d8bd68; border-radius:999px; padding:7px 14px; font-weight:800; font-size:.83rem; }
.button-secondary { background:#f4dfaa; color:#173d3b; box-shadow:0 5px 0 #b69142; }
.contact-panel { text-align:center; }
.business-footer { width:min(1120px,calc(100% - 32px)); border-top:1px solid #cabb99; display:grid; grid-template-columns:1fr; justify-items:center; gap:16px; text-align:center; }
.business-footer strong { font-family:"Yu Mincho",serif; font-size:1.25rem; letter-spacing:.12em; }
.business-footer p { margin:0; font-size:.8rem; }
.business-footer nav { justify-content:center; margin:0; }
.business-footer nav a { color:var(--ink); border-color:#b9aa86; }
.business-footer .footer-back-link { min-height:44px; display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:8px 20px; background:rgba(255,250,240,.8); font-weight:800; box-shadow:0 4px 12px rgba(23,61,59,.08); }
.business-footer .footer-back-link:before { content:"←"; font-size:1rem; line-height:1; }
.business-footer small { display:block; }
.app-hero { text-align:center; padding:72px 20px 58px; }
.app-emblem { width:138px; height:138px; margin:0 auto 20px; padding:7px; border-radius:28%; background:linear-gradient(145deg,#f7dc79,#8d6422); box-shadow:0 18px 40px rgba(13,41,38,.2); }
.app-emblem img { width:100%; height:100%; display:block; object-fit:cover; border-radius:23%; }
.app-hero h1 { font-size:clamp(3.2rem,10vw,6rem); margin:.05em 0; }
.app-lead { font:clamp(1.2rem,3vw,1.7rem) "Yu Mincho",serif; color:var(--muted); }
.intro-centered,.safe-panel { text-align:center; }
.intro-centered p { max-width:680px; margin:auto; }
.feature-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-bottom:38px; }
.feature-card { background:#123b37; color:#fff7dc; border:1px solid var(--gold); border-radius:24px; padding:34px; }
.feature-card span { width:52px; height:52px; display:grid; place-items:center; border-radius:50%; background:#f2dfaa; color:#173d3b; font:1.5rem "Yu Mincho",serif; }
.feature-card h2 { margin-top:18px; }
.link-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:26px; }
.link-grid a { padding:16px; border:1px solid var(--line); border-radius:12px; background:#fffaf0; font-weight:800; text-decoration:none; }
@media (max-width:680px) {
  .cards { grid-template-columns:1fr; }
  .header-inner { padding:20px 0; }
  main { padding-top:24px; }
  article, .support-card { border-radius:16px; }
  article h1, .support-card h1 { font-size:1.75rem; letter-spacing:-.03em; white-space:nowrap; }
  .site-header { position:static; }
  .header-row { display:block; }
  .header-row nav { margin-top:16px; }
  .business-hero { min-height:0; display:flex; flex-direction:column; align-items:stretch; gap:30px; padding:42px 0 54px; }
  .hero-symbol { width:min(58vw,220px); order:initial; align-self:center; }
  .hero-copy h1 { font-size:clamp(2.35rem,12vw,3rem); line-height:1.22; }
  .about-grid,.product-feature,.feature-grid { grid-template-columns:1fr; gap:28px; }
  .business-facts div { grid-template-columns:82px 1fr; }
  .product-art { min-height:260px; padding:4px; }
  .safe-panel h2 { font-size:1.75rem; line-height:1.4; }
  .business-footer { display:grid; }
  .business-footer nav { justify-content:center; margin:0; }
  .link-grid { grid-template-columns:1fr; }
}

/* Multiple app directory. New apps are added through apps.json. */
.catalog-section { margin:0 0 38px; }
.catalog-section .section-heading { margin-bottom:24px; }
.catalog-section .section-heading p { text-wrap:balance; }
.catalog-section .section-heading h2 { font-size:clamp(2rem,5vw,3rem); margin:.1em 0 .3em; }
.catalog-intro { padding:56px 0 20px; }
.catalog-intro .lead { margin:12px 0 0; }
.app-catalog { display:grid; grid-template-columns:minmax(0,1fr); gap:18px; margin:24px 0 38px; }
.app-card { display:grid; grid-template-columns:minmax(260px,280px) minmax(0,1fr) minmax(185px,215px); grid-template-areas:"top description links" "top status links"; align-items:center; gap:8px clamp(20px,3vw,36px); min-width:0; min-height:184px; padding:28px; background:rgba(255,250,240,.96); border:1px solid var(--line); border-radius:24px; box-shadow:0 12px 30px rgba(34,44,38,.1); }
.app-card-top { grid-area:top; display:flex; align-items:center; gap:18px; min-width:0; }
.app-card-icon { flex:none; width:88px; height:88px; object-fit:cover; border-radius:20px; box-shadow:0 6px 20px rgba(13,41,38,.17); }
.app-card-category { margin:0; color:var(--red); font-size:.8rem; font-weight:800; }
.app-card h3 { margin:0; font-size:1.5rem; line-height:1.3; }
.app-card-platform { margin:0; color:var(--muted); font-size:.88rem; }
.app-card-description { grid-area:description; margin:0; text-wrap:balance; }
.app-card-status { grid-area:status; justify-self:start; margin:0; border:1px solid var(--line); border-radius:999px; padding:2px 11px; font-size:.8rem; font-weight:700; }
.app-card-links { grid-area:links; display:flex; flex-direction:column; align-items:stretch; gap:8px; margin:0; }
.app-card-links .button { padding:9px 16px; border-radius:10px; box-shadow:none; text-align:center; }
.app-card-links a:not(.button) { font-size:.9rem; font-weight:700; text-align:center; }
.catalog-more { text-align:right; }
.nap10-emblem { background:linear-gradient(145deg,#a9a5fb,#37308f); }
@media (max-width:900px) {
  .app-card { grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"top top" "description status" "links links"; }
  .app-card-links { flex-direction:row; flex-wrap:wrap; align-items:center; }
  .app-card-links a:not(.button) { text-align:left; }
}
@media (max-width:680px) {
  .catalog-intro { padding:30px 0 12px; }
  .app-card { grid-template-columns:1fr; grid-template-areas:"top" "description" "status" "links"; gap:12px; padding:22px; }
  .app-card-links .button { width:100%; text-align:center; }
}

/* Keep the home headline together on narrow screens and make longer Nap10 copy easy to scan. */
.hero-line { white-space:nowrap; }
.nap10-intro p { text-align:left; }
@media (max-width:680px) { .hero-copy h1 { font-size:clamp(1.75rem,9vw,2.65rem); } }

.intro-line { white-space:nowrap; }
@media (max-width:680px) { .nap10-intro h2 { font-size:clamp(1.45rem,7vw,2.2rem); } }