/* Topics only: current front/contact visual language without touching legacy pages. */
.sl-topics-page .sl-topic-fallback-brand { position:absolute; z-index:1; left:16px; bottom:16px; display:flex; align-items:center; width:clamp(104px,10vw,136px); max-width:calc(100% - 32px); padding:9px 11px; border:1px solid var(--sl-ink); background:var(--sl-paper); }
.sl-topics-page .sl-topic-fallback-brand img { display:block; width:100%; height:auto; object-fit:contain; transform:none!important; }
body.sl-topics-page .sl-topics-contact h2 { max-width:960px; font-size:clamp(38px,5.8vw,84px)!important; line-height:1.2; letter-spacing:-.05em; text-wrap:pretty; }
body.sl-topics-page .sl-nav > a.sl-nav-contact { color:#fff!important; }
body.sl-topics-page .sl-topics-contact > a { color:var(--sl-yellow)!important; }
body.sl-topics-page { --sl-ink:#16181c; --sl-cloud:#ebe6da; --sl-paper:#f4f0e6; --sl-blue:#1f4fa3; --sl-yellow:#f3c21b; --sl-red:#e2412b; --sl-line:rgba(22,24,28,.18); min-width:0!important; width:100%; margin:0; overflow-x:hidden; background:var(--sl-paper)!important; color:var(--sl-ink); font-family:"Noto Sans JP",-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN",sans-serif; text-align:left; }
body.sl-topics-page *,body.sl-topics-page *::before,body.sl-topics-page *::after { box-sizing:border-box; }
body.sl-topics-page .sl-topics-shell { width:100%; min-width:0; overflow:hidden; }
body.sl-topics-page h1,body.sl-topics-page h2,body.sl-topics-page h3 { position:static; display:block; width:auto; height:auto; min-height:0; margin:0; padding:0; border:0; background:none; color:inherit; text-align:left; }
body.sl-topics-page a { color:inherit!important; text-decoration:none; } body.sl-topics-page a:focus-visible,body.sl-topics-page summary:focus-visible { outline:3px solid var(--sl-blue); outline-offset:3px; }
.sl-topics-page .sl-site-header,.sl-topics-page .sl-kicker,.sl-topics-page .sl-site-footer { font-family:"Space Grotesk","Noto Sans JP",sans-serif; }
.sl-topics-page .sl-site-header { position:absolute; z-index:5; top:0; left:0; display:flex; align-items:center; justify-content:space-between; width:100%; padding:24px clamp(18px,4vw,64px); }
.sl-topics-page .sl-logo-plate { display:flex; align-items:center; width:clamp(160px,16vw,226px); height:48px; padding:10px 14px; border:1px solid rgba(22,24,28,.24); background:var(--sl-cloud); }.sl-topics-page .sl-logo-plate img { display:block; width:100%; height:auto; }
.sl-topics-page .sl-nav { display:flex; align-items:center; gap:clamp(15px,2.2vw,35px); font:500 11px "IBM Plex Mono",monospace; letter-spacing:.1em; }.sl-topics-page .sl-nav a { padding:8px 0; }.sl-topics-page .sl-nav-contact { padding:11px 15px!important; background:var(--sl-ink); color:#fff!important; }.sl-topics-page .sl-mobile-nav { display:none; }
.sl-topics-page .sl-kicker { display:flex; gap:10px; align-items:center; font:500 10px "IBM Plex Mono",monospace; letter-spacing:.12em; }.sl-topics-page .sl-kicker span { display:inline-grid; min-width:31px; min-height:22px; padding:0 7px; place-items:center; background:var(--sl-red); color:#fff; }
.sl-topics-hero { position:relative; display:flex; align-items:flex-end; min-height:485px; padding:145px clamp(18px,7vw,112px) 69px; overflow:hidden; background-color:var(--sl-cloud); background-image:linear-gradient(rgba(22,24,28,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(22,24,28,.12) 1px,transparent 1px); background-size:clamp(42px,5vw,70px) clamp(42px,5vw,70px); }.sl-topics-hero-copy { position:relative; z-index:1; max-width:800px; }.sl-topics-hero h1 { margin-top:19px!important; font:600 clamp(74px,12vw,178px)/.78 "Space Grotesk",sans-serif!important; letter-spacing:-.1em; }.sl-topics-hero-copy>p:last-child { max-width:530px; margin:27px 0 0!important; font-size:15px; line-height:2; }.sl-topics-shape { position:absolute; border:1px solid var(--sl-ink); pointer-events:none; }.sl-topics-shape--circle { top:83px; right:11%; width:clamp(130px,22vw,310px); height:clamp(130px,22vw,310px); border:clamp(23px,3.7vw,54px) solid var(--sl-blue); border-radius:50%; }.sl-topics-shape--square { right:31%; bottom:-30px; width:clamp(55px,7vw,94px); height:clamp(55px,7vw,94px); background:var(--sl-yellow); transform:rotate(45deg); }
.sl-topics-tabs { display:flex; flex-wrap:wrap; padding:0 clamp(18px,7vw,112px); border-bottom:1px solid var(--sl-ink); background:var(--sl-paper); }.sl-topics-tabs a { position:relative; min-width:104px; padding:19px 23px; border-right:1px solid var(--sl-ink); font:600 11px "IBM Plex Mono",monospace; letter-spacing:.1em; }.sl-topics-tabs a:first-child { border-left:1px solid var(--sl-ink); }.sl-topics-tabs a[aria-current="page"] { background:var(--sl-ink); color:var(--sl-yellow)!important; }
.sl-topics-feed { padding:clamp(68px,9vw,130px) clamp(18px,7vw,112px); background:var(--sl-paper); }.sl-topics-section-head { display:flex; justify-content:space-between; gap:25px; align-items:end; padding-bottom:28px; border-bottom:1px solid var(--sl-ink); }.sl-topics-section-head h2 { font-size:clamp(35px,4.4vw,65px)!important; font-weight:550; letter-spacing:-.065em; line-height:1.05; }
.sl-topics-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-left:1px solid var(--sl-ink); }.sl-topic-card { min-width:0; border-right:1px solid var(--sl-ink); border-bottom:1px solid var(--sl-ink); }.sl-topic-card-link { display:flex; flex-direction:column; height:100%; }.sl-topic-card-media { position:relative; aspect-ratio:1.35/1; overflow:hidden; background:var(--sl-blue); }.sl-topic-card-media img { display:block; width:100%; height:100%; object-fit:cover; }.sl-topic-card-fallback { position:absolute; inset:0; display:block; overflow:hidden; background:linear-gradient(135deg,var(--sl-blue) 0 54%,var(--sl-red) 54%); }.sl-topic-card-fallback i { position:absolute; top:18%; right:15%; width:36%; aspect-ratio:1; border:clamp(9px,1.4vw,18px) solid var(--sl-yellow); border-radius:50%; }.sl-topic-card-fallback b { position:absolute; bottom:-13%; left:13%; width:54%; height:54%; background:var(--sl-cloud); transform:rotate(45deg); }.sl-topic-card-copy { display:flex; flex:1; flex-direction:column; min-width:0; padding:20px; }.sl-topic-card-meta { display:flex; flex-wrap:wrap; gap:7px 11px; color:rgba(22,24,28,.67); font:9px "IBM Plex Mono",monospace; letter-spacing:.08em; }.sl-topic-card-meta span::before { margin-right:11px; content:"/"; }.sl-topic-card h3 { margin-top:24px!important; overflow-wrap:anywhere; font-size:clamp(19px,2vw,28px)!important; font-weight:550; letter-spacing:-.045em; line-height:1.32; }.sl-topic-card p { margin:15px 0 0!important; overflow-wrap:anywhere; font-size:13px; line-height:1.85; }.sl-topic-card-arrow { margin-top:auto; padding-top:27px; color:var(--sl-blue); font:600 10px "IBM Plex Mono",monospace; letter-spacing:.1em; }.sl-topic-card:hover .sl-topic-card-media img { transform:scale(1.035); }.sl-topic-card-media img { transition:transform .25s ease; }
.sl-topics-page .navigation.pagination { display:flex; gap:5px; justify-content:center; margin-top:43px; font:600 10px "IBM Plex Mono",monospace; letter-spacing:.08em; }.sl-topics-page .nav-links { display:flex; flex-wrap:wrap; gap:5px; justify-content:center; }.sl-topics-page .page-numbers { display:grid; min-width:35px; min-height:35px; padding:0 8px; place-items:center; border:1px solid var(--sl-ink); }.sl-topics-page .page-numbers.current { background:var(--sl-ink); color:var(--sl-yellow)!important; }.sl-topics-page .page-numbers.next,.sl-topics-page .page-numbers.prev { min-width:auto; }
.sl-topics-empty { display:grid; min-height:245px; padding:30px; place-items:center; border:1px solid var(--sl-ink); background:var(--sl-cloud); text-align:center; }.sl-topics-empty span { display:block; width:64px; height:64px; border:14px solid var(--sl-blue); border-radius:50%; }.sl-topics-empty p { margin:20px 0 0; font-size:14px; }
.sl-topics-contact { position:relative; min-height:425px; padding:clamp(68px,9vw,120px) clamp(18px,7vw,112px) 54px; overflow:hidden; background:var(--sl-blue); color:#fff; }.sl-topics-contact>* { position:relative; z-index:1; }.sl-topics-contact .sl-kicker span { background:var(--sl-yellow); color:var(--sl-ink); }.sl-topics-contact h2 { margin-top:22px!important; max-width:700px; font-size:clamp(46px,7.2vw,104px)!important; font-weight:550; letter-spacing:-.085em; line-height:.95; }.sl-topics-contact>a { display:inline-flex; gap:33px; align-items:center; margin-top:46px; padding-bottom:12px; border-bottom:2px solid var(--sl-yellow); color:var(--sl-yellow)!important; font:600 19px "Space Grotesk",sans-serif; letter-spacing:-.04em; }.sl-topics-contact-shape { position:absolute; top:-15%; right:-2%; width:min(42vw,520px); aspect-ratio:1; border:1px solid var(--sl-yellow); border-radius:50%; }.sl-topics-footer { display:flex; justify-content:space-between; gap:18px; padding:20px clamp(18px,4vw,64px); background:var(--sl-ink); color:rgba(255,255,255,.7); font:9px "IBM Plex Mono",monospace; letter-spacing:.1em; }
.sl-topic-article { max-width:950px; padding:clamp(138px,15vw,205px) clamp(18px,7vw,112px) clamp(68px,9vw,120px); margin:0 auto; }.sl-topic-article-head { padding-bottom:43px; border-bottom:1px solid var(--sl-ink); }.sl-topic-meta { display:flex; flex-wrap:wrap; gap:10px; margin-top:25px; color:rgba(22,24,28,.68); font:10px "IBM Plex Mono",monospace; letter-spacing:.08em; }.sl-topic-terms { display:flex; flex-wrap:wrap; gap:10px; }.sl-topic-terms a { color:var(--sl-blue)!important; text-decoration:underline; text-underline-offset:3px; }.sl-topic-article h1 { margin-top:20px!important; overflow-wrap:anywhere; font-size:clamp(37px,6vw,78px)!important; font-weight:550; letter-spacing:-.075em; line-height:1.09; }.sl-topic-featured-image { margin:42px 0 0; }.sl-topic-featured-image img { display:block; width:100%; height:auto; max-height:650px; object-fit:cover; }.sl-topic-content { max-width:760px; margin:54px auto 0; overflow-wrap:anywhere; font-size:16px; line-height:2; }.sl-topic-content>* { max-width:100%; }.sl-topic-content h1,.sl-topic-content h2,.sl-topic-content h3,.sl-topic-content h4 { margin:2.3em 0 .8em!important; font-weight:600; letter-spacing:-.04em; line-height:1.35; }.sl-topic-content h2 { font-size:clamp(26px,3vw,38px)!important; }.sl-topic-content h3 { font-size:clamp(21px,2.4vw,30px)!important; }.sl-topic-content p,.sl-topic-content ul,.sl-topic-content ol { margin:0 0 1.5em!important; }.sl-topic-content ul,.sl-topic-content ol { padding-left:1.5em; }.sl-topic-content a { color:var(--sl-blue)!important; text-decoration:underline; text-underline-offset:3px; }.sl-topic-content img,.sl-topic-content video,.sl-topic-content iframe { max-width:100%; height:auto; }.sl-topic-content iframe { display:block; width:100%; min-height:min(56vw,440px); border:0; }.sl-topic-content figure { max-width:100%; margin:2em 0; }.sl-topic-content figcaption { margin-top:9px; color:rgba(22,24,28,.68); font-size:12px; line-height:1.6; }.sl-topic-content table { display:block; width:max-content; max-width:100%; overflow:auto; border-collapse:collapse; font-size:14px; }.sl-topic-content th,.sl-topic-content td { padding:10px; border:1px solid var(--sl-line); }.sl-topic-content pre,.sl-topic-content code { max-width:100%; overflow:auto; font-family:"IBM Plex Mono",monospace; }.sl-topic-content pre { padding:16px; background:var(--sl-ink); color:#fff; font-size:13px; line-height:1.65; }.sl-topic-post-nav { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); gap:20px; align-items:center; max-width:1174px; padding:0 clamp(18px,7vw,112px) clamp(72px,9vw,120px); margin:0 auto; }.sl-topic-post-nav>a:not(.sl-topic-post-nav-all) { min-width:0; padding:18px 0; border-top:1px solid var(--sl-ink); }.sl-topic-post-nav>a:last-child { text-align:right; }.sl-topic-post-nav span { display:block; color:var(--sl-blue); font:9px "IBM Plex Mono",monospace; letter-spacing:.1em; }.sl-topic-post-nav strong { display:block; margin-top:7px; overflow-wrap:anywhere; font-size:14px; line-height:1.45; }.sl-topic-post-nav-all { padding:11px 14px; border:1px solid var(--sl-ink); font:600 9px "IBM Plex Mono",monospace; letter-spacing:.1em; }
@media (max-width:960px) { .sl-topics-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.sl-topics-hero { min-height:420px; } }
@media (max-width:820px) { .sl-topics-page .sl-site-header { padding:16px 18px; }.sl-topics-page .sl-logo-plate { width:165px; height:42px; padding:9px 11px; }.sl-topics-page .sl-nav { display:none; }.sl-topics-page .sl-mobile-nav { position:relative; display:block; }.sl-topics-page .sl-mobile-nav summary { display:flex; gap:9px; align-items:center; min-height:42px; padding:0 2px; cursor:pointer; list-style:none; font:10px "IBM Plex Mono",monospace; letter-spacing:.1em; }.sl-topics-page .sl-mobile-nav summary::-webkit-details-marker { display:none; }.sl-topics-page .sl-menu-mark,.sl-topics-page .sl-menu-mark::before { display:block; width:20px; height:1px; background:var(--sl-ink); content:""; transition:transform .2s ease; }.sl-topics-page .sl-menu-mark::before { transform:translateY(-6px); }.sl-topics-page .sl-mobile-nav[open] .sl-menu-mark { transform:rotate(45deg); }.sl-topics-page .sl-mobile-nav[open] .sl-menu-mark::before { transform:rotate(-90deg); }.sl-topics-page .sl-mobile-nav nav { position:absolute; top:53px; right:0; display:grid; width:min(270px,calc(100vw - 36px)); padding:10px 17px; background:var(--sl-ink); color:#fff; box-shadow:8px 8px 0 var(--sl-yellow); }.sl-topics-page .sl-mobile-nav nav a { padding:14px 0; border-bottom:1px solid rgba(255,255,255,.2); font:12px "IBM Plex Mono",monospace; letter-spacing:.08em; }.sl-topics-page .sl-mobile-nav nav a:last-child { border:0; color:var(--sl-yellow)!important; }.sl-topics-hero { min-height:386px; padding:132px 18px 53px; }.sl-topics-hero h1 { font-size:clamp(68px,21vw,105px)!important; }.sl-topics-hero-copy>p:last-child { margin-top:20px!important; font-size:14px; }.sl-topics-shape--circle { top:93px; right:-18px; }.sl-topics-shape--square { right:34%; }.sl-topics-tabs { padding:0 18px; overflow-x:auto; flex-wrap:nowrap; }.sl-topics-tabs a { min-width:max-content; padding:16px 17px; }.sl-topics-feed { padding:72px 18px; }.sl-topics-section-head { display:block; padding-bottom:21px; }.sl-topics-section-head h2 { margin-top:17px!important; }.sl-topic-card-copy { padding:17px; }.sl-topic-card h3 { margin-top:20px!important; }.sl-topic-card p { font-size:12px; }.sl-topics-contact { min-height:390px; padding:73px 18px 40px; }.sl-topics-contact h2 { margin-top:19px!important; }.sl-topics-contact-shape { top:12%; right:-31%; width:88vw; }.sl-topics-footer { flex-direction:column; align-items:flex-start; padding:17px 18px; font-size:8px; }.sl-topic-article { padding:131px 18px 70px; }.sl-topic-content { margin-top:39px; font-size:15px; line-height:1.95; }.sl-topic-post-nav { grid-template-columns:1fr 1fr; gap:12px; padding:0 18px 72px; }.sl-topic-post-nav-all { grid-row:2; grid-column:1/-1; justify-self:center; }.sl-topic-post-nav strong { font-size:12px; } }
@media (max-width:560px) { .sl-topics-grid { grid-template-columns:1fr; }.sl-topic-card-media { aspect-ratio:1.5/1; }.sl-topic-post-nav { display:grid; }.sl-topic-post-nav>a:last-child { text-align:left; } }
@media (prefers-reduced-motion:reduce) { .sl-topics-page *, .sl-topics-page *::before, .sl-topics-page *::after { scroll-behavior:auto!important; animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; } }
