:root{--bg:#f4f4f6;--surface:#fff;--ink:#1a1a1a;--muted:#5f6368;--line:#e6e6ea;--navy:#1a1a1a;--navy-2:#3a3a3a;--link:#1a56c4;--head:"M PLUS Rounded 1c", "Hiragino Maru Gothic ProN", "Hiragino Sans", "Yu Gothic UI", Meiryo, sans-serif;--sans:"Hiragino Sans", "Hiragino Kaku Gothic ProN", "Noto Sans JP", "Yu Gothic UI", Meiryo, sans-serif;--radius:20px;--shadow:0 1px 2px #1a1a1a0a;--max:1120px;--prose:760px;--gutter:16px}*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background:var(--surface);color:var(--ink);font-family:var(--sans);letter-spacing:.02em;margin:0;font-size:16px;line-height:1.85}img{max-width:100%;height:auto}a{color:var(--link);text-underline-offset:3px}main{background:var(--bg)}a:hover{color:var(--ink)}:focus-visible{outline:3px solid var(--link);outline-offset:2px}.container{max-width:var(--max);padding:0 var(--gutter);margin:0 auto}.prose-wrap{max-width:calc(var(--prose) + var(--gutter) * 2);padding:0 var(--gutter);margin:0 auto}@media (width>=720px){:root{--gutter:24px}}.site-header{background:var(--surface)}.site-header .container{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;min-height:72px;display:flex}.logo{font-family:var(--head);letter-spacing:.08em;color:var(--navy);font-size:1.45rem;font-weight:800;line-height:1;text-decoration:none}.logo:hover{color:var(--navy)}.site-nav ul{gap:4px;margin:0;padding:0;list-style:none;display:flex}.site-nav a{color:var(--ink);border-radius:999px;padding:6px 14px;font-size:.9rem;font-weight:700;text-decoration:none;display:inline-block}.site-nav a:hover{background:var(--bg);color:var(--ink)}.site-nav a[aria-current=page]{background:var(--navy);color:#fff}@media (width<=640px){.site-header .container{padding-top:12px;padding-bottom:10px}.site-nav{width:100%;overflow-x:auto}.site-nav a{white-space:nowrap;padding:6px 12px;font-size:.84rem}}.breadcrumb{color:var(--muted);margin:20px 0 0;font-size:.8rem}.breadcrumb ol{flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none;display:flex}.breadcrumb li+li:before{content:"›";margin-right:6px}.breadcrumb a{color:var(--muted)}.btn{border:2px solid var(--navy);border-radius:999px;padding:11px 24px;font-size:.92rem;font-weight:700;line-height:1.4;text-decoration:none;display:inline-block}.btn-primary,.btn-navy{background:var(--navy);color:#fff}.btn-primary:hover,.btn-navy:hover{background:var(--navy-2);border-color:var(--navy-2);color:#fff}.btn-ghost{background:var(--surface);color:var(--navy)}.btn-ghost:hover{background:var(--bg);color:var(--navy)}.hero{background:var(--surface);overflow:hidden}.hero .container{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);align-items:center;gap:32px;padding-top:clamp(40px,7vw,80px);padding-bottom:clamp(40px,7vw,80px);display:grid}.hero h1{font-family:var(--head);letter-spacing:.02em;color:var(--ink);margin:0 0 20px;font-size:clamp(1.9rem,4.1vw,3.1rem);font-weight:800;line-height:1.4}.hero h1 span{white-space:nowrap;display:block}.hero-body p{color:var(--muted);max-width:30em;margin:0 0 28px}.hero-actions{flex-wrap:wrap;gap:12px;display:flex}.hero-cards{justify-content:center;align-items:center;min-height:340px;padding:12px 0;display:flex;position:relative}.hero-cards:before,.hero-cards:after{content:"";z-index:0;border-radius:50%;position:absolute}.hero-cards:before{background:var(--bg);width:340px;height:340px;top:50%;left:50%;transform:translate(-50%,-50%)}.hero-cards:after{display:none}.hero-cards .tcard{z-index:1;flex:none;width:210px;position:relative}.hero-cards .tcard+.tcard{margin-left:-70px}@media (width<=820px){.hero .container{grid-template-columns:1fr}.hero-cards{min-height:0;padding:20px 0 8px}.hero-cards .tcard{width:min(160px,40vw)}.hero-cards .tcard+.tcard{margin-left:min(-56px,-14vw)}.hero-cards:before{width:240px;height:240px}}.section{padding:clamp(40px,6vw,64px) 0}.section-head{margin-bottom:24px}.section-title{font-family:var(--head);color:var(--navy);margin:0 0 6px;font-size:clamp(1.35rem,3vw,1.7rem);font-weight:800;line-height:1.4}.section-lead{color:var(--muted);margin:0;font-size:.92rem}.more-link{text-align:center;margin:24px 0 0}.card-grid{grid-template-columns:repeat(auto-fill,minmax(min(200px,42vw),1fr));gap:clamp(14px,2.4vw,24px);display:grid}.tcard{--c1:#e9e9ed;--c2:#1a1a1a;aspect-ratio:63/88;background:var(--c1);color:var(--ink);transform:rotate(var(--tilt,0deg));border-radius:18px;padding:7px;text-decoration:none;transition:transform .2s,box-shadow .2s;display:block;position:relative;overflow:hidden;box-shadow:0 1px 2px #1a1a1a14,0 8px 20px #1a1a1a14;container-type:inline-size}a.tcard:hover{transform:rotate(var(--tilt,0deg)) translateY(-4px);color:var(--ink);box-shadow:0 4px 8px #1f2a3a24,0 16px 32px #1f2a3a2e}a.tcard:after{content:"";pointer-events:none;background:linear-gradient(115deg,#0000 35%,#ffffff8c 50%,#0000 65%);position:absolute;inset:0;transform:translate(-120%)}a.tcard:hover:after{transition:transform .7s;transform:translate(120%)}.tcard-inner{background:#fff;border-radius:12px;flex-direction:column;gap:3cqi;height:100%;padding:4cqi;display:flex}.tcard-head{justify-content:space-between;align-items:center;gap:2cqi;display:flex}.tcard-name{font-family:var(--head);letter-spacing:.02em;text-overflow:ellipsis;white-space:nowrap;font-size:8.4cqi;font-weight:800;line-height:1.25;overflow:hidden}.tcard-type{color:#fff;background:var(--c2);border-radius:999px;flex:none;padding:.5cqi 3.4cqi;font-size:4.6cqi;font-weight:700;line-height:1.6}.tcard-art{background:#f4f4f6;border-radius:10px;flex:auto;place-items:center;min-height:0;display:grid;overflow:hidden}.tcard-art img{border-radius:18%;width:62%;height:auto;box-shadow:0 4px 12px #00000026}.tcard-emoji{font-size:26cqi;line-height:1}.tcard-sub{color:var(--muted);border-bottom:1px solid #e6e6ea;padding-bottom:1cqi;font-size:4.4cqi;font-weight:700}.tcard-text{color:var(--ink);-webkit-line-clamp:3;-webkit-box-orient:vertical;min-height:24.96cqi;margin:0;font-size:5.2cqi;line-height:1.6;display:-webkit-box;overflow:hidden}.tcard-foot{font-family:var(--head);color:var(--muted);justify-content:space-between;font-size:4.2cqi;font-weight:700;display:flex}.panel{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);padding:clamp(20px,4vw,36px)}.post-list{gap:12px;margin:0;padding:0;list-style:none;display:grid}.post-list a{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);color:var(--ink);padding:18px 20px;text-decoration:none;display:block}.post-list a:hover h3{text-decoration:underline}.post-list time{color:var(--muted);font-size:.78rem}.post-list h3{font-family:var(--head);margin:2px 0 4px;font-size:1.05rem;font-weight:800;line-height:1.5}.post-list p{color:var(--muted);margin:0;font-size:.86rem}.principles{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:0;padding:0;list-style:none;display:grid}.principles li{background:var(--surface);border-radius:var(--radius);padding:26px}.principles h3{font-family:var(--head);color:var(--navy);margin:0 0 8px;font-size:1.05rem;font-weight:800}.principles p{color:var(--muted);margin:0;font-size:.9rem}@media (width<=820px){.principles{grid-template-columns:1fr}}.note{background:var(--surface);border:2px dashed var(--line);border-radius:var(--radius);color:var(--muted);padding:20px 24px;font-size:.92rem}.article-hero{grid-template-columns:220px minmax(0,1fr);align-items:center;gap:clamp(20px,4vw,40px);margin:20px 0 24px;display:grid}.article-hero .tcard{width:220px}.article-header h1{font-family:var(--head);color:var(--navy);margin:6px 0 12px;font-size:clamp(1.45rem,3.6vw,2rem);font-weight:800;line-height:1.5}.article-meta{color:var(--muted);flex-wrap:wrap;gap:14px;margin-bottom:18px;font-size:.8rem;display:flex}.kicker{color:#fff;background:var(--navy);border-radius:999px;padding:2px 12px;font-size:.76rem;font-weight:700;display:inline-block}.article-header.plain{margin:20px 0 24px}@media (width<=680px){.article-hero{text-align:left;grid-template-columns:1fr;justify-items:center}.article-hero .tcard{width:200px}.article-hero .article-header{width:100%}}.toc{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);margin:0 0 20px;padding:18px 22px;font-size:.92rem}.toc strong{font-family:var(--head);color:var(--navy);margin-bottom:6px;font-weight:800;display:block}.toc ol{margin:0;padding-left:1.4em}.toc ul{margin:2px 0 4px;padding-left:1.2em;font-size:.88rem;list-style:circle}.toc a{color:var(--ink);text-decoration:none}.toc a:hover{text-decoration:underline}.prose-wrap .prose{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);padding:clamp(20px,4.5vw,44px)}.prose>:first-child{margin-top:0}.prose h2{font-family:var(--head);background:var(--bg);color:var(--ink);border-radius:12px;margin:2.6em 0 1em;padding:.6em .9em .6em 2.2em;font-size:1.32rem;font-weight:800;line-height:1.5;position:relative}.prose h2:before{content:"";background:var(--ink);border-radius:50%;width:.6em;height:.6em;margin-top:-.3em;position:absolute;top:50%;left:.9em}.prose h3{font-family:var(--head);border-bottom:2px dotted var(--line);margin:2em 0 .7em;padding-bottom:.3em;font-size:1.1rem;font-weight:800}.prose p{margin:0 0 1.4em}.prose ul,.prose ol{margin:0 0 1.4em;padding-left:1.4em}.prose li{margin-bottom:.4em}.prose img{border:1px solid var(--line);border-radius:8px;margin:1.8em auto;display:block}.prose figure.shot{max-width:300px;margin:2.2em auto}.prose figure.shot img{border-radius:12px;width:100%;height:auto;margin:0}.prose figure.shot figcaption{color:var(--muted);text-align:center;margin-top:8px;font-size:.8rem;line-height:1.7}.prose blockquote{border-left:4px solid var(--ink);background:var(--bg);color:var(--muted);margin:1.6em 0;padding:.8em 1.2em}.prose table{border-collapse:collapse;width:100%;margin:1.6em 0;font-size:.9rem;display:block;overflow-x:auto}.prose th,.prose td{border:1px solid var(--line);text-align:left;vertical-align:top;padding:9px 12px}.prose th{background:var(--bg);white-space:nowrap}.prose code{background:var(--bg);border-radius:4px;padding:.15em .4em;font-size:.88em}.prose pre{border-radius:10px;padding:16px;font-size:.86rem;overflow-x:auto}.prose pre code{background:0 0;padding:0}.app-box{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);border:2px solid var(--ink);grid-template-columns:1fr auto;align-items:center;gap:14px 20px;margin:0 0 20px;padding:18px 22px;display:grid}.app-box strong{font-family:var(--head);color:var(--navy);font-size:1.05rem;font-weight:800;display:block}.app-box small{color:var(--muted);font-size:.82rem}@media (width<=560px){.app-box{grid-template-columns:1fr}.app-box .btn{text-align:center}}.ad-unit{text-align:center;margin:24px 0}.related{margin:48px 0 0}.related>h2{font-family:var(--head);color:var(--navy);margin:0 0 16px;font-size:1.15rem;font-weight:800}.related .card-grid{grid-template-columns:repeat(auto-fill,minmax(min(180px,42vw),1fr))}.pager{flex-wrap:wrap;justify-content:space-between;gap:16px;margin:32px 0 0;font-size:.88rem;display:flex}.page-header{margin:20px 0 24px}.page-header h1{font-family:var(--head);color:var(--navy);margin:0 0 6px;font-size:clamp(1.5rem,4vw,2.1rem);font-weight:800;line-height:1.45}.page-header p{color:var(--muted);margin:0;font-size:.92rem}main>.container:last-child,main>.prose-wrap:last-child{padding-bottom:clamp(56px,8vw,88px)}.site-footer{color:#e9e9ec;background:#1a1a1a;padding:44px 0 28px;font-size:.88rem}.footer-grid{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:28px;display:flex}.footer-brand .logo{color:#fff;font-size:1.3rem}.footer-brand p{opacity:.75;margin:10px 0 0;font-size:.84rem}.footer-links{grid-template-columns:repeat(2,auto);gap:8px 36px;margin:0;padding:0;list-style:none;display:grid}.site-footer a{color:#e6ecf4;text-decoration:none}.site-footer a:hover{color:#fff;text-decoration:underline}.copyright{opacity:.6;margin:36px 0 0;font-size:.74rem}@media (width<=560px){.footer-links{grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){*,:after{transition:none!important}a.tcard:hover{transform:rotate(var(--tilt,0deg))}}.tcard-name.is-long{font-size:7cqi}.tcard-name.is-xlong{font-size:6cqi}