:root {
  --paper:#faf7f2; --ink:#302c28; --muted:#787168; --line:#ded6ca;
  --wheat:#dfa650; --cream:#f5e4c7; --sage:#dce5d9; --slate:#7c949e;
  --ease:cubic-bezier(.23,1,.32,1);
  font-family:Inter,"Segoe UI","Noto Sans TC","Microsoft JhengHei",sans-serif;
  color:var(--ink); background:var(--paper); font-synthesis:none;
  scroll-behavior:smooth; scroll-padding-top:110px;
}
* { box-sizing:border-box; }
body { margin:0; -webkit-font-smoothing:antialiased; }
body:has(dialog[open]) { overflow:hidden; }
::selection { background:var(--cream); color:var(--ink); }
a { color:inherit; text-decoration:none; }
button,input { font:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
button { color:inherit; cursor:pointer; }
button,a,summary { touch-action:manipulation; }
:is(button,a,summary,video):focus-visible { outline:3px solid #845121; outline-offset:5px; }
img { display:block; max-width:100%; height:auto; }
h1,h2,h3,p,figure { margin:0; }
h1,h2,h3 { text-wrap:balance; }
h1,h2 { letter-spacing:-.045em; }
h2 { font-size:clamp(30px,3.2vw,40px); font-weight:700; line-height:1.45; }
h3 { font-size:21px; font-weight:600; line-height:1.5; letter-spacing:-.025em; }
p { line-height:1.85; }
kbd { display:inline-block; padding:3px 6px; border:1px solid #d9d1c7; border-bottom-width:2px; border-radius:4px; background:#fffaf4; color:#62574b; font:11px/1.3 "Segoe UI",sans-serif; white-space:nowrap; vertical-align:baseline; }
code,pre { font-family:Consolas,"Cascadia Code",monospace; }
code { overflow-wrap:anywhere; }
pre { overflow-x:auto; }
pre code { overflow-wrap:normal; }
.shell { max-width:1220px; margin-inline:auto; padding-inline:40px; }
.section { padding-block:104px; }
.eyebrow { font:11px/1.5 Consolas,"Cascadia Code",monospace; letter-spacing:.13em; color:var(--muted); }
.paper-dog { image-rendering:auto; }
.section-heading { text-align:center; }
.section-heading h2 { margin-top:15px; }
.section-heading>p:last-child { font-size:16px; color:var(--muted); margin-top:17px; }

.site-header { position:sticky; top:0; z-index:20; background:#faf7f2f5; }
.nav { height:94px; display:flex; align-items:center; gap:30px; border-bottom:1px solid var(--line); }
.brand { display:inline-flex; align-items:center; flex-shrink:0; }
.brand-logo { width:176px; height:auto; object-fit:contain; }
.nav-links { display:flex; gap:32px; margin-left:auto; margin-right:12px; font-size:13px; color:#675f55; }
.nav-links a { padding-block:12px; transition:color 160ms ease; }
.nav-links a:hover { color:#8a511e; }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:54px; padding:14px 27px; border:1px solid var(--ink); border-radius:8px; background:var(--ink); color:var(--paper); font-size:15px; font-weight:600; line-height:1.5; text-align:center; transition:background 160ms ease,transform 160ms var(--ease); }
.button:hover { background:#4a3f33; }
.button:active,.breed-button:active,.close-button:active { transform:scale(.97); }
.button-small { min-height:42px; padding:10px 19px; font-size:13px; border-radius:6px; }
.button-outline { background:transparent; color:var(--ink); border-color:#b9afa1; }
.button-outline:hover { background:#f3ecdf; }
.text-button { display:inline-flex; align-items:center; justify-content:center; min-height:44px; font-size:14px; font-weight:600; line-height:1.6; text-decoration:underline; text-decoration-color:#b9aa96; text-underline-offset:6px; }
.text-button:hover { text-decoration-color:currentColor; }

.hero { padding-top:46px; padding-bottom:55px; overflow:clip; }
.hero-grid { position:relative; display:grid; grid-template-columns:1.05fr .95fr; gap:32px; align-items:center; min-height:505px; }
.hero-content { position:relative; z-index:1; min-width:0; padding-bottom:10px; }
.hero h1 { font-size:clamp(32px,4.2vw,54px); line-height:1.32; font-weight:700; margin-top:26px; }
.hero-copy { font-size:18px; line-height:1.8; margin-top:26px; letter-spacing:.01em; }
.hero-detail { font-size:15px; color:var(--muted); line-height:1.85; margin-top:14px; }
.hero-actions { display:flex; align-items:center; flex-wrap:wrap; gap:9px 23px; margin-top:30px; }
.hero-actions .button { border-radius:30px; }
.hero-meta { font-size:12px; margin-top:16px; color:var(--muted); }
.hero-art { width:100%; margin:0; }
.hero-art img { width:100%; height:auto; }

.why { display:grid; grid-template-columns:.85fr 1.15fr; gap:60px; border-top:1px solid var(--line); }
.why-heading h2 { margin-top:16px; }
.why-copy p { font-size:16px; line-height:1.95; color:var(--muted); }
.why-copy p+p { margin-top:19px; }

.features { border-top:1px solid var(--line); padding-top:57px; padding-bottom:81px; }
.features .section-heading { text-align:left; }
.features .section-heading h2 { margin-top:0; font-size:40px; }
.writing-scenes { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:42px; margin-top:35px; }
.writing-scenes article { min-width:0; text-align:center; }
.writing-scenes img { width:100%; aspect-ratio:5/4; object-fit:contain; }
.writing-scenes h3 { font-size:21px; font-weight:500; margin-top:13px; }
.writing-scenes p { margin-top:14px; color:var(--muted); font-size:14px; line-height:1.9; }
.writing-scenes kbd { font-size:10px; padding:2px 5px; }
.writing { padding-top:74px; border-top:1px solid var(--line); }
.writing-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:30px; }
.writing-heading h2 { margin-top:16px; }
.writing-heading>p { font-size:14px; line-height:1.9; color:var(--muted); padding-bottom:5px; }
.writing-product { margin-top:40px; }
.screenshot-frame { overflow:hidden; border:1px solid #ded5c8; border-radius:10px; background:#fff; box-shadow:0 18px 40px -24px #4d321b42; }
.writing-screenshot { width:100%; height:auto; }
.screenshot-caption { display:flex; justify-content:space-between; gap:16px; font-size:12px; line-height:1.7; color:var(--muted); margin-top:17px; }
.writing-notes { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:40px; margin-top:37px; }
.writing-notes>div { padding-top:20px; border-top:1px solid var(--line); }
.writing-notes h3 { font-size:16px; }
.writing-notes p { margin-top:12px; font-size:12px; color:var(--muted); }

.ai-story { background:#f0f0e8; }
.story-grid { display:grid; grid-template-columns:.85fr 1.15fr; gap:75px; align-items:center; }
.story-copy h2 { margin-top:23px; font-size:42px; line-height:1.45; }
.story-copy>p:not(.eyebrow) { font-size:15px; color:#716a60; margin-top:23px; }
.story-copy .text-button { margin-top:19px; color:#80552c; }
.outline-tag { display:inline-flex; align-items:center; justify-content:center; border:1px solid #c4ac8d; color:#75522c; padding:4px 7px; border-radius:4px; font-size:11px; font-weight:500; line-height:1.4; letter-spacing:.02em; white-space:nowrap; }
.story-copy .eyebrow { display:flex; flex-wrap:wrap; align-items:center; gap:10px; font-size:10px; }
.shortcut-note { display:flex; gap:7px; align-items:center; margin-top:23px; color:#716a60; font-size:12px; }
.shortcut-note>span:last-child { margin-left:6px; }
.review-figure { min-width:0; }
.review-figure>img { width:100%; height:auto; border:1px solid #d9d2c8; border-radius:9px; background:#fff; box-shadow:0 15px 35px #4d321b0c; }
.review-figure figcaption { display:flex; justify-content:center; flex-wrap:wrap; gap:10px; margin-top:19px; }
.decision { font-size:12px; padding:7px 12px; border-radius:4px; }
.decision-accept { color:#3b6145; background:#dce8da; }
.decision-reject { color:#6c5e4e; background:#e6e0d4; }
.figure-note { display:block; text-align:center; font-size:11px; line-height:1.8; color:#716a60; margin-top:12px; }
.video-wrap { overflow:hidden; margin-top:42px; border-radius:10px; border:1px solid #e4dbcd; background:var(--ink); }
.video-wrap video { display:block; width:100%; height:auto; aspect-ratio:16/9; }
.video-caption { display:flex; justify-content:space-between; gap:24px; font-size:12px; line-height:1.8; color:var(--muted); margin-top:19px; }
.video-caption span:last-child { text-align:right; max-width:420px; }
.demo-steps { list-style:none; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); padding:0; margin:32px 0 0; gap:28px; }
.demo-steps li { border-top:1px solid var(--line); padding-top:15px; font-size:13px; color:#6e6254; display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
.demo-steps span { font-family:Consolas,monospace; font-size:11px; white-space:nowrap; color:var(--muted); }

.companions { background:#e8eee5; }
.companion-grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:70px; align-items:center; }
.companion-copy h2 { margin-top:23px; }
.companion-copy>p:not(.eyebrow) { font-size:15px; color:#596653; margin-top:23px; }
.companion-copy .small-note { font-size:12px; margin-top:27px; }
.companion-picker { min-width:0; }
.companion-stage { display:flex; flex-direction:column; align-items:center; text-align:center; padding:0 20px 23px; }
.stage-label { font:10px/1.5 Consolas,monospace; letter-spacing:.15em; color:#596653; }
.companion-stage>img { width:220px; height:220px; object-fit:contain; margin-block:14px 10px; }
.companion-stage h3 { font-size:19px; }
.companion-stage p { font-size:13px; color:#596653; margin-top:7px; }
.breed-buttons { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:7px; margin-top:14px; }
.breed-button { display:flex; align-items:center; flex-direction:column; gap:5px; border:1px solid transparent; background:transparent; border-radius:8px; padding:7px 3px 10px; min-width:0; transition:background 160ms ease,border-color 160ms ease,transform 160ms var(--ease); }
.breed-button img { width:49px; height:49px; object-fit:contain; }
.breed-button span { font-size:11px; color:#596653; }
.breed-button:hover { background:#f8faf4; }
.breed-button[aria-pressed=true] { background:#faf5de; border-color:#b5a66f; }
.breed-button[aria-pressed=true] span { color:#625329; }
.version-grid { display:grid; grid-template-columns:1fr 1fr; gap:36px; max-width:1000px; margin:45px auto 0; }
.version-card { border-top:1px solid #cabeac; padding:31px 27px 12px; }
.version-heading { display:flex; justify-content:space-between; gap:15px; align-items:center; margin-bottom:27px; }
.version-label { font-size:12px; color:#755a39; letter-spacing:.08em; }
.version-card h3 { font-size:25px; }
.version-card>p { font-size:15px; color:var(--muted); margin-top:18px; }
.version-card ul { padding-left:18px; margin:25px 0 29px; font-size:13px; color:#716452; line-height:2.1; }
.version-card li { padding-left:3px; margin-block:5px; }
.version-card>.button { width:100%; }
.version-card .version-note { font-size:12px; line-height:1.8; margin-top:15px; }
.faq { border-top:1px solid var(--line); display:grid; grid-template-columns:.85fr 1.15fr; gap:75px; padding-block:78px; }
.faq h2 { font-size:32px; margin-top:15px; }
.faq-dog { width:120px; height:120px; object-fit:contain; margin-top:20px; }
.faq-items { padding-top:4px; }
.faq details { border-bottom:1px solid var(--line); padding:23px 0; }
.faq details:first-child { padding-top:9px; }
.faq summary { cursor:pointer; font-size:15px; line-height:1.7; font-weight:500; padding-right:10px; }
.faq summary::marker { color:#8a7151; }
.faq details p { margin-top:18px; font-size:14px; line-height:1.9; color:#716452; }
.faq details a { text-decoration:underline; text-underline-offset:4px; }
.closing { padding-block:35px 65px; text-align:center; }
.closing>img { margin:0 auto; width:110px; height:110px; object-fit:contain; }
.closing>p { font-size:25px; letter-spacing:-.02em; margin-top:10px; font-weight:600; }
.closing .text-button { font-size:14px; margin-top:9px; color:#80552c; }
.footer { display:flex; flex-wrap:wrap; align-items:center; gap:25px; padding-block:25px 32px; border-top:1px solid var(--line); }
.footer .brand-logo { width:125px; }
.footer p { font-size:12px; color:var(--muted); }
.footer>span { font-size:11px; color:var(--muted); margin-left:auto; }

.ai-dialog { width:min(640px,calc(100% - 32px)); max-height:calc(100svh - 48px); overflow-y:auto; border:1px solid #cfc2ad; border-radius:13px; padding:30px 34px; background:var(--paper); color:var(--ink); box-shadow:0 20px 100px #1e130f40; }
.ai-dialog::backdrop { background:#2e281f77; }
.dialog-heading { display:flex; justify-content:space-between; align-items:center; gap:16px; }
.close-button { min-width:44px; min-height:44px; padding:8px; font-size:13px; line-height:1.5; border:0; background:transparent; border-radius:6px; color:#716452; transition:transform 160ms var(--ease); }
.close-button:hover { background:#ede5d9; }
.ai-dialog h2 { font-size:29px; margin-top:15px; }
.ai-dialog>p { font-size:14px; color:#716452; margin-top:15px; }
.guide-steps { padding-left:22px; margin-top:25px; }
.guide-steps>li { font-size:14px; padding-left:6px; margin-bottom:21px; color:#716452; }
.guide-steps strong { color:var(--ink); font-size:15px; }
.guide-steps p { font-size:13px; margin-top:8px; line-height:1.9; }
.code-block { border:1px solid #dfd4c2; background:#f0eade; border-radius:7px; padding:13px 15px; position:relative; margin-top:12px; }
.code-block pre { font-size:13px; line-height:1.9; margin:0 0 43px; }
.copy-button { position:absolute; right:10px; bottom:10px; padding:7px 10px; font-size:12px; min-height:38px; background:var(--paper); border:1px solid #d1c0a7; border-radius:4px; }
.ai-dialog .dialog-note { font-size:12px; background:#f1eadf; border-radius:6px; padding:12px 14px; }
.ai-dialog>.button { margin-top:23px; min-height:45px; font-size:13px; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link { position:fixed; top:10px; left:15px; z-index:1000; transform:translateY(-160%); background:var(--ink); color:#fff; padding:12px 18px; border-radius:6px; }
.skip-link:focus { transform:translateY(0); }

@media (max-width:1100px) {
  .shell { padding-inline:32px; }
  .hero h1 { font-size:clamp(32px,4.2vw,46px); }
  .hero-actions { gap:9px 20px; }
  .hero-actions .text-button { font-size:13px; }
  .writing-scenes { gap:25px; }
  .writing-scenes h3 { font-size:19px; }
  .writing-heading>p { font-size:13px; }
  .story-grid { gap:45px; }
  .story-copy h2 { font-size:36px; }
  .companion-grid { gap:35px; }
  .breed-buttons { gap:2px; }
  .version-card { padding-inline:15px; }
}
@media (max-width:800px) {
  .nav-links { gap:19px; margin-right:0; }
  .nav { gap:20px; }
  .brand-logo { width:146px; }
  .hero-grid { grid-template-columns:1fr 1fr; min-height:470px; }
  .hero h1 { font-size:clamp(29px,4.5vw,36px); }
  .hero-copy { max-width:300px; }
  .hero-detail { font-size:14px; }
  .hero-actions { align-items:flex-start; flex-direction:column; }
  .hero .eyebrow { font-size:9px; letter-spacing:.08em; }
  .hero-art { position:static; width:100%; max-width:none; margin:0; }
  .why { grid-template-columns:1fr; gap:27px; }
  .writing-scenes { gap:16px; }
  .writing-scenes h3 { font-size:17px; }
  .writing-scenes p { font-size:13px; }
  .writing-scenes p br { display:none; }
  .writing-heading { display:block; }
  .writing-heading>p { margin-top:18px; font-size:14px; }
  .writing-notes { gap:20px; }
  .writing-notes p { font-size:12px; line-height:2.1; }
  .story-grid { gap:32px; }
  .story-copy h2 { font-size:32px; }
  .story-copy>p:not(.eyebrow) { font-size:14px; }
  .companion-grid { gap:25px; }
  .companion-copy h2 { font-size:32px; }
  .companion-copy>p:not(.eyebrow) { font-size:14px; }
  .breed-buttons { grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }
  .version-grid { gap:25px; }
  .version-heading { flex-wrap:wrap; gap:10px; }
  .version-card h3 { font-size:21px; }
  .version-card ul { font-size:12px; }
  .faq { gap:35px; }
  .faq h2 { font-size:29px; }
}
@media (max-width:640px) {
  :root { scroll-padding-top:88px; }
  .shell { padding-inline:24px; }
  .section { padding-block:68px; }
  .nav { height:78px; gap:15px; }
  .brand-logo { width:128px; }
  .nav-links { display:none; }
  .nav>.button { margin-left:auto; }
  .button-small { font-size:12px; min-height:42px; padding:9px 14px; }
  .hero { padding-top:43px; padding-bottom:24px; }
  .hero-grid { display:flex; flex-direction:column; align-items:stretch; min-height:0; }
  .hero-content { padding-bottom:0; }
  .hero .eyebrow { font-size:10px; letter-spacing:.08em; }
  .hero h1 { font-size:clamp(29px,8vw,42px); line-height:1.4; margin-top:20px; }
  .hero-copy { font-size:16px; max-width:none; margin-top:21px; }
  .hero-detail { font-size:14px; margin-top:11px; }
  .hero-actions { flex-direction:row; align-items:center; gap:8px 18px; margin-top:25px; }
  .hero-actions .button { min-height:51px; font-size:14px; padding-inline:22px; }
  .hero-actions .text-button { font-size:13px; }
  .hero-meta { font-size:12px; margin-top:13px; }
  .hero-art { width:100%; max-width:470px; margin:17px auto 0; }
  .why-heading h2 { font-size:29px; }
  .why-copy p { font-size:14px; }
  .section-heading h2 { font-size:29px; line-height:1.5; }
  .section-heading>p:last-child { font-size:14px; margin-top:13px; }
  .features { padding-top:41px; padding-bottom:52px; }
  .features .section-heading { text-align:center; }
  .features .section-heading h2 { font-size:29px; }
  .writing-scenes { grid-template-columns:1fr; gap:32px; margin-top:28px; }
  .writing-scenes article { max-width:340px; margin-inline:auto; }
  .writing-scenes img { width:min(100%,300px); margin-inline:auto; }
  .writing-scenes h3 { font-size:21px; margin-top:0; }
  .writing-scenes p { font-size:14px; margin-top:11px; }
  .writing-scenes p br { display:block; }
  .writing { padding-top:55px; }
  .writing-heading h2 { font-size:29px; margin-top:13px; }
  .writing-heading>p { font-size:14px; }
  .writing-product { margin-top:27px; }
  .screenshot-frame { border-radius:7px; }
  .screenshot-caption { font-size:11px; gap:12px; margin-top:13px; }
  .writing-notes { grid-template-columns:1fr; gap:21px; margin-top:28px; }
  .writing-notes>div { padding-top:16px; }
  .writing-notes p { margin-top:7px; font-size:13px; }
  .story-grid { grid-template-columns:1fr; gap:34px; }
  .story-copy h2 { font-size:34px; }
  .story-copy h2 br:nth-child(2) { display:none; }
  .story-copy .eyebrow { font-size:9px; }
  .story-copy>p:not(.eyebrow) { font-size:14px; margin-top:19px; }
  .shortcut-note { margin-top:14px; }
  .decision { font-size:11px; padding:6px 9px; }
  .video-wrap { margin-top:29px; border-radius:7px; }
  .video-caption { flex-direction:column; gap:7px; font-size:12px; margin-top:13px; }
  .video-caption span:last-child { text-align:left; max-width:none; }
  .demo-steps { grid-template-columns:1fr 1fr; gap:23px 20px; margin-top:25px; }
  .demo-steps li { font-size:12px; gap:8px; padding-top:11px; }
  .companion-grid { grid-template-columns:1fr; gap:33px; }
  .companion-copy { text-align:center; }
  .companion-copy h2 { font-size:32px; margin-top:16px; }
  .companion-copy>p:not(.eyebrow) { font-size:14px; margin-top:16px; }
  .companion-copy .small-note { font-size:11px; margin-top:16px; }
  .companion-stage { padding:0 10px 20px; }
  .companion-stage>img { width:210px; height:210px; }
  .companion-stage p { font-size:12px; }
  .breed-buttons { grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-top:0; }
  .breed-button img { width:54px; height:54px; }
  .breed-button { padding-bottom:11px; }
  .version-grid { grid-template-columns:1fr; gap:35px; margin-top:32px; }
  .version-card { padding:25px 0 0; }
  .version-heading { flex-wrap:nowrap; margin-bottom:21px; }
  .version-card h3 { font-size:23px; }
  .version-card>p { font-size:14px; }
  .version-card ul { font-size:13px; margin-block:20px 25px; }
  .version-card .version-note { font-size:12px; }
  .faq { grid-template-columns:1fr; gap:26px; padding-top:51px; padding-bottom:35px; }
  .faq-intro { position:relative; padding-right:60px; }
  .faq h2 { font-size:27px; margin-top:14px; }
  .faq-dog { position:absolute; right:0; top:-6px; margin:0; width:72px; height:72px; }
  .faq .eyebrow { font-size:9px; }
  .faq-items { padding-top:0; }
  .faq summary { font-size:14px; }
  .faq details { padding-block:22px; }
  .faq details p { font-size:13px; }
  .closing { padding-block:35px 48px; }
  .closing>p { font-size:22px; }
  .footer { padding-block:23px; gap:10px 17px; flex-wrap:wrap; }
  .footer .brand-logo { width:112px; }
  .footer p { font-size:11px; }
  .footer>span { font-size:10px; }
  .ai-dialog { padding:23px 21px; }
  .ai-dialog h2 { font-size:25px; }
  .ai-dialog>p { font-size:13px; }
  .guide-steps { padding-left:18px; }
}
@media (prefers-reduced-motion:reduce) {
  :root { scroll-behavior:auto; }
  *,*::before,*::after { transition:none!important; animation:none!important; }
}
.policy-page { max-width:860px; padding-top:80px; padding-bottom:80px; }
.policy-page h1 { font-size:clamp(30px,5vw,54px); line-height:1.3; letter-spacing:-.04em; }
.policy-lead { color:var(--muted); line-height:1.9; }
.policy-nav { display:flex; flex-wrap:wrap; gap:12px 24px; margin:32px 0; font-size:14px; }
.policy-nav a,.policy-page section a,.footer-links a { text-decoration:underline; text-underline-offset:4px; }
.policy-notice { border:1px solid #dbc7a5; background:#f4ecde; padding:22px; border-radius:12px; font-size:14px; line-height:1.8; }
.policy-notice p { margin:8px 0 0; }
.policy-page section { padding-top:38px; scroll-margin-top:100px; font-size:16px; line-height:1.95; }
.policy-page h2 { font-size:27px; letter-spacing:-.025em; margin:0 0 20px; }
.policy-page h3 { margin-top:24px; font-size:18px; }
.policy-page p,.policy-page li { overflow-wrap:anywhere; }
.policy-page code { font-size:.85em; }
.footer-links { display:flex; flex-wrap:wrap; gap:10px 18px; font-size:12px; }
.button:disabled { cursor:default; opacity:.65; }
.version-card .price { font-size:42px; font-weight:650; letter-spacing:-.05em; margin:18px 0; color:var(--ink); }
.version-card .price small { font-size:15px; letter-spacing:0; font-weight:400; }

.language-menu { position:relative; flex-shrink:0; font-size:12px; }
.language-menu summary { display:flex; align-items:center; gap:8px; min-height:42px; padding:8px; cursor:pointer; list-style:none; border-radius:6px; }
.language-menu summary::-webkit-details-marker { display:none; }
.language-menu summary:hover { background:#efe8dc; }
.language-menu>div { position:absolute; top:100%; right:0; z-index:35; min-width:150px; padding:7px; border:1px solid var(--line); border-radius:8px; background:var(--paper); box-shadow:0 12px 28px #302c2818; }
.language-menu a { display:block; padding:10px 12px; border-radius:4px; white-space:nowrap; }
.language-menu a:hover,.language-menu a[aria-current=page] { background:var(--cream); }
.footer-setting { padding:8px 0; border:0; background:transparent; font-size:12px; text-decoration:underline; text-underline-offset:4px; min-height:44px; }
.analytics-banner { position:fixed; right:24px; bottom:24px; z-index:50; width:min(520px,calc(100% - 48px)); max-height:75svh; overflow-y:auto; padding:24px; border:1px solid #c9bca7; border-radius:12px; background:var(--paper); box-shadow:0 12px 70px #302c2828; }
.analytics-banner h2 { font-size:20px; letter-spacing:-.02em; }
.analytics-banner p { font-size:14px; line-height:1.8; margin-top:10px; color:#625a50; }
.analytics-banner>a { display:inline-block; padding-block:8px; font-size:12px; text-decoration:underline; text-underline-offset:4px; }
.analytics-banner .analytics-status { font-size:12px; }
.analytics-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:13px; }
.analytics-actions .button { flex:1; }
html[lang=en] .hero h1 { line-height:1.18; }
html[lang=en] .writing-heading { align-items:flex-start; }
html[lang=en] .writing-heading>div { max-width:650px; }
html[lang=en] .writing-heading>p { max-width:330px; }
html[lang=ja] h1,html[lang=ja] h2 { letter-spacing:-.03em; }
@media (max-width:900px) {
  .nav-links { display:none; }
  .nav .language-menu { margin-left:auto; }
  .nav>.button { margin-left:0; }
}
@media (max-width:640px) {
  .nav { gap:10px; }
  .nav>.button-small { padding-inline:10px; }
  .language-menu summary { padding-inline:6px; }
  .analytics-banner { right:12px; bottom:12px; width:calc(100% - 24px); padding:20px; }
  .analytics-actions { gap:9px; }
  html[lang=en] .hero h1 { font-size:clamp(31px,8vw,42px); }
  html[lang=ja] .hero h1 { font-size:clamp(25px,6.8vw,36px); }
}
@media (max-width:400px) {
  .nav { gap:8px; }
  .brand-logo { width:104px; }
  .language-menu { font-size:11px; }
  body:has(.policy-page) .nav .text-button { font-size:12px; }
}
