/*
Theme Name: Okaneta Cocoon Child
Description: Okaneta compatibility child theme for Cocoon.
Template: cocoon-master
Version: 1.0.0
Text Domain: okaneta-cocoon-child
*/
:root { --ink:#18334a; --night:#18334a; --paper:#fffdf7; --lime:#d9f65c; --coral:#ff9b83; --sky:#aee7f6; --lavender:#d9ccff; --mint:#dff7eb; --muted:#607b88; --line:#dbece5; --radius:8px; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans",Meiryo,sans-serif; line-height:1.7; }
a { color:inherit; text-decoration:none; }
.site-header { position:relative; z-index:3; background:#fffdf7; color:var(--ink); border-bottom:1px solid var(--line); }
.topline { height:6px; background:var(--coral); }
.nav,.container { width:min(1180px,calc(100% - 40px)); margin:auto; }
.nav { height:78px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand { display:flex; align-items:center; }
.brand-logo { display:block; width:224px; height:50px; object-fit:contain; object-position:left center; }
.brand-footer .brand-logo { width:204px; }
.nav-links { display:flex; align-items:center; gap:20px; font-size:14px; font-weight:800; color:#57717d; }.nav-links a:hover { color:#e77560; }.nav-flow-link { color:#8b4e24; }
.home-intro { padding:42px 0 30px; background:#effbf4; border-bottom:1px solid var(--line); }.home-intro h1 { margin:7px 0 8px; font-size:clamp(34px,5vw,58px); line-height:1.18; }.home-intro p { max-width:680px; margin:0; color:#587181; font-weight:700; }
/* Editorial utility comes before featured studio content on the home page. */
body.home main { display:flex; flex-direction:column; } body.home .home-intro { order:1; } body.home .agent-strip { order:2; } body.home .ticker { order:3; } body.home .quick-nav { order:4; } body.home .latest-section { order:5; } body.home .popular-section { order:6; } body.home .pickup-section { order:7; } body.home .writers-section { order:8; } body.home .team-section { order:9; } body.home .office-section { order:10; } body.home .section-dark { order:11; }
.hero { min-height:600px; position:relative; overflow:hidden; color:var(--ink); background-color:#effbf4; background-image:url("assets/tokuhaya-cute-ai-office-1280.webp"); background-position:center; background-size:cover; display:flex; align-items:center; }
.hero-inner { position:relative; z-index:1; width:min(1180px,calc(100% - 40px)); margin:auto; padding:76px 0 92px; }
.eyebrow,.category { font-size:12px; font-weight:900; letter-spacing:0; text-transform:uppercase; color:#e77560; }
.hero h1 { max-width:620px; font-size:clamp(40px,6vw,76px); line-height:1.12; margin:13px 0 18px; letter-spacing:0; }
.hero p { max-width:490px; margin:0 0 26px; color:#466673; font-size:17px; font-weight:700; }.hero-actions { display:flex; flex-wrap:wrap; gap:12px; }
.button { display:inline-flex; min-height:48px; align-items:center; justify-content:center; padding:0 20px; border:1px solid transparent; border-radius:8px; font-weight:900; font-size:14px; }.button-primary { background:var(--lime); color:var(--ink); box-shadow:0 4px 0 #a9c64b; }.button-secondary { border-color:#a4c9d0; color:var(--ink); background:#fffdf7; }
.agent-strip { background:#fffdf7; border-bottom:1px solid var(--line); }.agent-grid { display:grid; grid-template-columns:repeat(3,max-content) 1fr; align-items:center; gap:24px; min-height:86px; }.agent-item { display:flex; align-items:center; gap:9px; }.agent-item b { display:block; font-size:14px; }.agent-item small { display:block; color:var(--muted); font-size:11px; font-weight:700; }.agent-dot { width:36px; height:36px; display:block; border-radius:50%; position:relative; background:var(--lime); box-shadow:inset 0 -5px 0 rgba(24,51,74,.14); }.agent-dot:after { content:""; position:absolute; width:12px; height:6px; border-radius:0 0 9px 9px; background:#18334a; left:12px; top:15px; }.dot-blue { background:var(--sky); }.dot-coral { background:var(--coral); }.agent-grid p { margin:0; justify-self:end; color:#506979; font-size:13px; font-weight:700; }
.ticker { background:var(--mint); border-bottom:1px solid var(--line); }.ticker-inner { display:flex; align-items:center; gap:18px; min-height:56px; overflow:hidden; font-size:14px; font-weight:700; }.ticker-label { flex:0 0 auto; color:#e77560; font-size:12px; }.ticker-text { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.quick-nav { background:#fffdf7; border-bottom:1px solid var(--line); }.quick-nav-inner { display:grid; grid-template-columns:repeat(6,1fr); gap:10px; padding:16px 0; }.quick-nav a { min-height:64px; display:flex; flex-direction:column; justify-content:center; padding:10px 14px; border:1px solid #d8ebe4; border-radius:8px; background:#fffdf7; color:var(--ink); font-size:15px; font-weight:900; }.quick-nav a:hover { border-color:#a9d8c8; background:var(--mint); }.quick-nav span { display:block; margin-bottom:1px; color:#e77560; font-size:10px; font-weight:900; }
.quick-nav .quick-nav-flow { border-color:#d9c9ae; background:#fffaf0; }.quick-nav .quick-nav-flow span { color:#8b4e24; }
.section { padding:68px 0; }.section-heading { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:25px; }.section-heading h2 { margin:4px 0 0; font-size:30px; line-height:1.2; letter-spacing:0; }.section-link { color:#40748a; font-weight:800; font-size:14px; }
.office-section { background:#fffdf7; }.office-stage { position:relative; height:620px; overflow:hidden; border:1px solid #cde7da; border-radius:8px; background:#effbf4; }.office-frame { display:block; width:100%; height:100%; border:0; }.office-caption { position:absolute; inset:auto 22px 18px; display:flex; justify-content:space-between; gap:12px; pointer-events:none; }.office-caption span { padding:5px 10px; border-radius:999px; background:#fffdf7; color:#e77560; font-size:11px; font-weight:900; box-shadow:0 2px 0 rgba(82,143,124,.13); }
.team-section { background:var(--mint); }.team-note { max-width:320px; margin:0; color:#587181; font-size:13px; font-weight:700; }.team-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }.team-card { display:flex; gap:14px; padding:18px; border:1px solid #cde7da; border-radius:8px; background:#fffdf7; box-shadow:0 3px 0 rgba(82,143,124,.12); }.team-card b { display:block; font-size:16px; }.team-card small { display:block; color:#507184; font-size:11px; font-weight:800; }.team-card p { margin:7px 0 0; color:#5f7785; font-size:12px; line-height:1.55; }.role-orb { flex:0 0 40px; height:40px; border-radius:50%; display:grid; place-items:center; color:#18334a; font-size:15px; font-weight:900; box-shadow:inset 0 -5px 0 rgba(24,51,74,.12); }.orb-lime { background:var(--lime); }.orb-coral { background:var(--coral); }.orb-blue { background:var(--sky); }.orb-gold { background:#ffe38b; }.orb-violet { background:var(--lavender); }.orb-cyan { background:#83e4df; }.office-flow { margin-top:18px; padding:18px 22px; display:grid; grid-template-columns:repeat(3,1fr); gap:18px; background:#fffdf7; color:var(--ink); border:1px solid #cde7da; border-radius:8px; }.office-flow b { display:block; color:#e77560; font-size:11px; }.office-flow span { display:block; margin-top:3px; color:#587181; font-size:13px; font-weight:700; }
.popular-section { background:#fffdf7; }.writers-section { background:#f4f1ff; }.writer-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }.writer-card { display:grid; grid-template-columns:88px 1fr; gap:14px; align-items:center; padding:15px; border:1px solid #dfd8f4; border-radius:8px; background:#fffdf7; }.writer-card.office-member { border-color:#9ed7c9; box-shadow:0 3px 0 rgba(82,143,124,.12); }.writer-photo { display:block; width:88px; height:88px; border-radius:50%; background-image:url("assets/tokuhaya-writer-profiles.png"); background-size:300% 200%; background-repeat:no-repeat; }.photo-natsumi { background-position:0 0; }.photo-yuki { background-position:50% 0; }.photo-mina { background-position:100% 0; }.photo-akari { background-position:0 100%; }.photo-tokumi,.photo-shiki,.photo-miruna,.photo-seiri { background-image:url("assets/tokuhaya-ai-desk.png"); background-size:250% 100%; }.photo-tokumi { background-position:0 50%; }.photo-shiki { background-position:34% 50%; }.photo-miruna { background-position:67% 50%; }.photo-seiri { background-position:100% 50%; }.writer-card b { display:block; font-size:17px; }.writer-card small { display:block; color:#6f668a; font-size:11px; font-weight:800; }.writer-card p { margin:6px 0 0; color:#5f7785; font-size:12px; line-height:1.55; }.writer-profile-hero { padding:54px 0; background:#f4f1ff; }.writer-profile-hero .container { display:flex; align-items:center; gap:24px; }.writer-profile-hero h1 { margin:5px 0; font-size:42px; }.writer-profile-hero p { margin:0; color:#587181; line-height:1.7; }.writer-profile-avatar { flex:0 0 118px; width:118px; height:118px; }.article-writer { display:flex; align-items:center; gap:11px; margin:20px 0 26px; padding:12px; border:1px solid #cde7da; border-radius:8px; background:#f3fbf5; color:var(--ink); }.article-writer .writer-photo { width:46px; height:46px; }.article-writer small { display:block; color:#587181; font-size:11px; font-weight:800; }.article-writer-link { margin-left:auto; color:#40748a; font-size:12px; font-weight:900; }
.pickup-section { background:#fffdf7; }.latest-section { background:#f5fbf8; }.feature-grid { display:grid; grid-template-columns:1.16fr .84fr; gap:22px; }.feature-main,.story-card { background:#fffdf7; border:1px solid var(--line); border-radius:8px; overflow:hidden; }.feature-main { min-height:330px; padding:32px; background:#effbe3; display:flex; flex-direction:column; justify-content:end; }.feature-main h3 { margin:10px 0; font-size:30px; line-height:1.28; letter-spacing:0; max-width:570px; }.feature-main p,.story-card p { margin:0; color:#597080; font-size:14px; }.stack { display:grid; gap:14px; }.story-card { padding:18px; display:grid; grid-template-columns:84px 1fr; gap:14px; }.story-card .accent { border-radius:6px; min-height:84px; background:var(--sky); position:relative; overflow:hidden; }.story-card .accent:after { content:""; position:absolute; width:48px; height:48px; border:10px solid var(--lime); border-radius:50%; right:-19px; bottom:-19px; }.story-card h3 { margin:3px 0 7px; font-size:16px; line-height:1.4; }
.cards { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }.post-card { border-top:3px solid var(--lime); padding:19px 0; }.post-card:nth-child(2) { border-color:var(--coral); }.post-card:nth-child(3) { border-color:var(--sky); }.post-card h3 { margin:7px 0; font-size:19px; line-height:1.45; }.post-card p { margin:0; color:#668093; font-size:14px; }.meta { color:#7f96a3; font-size:12px; font-weight:700; }
.section-dark { background:#e8f5ff; color:var(--ink); }.trust-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }.trust { padding:27px; background:#fffdf7; border:1px solid #cfe4ed; border-radius:8px; }.trust b { color:#e77560; font-size:14px; }.trust h3 { margin:8px 0; font-size:19px; }.trust p { margin:0; color:#597080; font-size:14px; }
.site-footer { background:#18334a; color:#dcecf1; padding:40px 0; font-size:13px; }.footer-row { display:flex; justify-content:space-between; gap:20px; align-items:flex-end; }.footer-links { display:flex; flex-wrap:wrap; gap:14px; }.article { max-width:780px; margin:54px auto; background:#fffdf7; padding:clamp(24px,5vw,58px); border-radius:8px; }.article h1 { line-height:1.28; font-size:clamp(30px,4vw,40px); }.article img { max-width:100%; height:auto; }.article a { color:#126c8e; text-decoration:underline; }
.footer-editor { display:grid; grid-template-columns:48px minmax(0,240px); gap:12px; align-items:center; max-width:340px; padding:12px; border:1px solid rgba(220,236,241,.18); border-radius:8px; background:rgba(255,255,255,.06); }
.footer-editor-photo { width:48px; height:48px; border-radius:50%; background:#dff7eb url("assets/iluma-profile.jpg") center/cover no-repeat; box-shadow:0 0 0 2px rgba(255,255,255,.18); }
.footer-editor strong { display:block; color:#fffdf7; font-size:14px; }
.footer-editor p { margin:2px 0 4px; color:#cfe3e8; font-size:11px; line-height:1.55; }
.footer-editor a { color:#d9f65c; font-size:12px; font-weight:900; text-decoration:underline; text-underline-offset:3px; }
.tokuhaya-contact-form { display:grid; gap:14px; max-width:620px; }.tokuhaya-contact-form p { margin:0; }.tokuhaya-contact-form label { display:grid; gap:6px; color:#18334a; font-weight:700; }.tokuhaya-contact-form input,.tokuhaya-contact-form textarea { width:100%; border:1px solid #b9ced5; border-radius:4px; padding:10px; font:inherit; background:#fff; }.tokuhaya-contact-form button { border:0; border-radius:4px; background:#126c8e; color:#fff; font:inherit; font-weight:700; padding:11px 20px; cursor:pointer; }.tokuhaya-contact-notice { padding:12px; background:#e1f4ec; color:#16553f; }.tokuhaya-contact-notice.is-error { background:#fff0ed; color:#8b3022; }.tokuhaya-honeypot { position:absolute; left:-9999px; }
.article .article-visual { margin:26px 0 30px; }.article .article-visual img { display:block; width:100%; border-radius:8px; }.article .article-visual figcaption { margin-top:8px; color:#718792; font-size:12px; }.article .writer-byline { margin:0 0 28px; padding:15px 18px; border-left:5px solid var(--lime); background:var(--mint); color:#365866; font-size:14px; line-height:1.65; }
.article .campaign-tool { margin:28px 0; padding:20px; border:1px solid #cde7da; border-radius:8px; background:#f3fbf5; }.article .campaign-tool h2 { margin:0 0 13px; font-size:21px; }.article .campaign-tool table { width:100%; border-collapse:collapse; font-size:14px; }.article .campaign-tool th,.article .campaign-tool td { padding:12px; border-bottom:1px solid #cde7da; text-align:left; vertical-align:top; line-height:1.6; }.article .campaign-tool th { width:30%; color:#365866; background:#e4f6ea; }.article .action-checklist { margin:18px 0 28px; padding:0; list-style:none; counter-reset:steps; }.article .action-checklist li { position:relative; margin:9px 0; padding:12px 14px 12px 46px; border:1px solid #d7e8e1; border-radius:8px; background:#fffdf7; counter-increment:steps; line-height:1.55; }.article .action-checklist li::before { content:counter(steps); position:absolute; left:12px; top:12px; width:23px; height:23px; display:grid; place-items:center; border-radius:50%; background:var(--lime); color:var(--ink); font-size:12px; font-weight:900; }
@media (max-width:760px) { .nav,.container { width:min(100% - 28px,1180px); }.nav { height:61px; }.brand-logo { width:178px; height:40px; }.nav-links { gap:13px; }.nav-links a:not(:nth-last-child(-n+2)) { display:none; }.hero { min-height:590px; background-position:70% center; align-items:start; }.hero-inner { width:min(100% - 28px,1180px); padding-top:55px; }.hero h1 { max-width:330px; font-size:45px; }.hero p { max-width:325px; font-size:15px; }.agent-grid { grid-template-columns:repeat(3,1fr); gap:8px; min-height:77px; }.agent-grid p { display:none; }.agent-item { gap:6px; }.agent-dot { width:25px; height:25px; }.agent-dot:after { left:8px; top:10px; }.agent-item b { font-size:12px; }.agent-item small { font-size:9px; }.quick-nav-inner { grid-template-columns:repeat(2,1fr); gap:8px; }.quick-nav a { min-height:56px; font-size:14px; }.time-nav-inner { grid-template-columns:1fr; gap:6px; }.time-nav a { min-height:42px; }.time-nav span { font-size:11px; }.section { padding:48px 0; }.office-stage { height:410px; }.office-caption { inset:auto 12px 12px; }.office-caption span { font-size:9px; padding:4px 7px; }.feature-grid,.cards,.trust-grid,.team-grid,.writer-grid,.office-flow { grid-template-columns:1fr; }.team-note { margin-top:10px; }.feature-main h3 { font-size:25px; }.section-heading h2 { font-size:26px; }.office-flow-head h3 { font-size:20px; }.footer-row { align-items:start; flex-direction:column; } }
.writer-profile-link { display:inline-block; margin-top:7px; color:#40748a; font-size:12px; font-weight:900; }.writer-card { align-items:start; }.writer-card .writer-profile-link { text-decoration:underline; }.writer-article-visual { display:flex; align-items:center; gap:20px; min-height:160px; margin:24px 0; padding:22px; border:1px solid #d8ebe4; border-radius:8px; background:#f3fbf5; overflow:hidden; }.writer-article-visual .writer-photo { flex:0 0 116px; width:116px; height:116px; }.writer-article-visual p { margin:0; color:#587181; font-weight:800; }.writer-article-visual.visual-yuki { background:#fff4ef; }.writer-article-visual.visual-natsumi { background:#f1f8e9; }.writer-article-visual.visual-shiki { background:#f4f1ff; }
.office-reference { margin:0 0 18px; overflow:hidden; border:1px solid #cde7da; border-radius:8px; background:#effbf4; }.office-reference img { display:block; width:100%; height:auto; }
body.home .home-intro { padding:28px 0 24px; } body.home .home-intro h1 { margin:4px 0 6px; font-size:clamp(30px,3.5vw,42px); line-height:1.22; } body.home .home-intro p { font-size:14px; font-weight:700; } body.home .agent-strip,body.home .ticker,body.home .pickup-section { display:none; } body.home .quick-nav { order:2; } body.home .latest-section { order:3; } body.home .popular-section { order:4; } body.home .writers-section { order:5; } body.home .team-section { order:6; } body.home .office-section { order:7; } body.home .section-dark { order:8; } body.home .latest-section,body.home .popular-section { padding:42px 0; } body.home .post-card { min-height:132px; padding:15px 0; } body.home .post-card h3 { margin:5px 0 10px; font-size:17px; line-height:1.42; } body.home .post-card p { display:none; } .article-marks { display:flex; flex-wrap:wrap; gap:6px; margin:7px 0 9px; }.article-mark { display:inline-flex; align-items:center; min-height:23px; padding:2px 8px; border-radius:999px; font-size:11px; font-weight:900; line-height:1; }.mark-time { background:#e8f5ff; color:#316a82; }.mark-value { background:#fff0e9; color:#b64e38; }
body.home .post-card { min-height:154px; } .mark-effort { background:#f1f8e9; color:#52732e; }.article-decision { display:grid; gap:4px; margin:4px 0 10px; }.article-reward,.article-entry { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; font-weight:900; line-height:1.45; }.article-reward { color:#b64e38; }.article-entry { color:#587181; }
.mark-kind { background:#18334a; color:#fffdf7; }
.priority-section { padding:42px 0 46px; background:#fff8ec; }.priority-heading { align-items:end; }.priority-grid { display:grid; grid-template-columns:1.2fr .8fr; grid-template-rows:repeat(2,minmax(132px,1fr)); gap:12px; margin-top:20px; }.priority-card { display:flex; flex-direction:column; padding:17px 18px; border:1px solid #ead9bb; border-radius:8px; background:#fffdf7; }.priority-card-main { grid-row:span 2; padding:24px; border-color:#cce59d; background:#f2fadf; }.priority-card-top,.priority-signals { display:flex; flex-wrap:wrap; align-items:center; gap:7px; }.priority-card-top { justify-content:space-between; }.priority-kicker,.priority-time { display:inline-flex; align-items:center; min-height:22px; padding:2px 8px; border-radius:999px; font-size:11px; font-weight:900; line-height:1; }.priority-kicker { background:#18334a; color:#fffdf7; }.priority-time { background:#fffdf7; color:#316a82; border:1px solid #b7d9e4; }.priority-card .category { margin-top:12px; }.priority-card h3 { margin:6px 0 10px; font-size:17px; line-height:1.4; }.priority-card-main h3 { max-width:620px; font-size:25px; line-height:1.32; }.priority-signals strong { color:#b64e38; font-size:14px; }.priority-signals span { color:#52732e; font-size:12px; font-weight:900; }.priority-card p { margin:8px 0 0; color:#587181; font-size:12px; font-weight:800; }.priority-link { display:inline-flex; margin-top:auto; padding-top:13px; color:#316a82; font-size:12px; font-weight:900; text-decoration:underline; text-underline-offset:3px; }.priority-card-main .priority-link { color:#18334a; font-size:13px; } @media (max-width:760px) { .priority-section { padding:36px 0; }.priority-heading { align-items:start; }.priority-grid { grid-template-columns:1fr; grid-template-rows:none; gap:10px; margin-top:16px; }.priority-card-main { grid-row:auto; padding:19px; }.priority-card-main h3 { font-size:21px; }.priority-card:not(.priority-card-main) { min-height:0; }.priority-card h3 { font-size:16px; } }
.time-nav { order:3; border-bottom:1px solid var(--line); background:#fffdf7; }.time-nav-inner { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; padding:12px 0; }.time-nav a { display:grid; grid-template-columns:auto auto 1fr; align-items:center; gap:8px; min-height:46px; padding:9px 13px; border-left:3px solid var(--lime); background:#f7fbf8; }.time-nav a:nth-child(2) { border-color:var(--coral); }.time-nav a:nth-child(3) { border-color:var(--sky); }.time-nav b { font-size:14px; }.time-label { display:inline-flex; align-items:center; min-height:22px; padding:2px 8px; border-radius:999px; background:#18334a; color:#fffdf7; font-size:11px; font-weight:900; line-height:1; }.time-nav-copy { justify-self:end; color:#607b88; font-size:12px; font-weight:800; } body.home .quick-nav { order:2; } body.home .time-nav { order:3; } body.home .latest-section { order:4; } body.home .popular-section { order:5; } body.home .writers-section { order:6; } body.home .team-section { order:7; } body.home .office-section { order:8; } body.home .section-dark { order:9; }

/* A compact, image-led home: the reader reaches current offers before company detail. */
body.home .home-hero { min-height:440px; display:flex; align-items:center; color:#18334a; background:url("assets/tokuhaya-cute-ai-office-1280.webp") center / cover no-repeat; border-bottom:1px solid var(--line); }
body.home .home-hero-inner { padding:56px 0; }
body.home .home-hero-inner > div { width:min(470px,92%); }
body.home .home-hero h1 { margin:8px 0; font-size:clamp(35px,4.6vw,58px); line-height:1.14; }
body.home .home-hero p { margin:0; color:#466673; font-size:16px; font-weight:800; }
body.home .home-hero-link { display:inline-flex; margin-top:18px; padding:10px 14px; border:1px solid #18334a; background:#d9f65c; color:#18334a; font-size:13px; font-weight:900; }
body.home .home-hero-role { max-width:445px; margin:13px 0 0; color:#27465a; font-size:15px; font-weight:900; line-height:1.65; } body.home .home-hero-role-detail::before { content:" "; } body.home .home-hero-subcopy { margin:7px 0 0; color:#52717f; font-size:13px; font-weight:800; }
body.home .home-intro,body.home .agent-strip,body.home .ticker,body.home .pickup-section,body.home .team-section { display:none; }
body.home .latest-section,body.home .popular-section { padding:40px 0; }
body.home .post-card { min-height:116px; padding:14px 0; }
body.home .post-card h3 { margin:5px 0 9px; font-size:17px; line-height:1.42; }
.policy-brief { display:flex; align-items:end; justify-content:space-between; gap:20px; }.policy-brief h2 { margin:4px 0 5px; font-size:28px; line-height:1.2; }.policy-brief p { margin:0; color:#587181; font-weight:700; }
@media (max-width:760px) { body.home .home-hero { position:relative; isolation:isolate; display:block; min-height:0; padding-top:232px; background:none; } body.home .home-hero::before { content:""; position:absolute; inset:0 0 auto; z-index:0; height:232px; background:url("assets/tokuhaya-cute-ai-office-760.webp") 58% center / cover no-repeat; } body.home .home-hero-inner { position:relative; z-index:1; width:100%; padding:22px 14px 26px; background:#fffdf7; } body.home .home-hero-inner > div { width:100%; } body.home .home-hero h1 { margin:7px 0 10px; font-size:34px; line-height:1.2; } body.home .home-hero-role { max-width:none; color:#27465a; font-size:13px; text-shadow:none; }.home-hero-role-detail,.home-hero-subcopy { display:none; } .policy-brief { align-items:start; flex-direction:column; } }
@media (max-width:760px) { .time-nav-inner { grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; padding:10px 0; }.time-nav a { grid-template-columns:1fr; justify-items:start; gap:5px; min-height:70px; padding:9px; }.time-nav b { font-size:13px; }.time-nav-copy { display:none; } }

/* Profile faces remain legible at a glance, including the robot specialists. */
.writer-card { grid-template-columns:104px 1fr; min-height:132px; }.writer-photo { width:104px; height:104px; }.photo-ren,.photo-sora { background-image:url("assets/tokuhaya-writer-profiles-men.png"); background-size:200% 100%; }.photo-ren { background-position:0 50%; }.photo-sora { background-position:100% 50%; }.photo-tokumi,.photo-shiki,.photo-miruna,.photo-seiri { background-image:url("autonomous-office/assets/ai-team-hero.png"); background-size:auto 300%; }.photo-tokumi { background-position:1% 30%; }.photo-shiki { background-position:32% 30%; }.photo-miruna { background-position:68% 30%; }.photo-seiri { background-position:93% 30%; }.article-writer .writer-photo { width:50px; height:50px; }.writer-article-visual .writer-photo { width:126px; height:126px; flex-basis:126px; } @media (max-width:760px) { .writer-card { grid-template-columns:88px 1fr; min-height:112px; }.writer-photo { width:88px; height:88px; } }
.writer-card { grid-template-columns:104px 1fr; min-height:132px; }.writer-photo { width:104px; height:104px; }.photo-ren,.photo-sora { position:relative; overflow:hidden; background-image:none; }.photo-ren { background:#e7eefb; }.photo-sora { background:#e0f5ed; }.photo-ren::before,.photo-sora::before { content:""; position:absolute; width:54px; height:62px; left:25px; top:28px; border-radius:48% 48% 44% 44%; background:#f2c6a8; }.photo-ren::after,.photo-sora::after { content:""; position:absolute; width:62px; height:30px; left:21px; top:19px; border-radius:58% 52% 38% 34%; background:#34465e; box-shadow:17px 35px 0 -13px #34465e, 36px 35px 0 -13px #34465e; }.photo-sora::after { background:#694a3b; box-shadow:17px 35px 0 -13px #345d65, 36px 35px 0 -13px #345d65; }.photo-tokumi,.photo-shiki,.photo-miruna,.photo-seiri { position:relative; overflow:hidden; background-image:none; }.photo-tokumi { background:#dff7eb; }.photo-shiki { background:#fff0ec; }.photo-miruna { background:#e8f0ff; }.photo-seiri { background:#fff7d8; }.photo-tokumi::before,.photo-shiki::before,.photo-miruna::before,.photo-seiri::before { content:""; position:absolute; width:76px; height:66px; left:14px; top:20px; border:5px solid #fffdf7; border-radius:45% 45% 42% 42%; background:#c9eee8; box-shadow:inset 0 0 0 3px #7ec9bc; }.photo-shiki::before { background:#ffd9d1; box-shadow:inset 0 0 0 3px #f0947e; }.photo-miruna::before { background:#d7e5ff; box-shadow:inset 0 0 0 3px #7d9be4; }.photo-seiri::before { background:#ffecb7; box-shadow:inset 0 0 0 3px #e2b64d; }.photo-tokumi::after,.photo-shiki::after,.photo-miruna::after,.photo-seiri::after { content:"•  •"; position:absolute; left:26px; top:32px; width:52px; padding:3px 0 6px; border-radius:18px; background:#effbf8; color:#317a81; font-size:22px; font-weight:900; letter-spacing:5px; line-height:1; text-align:center; }.photo-shiki::after { color:#c85f50; }.photo-miruna::after { color:#5474bf; }.photo-seiri::after { color:#b58226; }.article-writer .writer-photo { width:50px; height:50px; }.writer-article-visual .writer-photo { width:126px; height:126px; flex-basis:126px; } @media (max-width:760px) { .writer-card { grid-template-columns:88px 1fr; min-height:112px; }.writer-photo { width:88px; height:88px; } }

/* Match the soft white shells and compact navy face panels from the top office image. */
.photo-tokumi::before,.photo-shiki::before,.photo-miruna::before,.photo-seiri::before { height:68px; top:19px; border:6px solid #fffdf7; background:#fffdf7; box-shadow:inset 0 0 0 3px #8fded2; }.photo-shiki::before { box-shadow:inset 0 0 0 3px #ff9b83; }.photo-miruna::before { box-shadow:inset 0 0 0 3px #8eaceb; }.photo-seiri::before { box-shadow:inset 0 0 0 3px #f1c75c; }.photo-tokumi::after,.photo-shiki::after,.photo-miruna::after,.photo-seiri::after { left:29px; top:36px; width:46px; padding:4px 0 7px; background:#315666; color:#a7f5e8; font-size:19px; letter-spacing:4px; }.photo-shiki::after { color:#ffb6a6; }.photo-miruna::after { color:#bde8ff; }.photo-seiri::after { color:#ffe09a; }

/* High-fidelity portraits use the same soft 3D lighting as the home office. */
.photo-ren,.photo-sora,.photo-kai,.photo-tokumi,.photo-shiki,.photo-miruna,.photo-seiri { background-image:var(--profile-image); background-size:cover; background-position:center; }.photo-ren { --profile-image:url("assets/article-visuals/ren.png"); }.photo-sora { --profile-image:url("assets/article-visuals/sora.png"); }.photo-kai { --profile-image:url("assets/article-visuals/kai.png"); }.photo-tokumi { --profile-image:url("assets/article-visuals/tokumi.png"); }.photo-shiki { --profile-image:url("assets/article-visuals/shiki.png"); }.photo-miruna { --profile-image:url("assets/article-visuals/miruna.png"); }.photo-seiri { --profile-image:url("assets/article-visuals/seiri.png"); }.photo-ren::before,.photo-ren::after,.photo-sora::before,.photo-sora::after,.photo-kai::before,.photo-kai::after,.photo-tokumi::before,.photo-tokumi::after,.photo-shiki::before,.photo-shiki::after,.photo-miruna::before,.photo-miruna::after,.photo-seiri::before,.photo-seiri::after { content:none; }
.writer-tone-natsumi { --writer-accent:#728d4b; --writer-soft:#f1f8e9; font-family:"Hiragino Sans",Meiryo,sans-serif; }.writer-tone-yuki { --writer-accent:#d96f5b; --writer-soft:#fff4ef; font-family:"Hiragino Maru Gothic ProN","Hiragino Sans",sans-serif; }.writer-tone-mina { --writer-accent:#4c83a8; --writer-soft:#eef7ff; }.writer-tone-akari { --writer-accent:#c86958; --writer-soft:#fff1ed; font-family:"Yu Gothic","Hiragino Sans",sans-serif; }.writer-tone-ren { --writer-accent:#28715e; --writer-soft:#eef8f4; }.writer-tone-kai { --writer-accent:#257f85; --writer-soft:#edf9f8; }.writer-tone-tokumi { --writer-accent:#3c958b; --writer-soft:#effaf8; }.writer-tone-seiri { --writer-accent:#b58a31; --writer-soft:#fff9e9; }.writer-tone-natsumi h2,.writer-tone-yuki h2,.writer-tone-mina h2,.writer-tone-akari h2,.writer-tone-ren h2,.writer-tone-kai h2,.writer-tone-tokumi h2,.writer-tone-seiri h2 { color:var(--writer-accent); }.article .article-visual { overflow:hidden; border:1px solid var(--writer-accent,var(--line)); border-radius:8px; background:var(--writer-soft,#f3fbf5); }.article .article-visual img { display:block; width:100%; aspect-ratio:16 / 7; object-fit:cover; object-position:center; }.article .article-visual figcaption { padding:8px 12px; margin:0; color:var(--writer-accent,#587181); font-weight:800; }
.article-utility { display:flex; flex-wrap:wrap; gap:8px; margin:14px 0 22px; }.article-utility span,.article-utility a { min-height:27px; padding:4px 9px; border:1px solid #cde7da; border-radius:999px; background:#f3fbf5; color:#486b78; font-size:12px; font-weight:900; }.article-utility a { border-color:var(--writer-accent,#607b88); color:var(--writer-accent,#40748a); background:#fffdf7; }.related-articles { margin-top:44px; padding-top:26px; border-top:1px solid var(--line); }.related-articles h2 { margin:4px 0 15px; font-size:25px; color:var(--ink)!important; }.related-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }.related-grid a { min-height:104px; padding:13px; border:1px solid #dbece5; border-radius:8px; background:#fffdf7; }.related-grid a:hover { border-color:var(--writer-accent,#8fded2); background:var(--writer-soft,#f3fbf5); }.related-grid span { display:block; margin-bottom:5px; color:var(--writer-accent,#587181); font-size:11px; font-weight:900; }.related-grid strong { display:block; font-size:14px; line-height:1.5; } @media (max-width:760px) { .related-grid { grid-template-columns:1fr; }.related-grid a { min-height:0; } }
.economy-section { padding:56px 0; border-top:1px solid #dbece5; background:#fffdf8; }.economy-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:10px; }.economy-card { display:flex; min-height:174px; flex-direction:column; gap:8px; padding:16px; border:1px solid #d8e8e2; border-radius:8px; background:#fff; color:#18334a; }.economy-card:hover { transform:translateY(-2px); border-color:#6da28c; box-shadow:0 8px 18px rgba(38,72,81,.08); }.economy-card-kicker { color:#607b88; font-size:10px; font-weight:900; }.economy-card strong { font-size:17px; line-height:1.35; }.economy-card small { color:#526d77; font-size:12px; font-weight:700; line-height:1.55; }.economy-card em { margin-top:auto; color:#2d6b61; font-size:12px; font-style:normal; font-weight:900; }.economy-coral { border-top:4px solid #e98677; }.economy-blue { border-top:4px solid #5e9ed1; }.economy-yellow { border-top:4px solid #e2b742; }.economy-orange { border-top:4px solid #db8e59; }.economy-green { border-top:4px solid #5d9b76; }.economy-badge { display:inline-flex; width:max-content; margin:7px 0 0; padding:3px 7px; border:1px solid #cfe5dc; border-radius:999px; background:#f4fbf8; color:#3b7869; font-size:10px; font-weight:900; }.economy-hub-hero { padding:74px 0 62px; border-bottom:1px solid #dbece5; background:#eef8f3; }.economy-hub-hero h1 { max-width:760px; margin:6px 0 12px; color:#18334a; font-size:43px; line-height:1.2; }.economy-hub-hero p { max-width:680px; margin:0; color:#425f6c; font-size:17px; line-height:1.85; }.economy-hub-actions { display:flex; gap:10px; margin-top:22px; }.economy-hub-actions a { padding:10px 14px; border:1px solid #527f70; border-radius:6px; background:#fff; color:#285a4d; font-weight:900; }.economy-guide { padding:48px 0; background:#fffdf8; }.economy-guide .container { display:grid; grid-template-columns:1.1fr .9fr; gap:38px; align-items:center; }.economy-guide h2 { margin:4px 0 10px; color:#18334a; font-size:28px; }.economy-guide p { margin:0; color:#48626d; line-height:1.8; }.economy-guide ol { margin:0; padding:0; list-style:none; counter-reset:economy-step; }.economy-guide li { position:relative; min-height:48px; padding:12px 0 12px 42px; border-bottom:1px solid #dce9e4; color:#31505f; font-weight:800; counter-increment:economy-step; }.economy-guide li::before { content:counter(economy-step); position:absolute; left:0; top:10px; display:grid; width:26px; height:26px; place-items:center; border-radius:50%; background:#d7eee4; color:#276353; font-size:12px; }.economy-hub .post-card { background:#fff; }
@media (max-width:980px) { .economy-grid { grid-template-columns:repeat(3,1fr); } }
@media (max-width:760px) { .economy-section { padding:42px 0; }.economy-grid { grid-template-columns:1fr 1fr; gap:8px; }.economy-card { min-height:150px; padding:13px; }.economy-card strong { font-size:15px; }.economy-card small { font-size:11px; }.economy-hub-hero { padding:48px 0 40px; }.economy-hub-hero h1 { font-size:32px; }.economy-hub-hero p { font-size:15px; }.economy-guide .container { grid-template-columns:1fr; gap:22px; }.economy-hub-actions a { font-size:13px; } }
.compare-hero { padding:72px 0 62px; background:#e8f5ff; }.compare-hero h1 { margin:7px 0 12px; font-size:46px; }.compare-hero p { max-width:620px; margin:0; color:#587181; font-size:16px; font-weight:700; line-height:1.75; }.compare-groups { display:grid; gap:42px; }.compare-group { padding-bottom:38px; border-bottom:1px solid var(--line); }.compare-table { border-top:2px solid var(--ink); }.compare-table-head,.compare-row { display:grid; grid-template-columns:minmax(0,2fr) 1fr .6fr .8fr; gap:12px; align-items:center; }.compare-table-head { padding:9px 12px; background:#eff8fa; color:#587181; font-size:11px; font-weight:900; }.compare-row { min-height:70px; padding:12px; border-bottom:1px solid var(--line); background:#fffdf7; }.compare-row:hover { background:#f4fbf7; }.compare-row strong { line-height:1.45; }.compare-row span { color:#587181; font-size:13px; font-weight:800; }.deadline-list { display:grid; gap:10px; }.deadline-item { display:flex; justify-content:space-between; gap:20px; align-items:center; padding:18px; border:1px solid #cfe4ed; border-radius:8px; background:#fffdf7; }.deadline-item h2 { margin:5px 0 0; font-size:18px; }.deadline-item > strong { flex:0 0 auto; color:#b64e38; font-size:14px; }.campaign-state { display:flex; flex-wrap:wrap; gap:8px 14px; align-items:center; margin:0 0 18px; padding:13px 15px; border:1px solid #b7d9e4; border-radius:8px; background:#eff8fa; color:#406878; font-size:13px; font-weight:700; }.campaign-state strong { color:#21647c; }.campaign-state-expired { border-color:#e9c5bd; background:#fff1ed; }.campaign-state-expired strong { color:#aa4d3f; }.campaign-state a { color:#21647c; font-weight:900; text-decoration:underline; }.watchlist-toggle { min-height:36px; margin:-10px 0 18px; padding:7px 12px; border:1px solid #8cbf9d; border-radius:8px; background:#f2fadf; color:#3f6532; font:inherit; font-size:13px; font-weight:900; cursor:pointer; }.watchlist-toggle[aria-pressed="true"] { border-color:#316a82; background:#e8f5ff; color:#316a82; }.watchlist-items { display:grid; gap:10px; }.watchlist-item { display:block; padding:18px; border:1px solid #cfe4ed; border-radius:8px; background:#fffdf7; font-weight:900; line-height:1.5; }.watchlist-empty { padding:26px; border:1px dashed #b7d9e4; color:#587181; text-align:center; } @media (max-width:760px) { .compare-hero { padding:48px 0 42px; }.compare-hero h1 { font-size:32px; }.compare-table-head { display:none; }.compare-row { grid-template-columns:1fr 1fr; min-height:0; }.compare-row strong { grid-column:1 / -1; }.deadline-item { align-items:flex-start; flex-direction:column; gap:8px; }.deadline-item > strong { font-size:13px; } }
.money-compass { padding:34px 0 38px; background:#f4f1ff; }.compass-heading { align-items:end; }.compass-control { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-top:18px; }.compass-control button { min-height:48px; border:1px solid #d9cfee; border-radius:8px; background:#fffdf7; color:#4e4770; font:inherit; font-size:14px; font-weight:900; cursor:pointer; }.compass-control button[aria-selected="true"] { border-color:#705b9e; background:#705b9e; color:#fff; }.compass-result { display:flex; align-items:center; gap:16px; margin-top:10px; padding:17px 18px; border:1px solid #ded5f0; border-radius:8px; background:#fffdf7; }.compass-result b { color:#443d65; font-size:16px; }.compass-result p { flex:1; margin:0; color:#657887; font-size:13px; font-weight:700; }.compass-result a { color:#40748a; font-size:13px; font-weight:900; text-decoration:underline; text-underline-offset:3px; }.fact-box { display:grid; grid-template-columns:1fr auto; gap:14px; align-items:center; margin:0 0 24px; padding:15px; border:1px solid #cce3da; border-radius:8px; background:#f3fbf5; }.fact-box strong { display:block; margin-top:2px; color:#264f52; font-size:16px; }.fact-box dl { display:flex; flex-wrap:wrap; gap:9px 16px; margin:0; }.fact-box dl div { display:grid; gap:2px; }.fact-box dt { color:#6d8588; font-size:11px; font-weight:800; }.fact-box dd { margin:0; color:#315c61; font-size:12px; font-weight:900; }.fact-box > a { grid-column:1 / -1; color:#2d7180; font-size:12px; font-weight:900; text-decoration:underline; text-underline-offset:3px; } @media (max-width:760px) { .compass-heading { align-items:start; }.compass-control { grid-template-columns:repeat(2,1fr); }.compass-result { align-items:start; flex-direction:column; gap:8px; }.fact-box { grid-template-columns:1fr; }.fact-box dl { gap:9px 18px; } }
/* Home hierarchy: decision first, navigation second, editorial personality later. */
body.home .home-hero { order:1; }
body.home .priority-section { order:2; background:#fffdf7; border-bottom:1px solid var(--line); }
body.home .money-compass { order:3; background:#eff8fa; border-bottom:1px solid var(--line); }
body.home .quick-nav { order:4; }
body.home .economy-section { order:5; }
body.home .latest-section { order:5; }
body.home .popular-section { order:6; }
body.home .writers-section { order:7; }
body.home .office-section { order:8; }
body.home .section-dark { order:9; }
body.home .priority-section { padding:36px 0 40px; }
body.home .priority-card { border-color:#dbece5; box-shadow:none; }
body.home .priority-card-main { border-color:#b6dccc; background:#effbf4; }
body.home .priority-kicker { background:var(--ink); }
body.home .priority-time { border-color:#b7d9e4; background:#fffdf7; }
body.home .money-compass { padding:30px 0 32px; }
body.home .compass-control button { border-color:#c9dce4; color:#315c72; }
body.home .compass-control button[aria-selected="true"] { border-color:var(--ink); background:var(--ink); color:#fffdf7; }
body.home .compass-result { border-color:#cfe4ed; background:#fffdf7; }
body.home .compass-result b { color:var(--ink); }
body.home .quick-nav { background:#fffdf7; }
body.home .quick-nav a { border-color:#dbece5; box-shadow:none; }
body.home .quick-nav span { color:#52717f; }
body.home .writers-section { background:#f4f1ff; }
.economy-violet { border-top:4px solid #8d72b5; }
.photo-rinka,.photo-masaru,.photo-takumi,.photo-yuki,.photo-kenji,.photo-daichi,.photo-mina,.photo-ren,.photo-kai { background-size:cover; background-position:center; }
.photo-rinka { background-image:url("assets/writers/rinka.png"); }.photo-masaru { background-image:url("assets/writers/masaru.png"); }.photo-takumi { background-image:url("assets/writers/takumi.png"); }.photo-yuki { background-image:url("assets/writers/yuki.png"); }.photo-kenji { background-image:url("assets/writers/kenji.png"); }.photo-daichi { background-image:url("assets/writers/daichi.png"); }.photo-mina { background-image:url("assets/writers/mina.png"); }.photo-ren { background-image:url("assets/writers/ren.png"); }.photo-kai { background-image:url("assets/writers/kai.png"); }
@media (max-width:760px) { body.home .priority-section { padding:30px 0 34px; } body.home .money-compass { padding:26px 0 28px; } }

/* Article reading mode: quieter color, stronger type hierarchy, and a human editor first. */
.article { max-width:820px; margin:42px auto 64px; padding:clamp(24px,5vw,62px); border:1px solid #e0ebe7; border-radius:8px; background:#fff; box-shadow:0 8px 28px rgba(24,51,74,.05); }
.article h1 { margin:10px 0 15px; color:#18334a; font-family:"Hiragino Sans",Meiryo,sans-serif; font-size:clamp(30px,4vw,44px); font-weight:900; line-height:1.35; }
.article h2 { margin:42px 0 14px; padding-top:6px; color:#18334a!important; font-size:clamp(21px,2.6vw,27px); line-height:1.45; }
.article h3 { margin:28px 0 10px; color:#24475d; font-size:19px; line-height:1.5; }
.article > .writer-tone-natsumi > p,.article > .writer-tone-yuki > p,.article > .writer-tone-mina > p,.article > .writer-tone-akari > p,.article > .writer-tone-ren > p,.article > .writer-tone-sora > p,.article > .writer-tone-kai > p,.article > .writer-tone-tokumi > p,.article > .writer-tone-shiki > p,.article > .writer-tone-miruna > p,.article > .writer-tone-seiri > p,.article p { color:#30485a; font-size:17px; line-height:2; }
.article li { color:#30485a; font-size:16px; line-height:1.85; }
.article .article-writer-intro { margin:0 0 28px; padding:0 0 22px; border-bottom:1px solid #dce8e4; }
.article .article-writer { margin:0; padding:14px 0; border:0; border-radius:0; background:transparent; }
.article .article-writer .writer-photo { flex:0 0 64px; width:64px; height:64px; border:2px solid #fff; box-shadow:0 0 0 1px #cfe3dc; }
.article .article-writer strong { color:#18334a; font-size:17px; }.article .article-writer small { margin-top:2px; color:#587181; font-size:12px; }.article .article-writer-link { color:#316a82; text-decoration:underline; text-underline-offset:3px; }
.article-date-row { display:flex; flex-wrap:wrap; gap:8px; margin:2px 0 12px; }.article-date-row span { padding:3px 8px; border:1px solid #d7e7e2; border-radius:4px; color:#55717e; background:#f8fbfa; font-size:12px; font-weight:800; }
.article-writer-intro > p { margin:0; color:#3c5966; font-size:15px!important; line-height:1.75!important; }.article-writer-intro > p strong { color:#18334a; }.article-writer-intro .writer-opening-note { display:grid; grid-template-columns:max-content 1fr; gap:10px; align-items:start; padding:12px 14px; border-left:4px solid var(--writer-accent,#8eaa60); background:var(--writer-soft,#f3fbf5); }.article-writer-intro .writer-opening-note strong { font-size:12px; white-space:nowrap; }.article-writer-intro .writer-opening-note span { min-width:0; }
.article .writer-byline { display:none; }
.article .article-utility { margin:0 0 22px; }.article .article-utility span,.article .article-utility a { border-color:#cddfdb; background:#f7fbf9; color:#3f6270; }.article .article-utility a { background:#fff; color:#316a82; }
.article .article-quick-answer { margin:0 0 22px; padding:16px 18px; border:1px solid #b9ded0; border-left:5px solid var(--writer-accent,#4c927d); border-radius:8px; background:var(--writer-soft,#f1faf5); }
.article .article-quick-answer strong { display:block; margin:0 0 5px; color:#18334a; font-size:14px; font-weight:900; }
.article .article-quick-answer p { margin:0; color:#294b58; font-size:16px; font-weight:700; line-height:1.75; }
.article .fact-box { margin:0 0 26px; border-color:#b9ded0; background:#f1faf5; }.article .campaign-state { margin:0 0 16px; }.article .campaign-tool { border-color:#c9dfd7; background:#fbfefc; }.article .campaign-tool th { color:#254f52; background:#eaf7f0; }.article .campaign-tool td { color:#30485a; }.article .action-checklist li { border-color:#d7e5e0; background:#fff; }
.post-card { position:relative; min-height:214px; padding:0; border-top:0; }.post-card-link { display:flex; box-sizing:border-box; min-height:inherit; padding:17px 0 0; border-top:3px solid var(--lime); flex-direction:column; color:inherit; text-decoration:none; -webkit-tap-highlight-color:rgba(49,106,130,.14); }.post-card:nth-child(2) .post-card-link { border-color:var(--coral); }.post-card:nth-child(3) .post-card-link { border-color:var(--sky); }.post-card-link:hover h3 { color:#2d7465; }.post-card-link:focus-visible { border-radius:6px; outline:3px solid #67a994; outline-offset:5px; }.post-card-link:active { opacity:.78; }.post-card-writer { display:flex; align-items:center; gap:8px; margin-top:auto; padding:12px 0 13px; border-top:1px solid #e0ece8; }.post-card-writer .writer-photo { flex:0 0 32px; width:32px; height:32px; }.post-card-writer b { display:block; color:#31505f; font-size:12px; line-height:1.25; }.post-card-writer small { display:block; margin-top:1px; color:#718792; font-size:10px; font-weight:800; line-height:1.35; }.post-rank { position:absolute; top:15px; right:0; display:grid; width:28px; height:28px; place-items:center; border-radius:50%; background:#18334a; color:#fff; font-size:13px; font-weight:900; }.post-rank + .category { padding-right:34px; }
.post-card-dates { display:flex; flex-wrap:wrap; gap:5px; margin:2px 0 9px; }.post-card-dates time { display:inline-flex; align-items:center; min-height:22px; padding:2px 7px; border:1px solid #d8e7e1; border-radius:4px; background:#f7fbf9; color:#526d77; font-size:10px; font-weight:900; line-height:1; }.post-card-dates .post-card-updated { border-color:#f0d7bd; background:#fff8ed; color:#9a5d27; }.mark-expired { background:#f0eeee; color:#6b6262; }
body.home .post-card { padding:0; }
body.home .post-card-link { padding:14px 0; }
.home-hero { order:1; }
body.home .quick-nav { order:2; }
body.home .return-hub { order:3; }
body.home .latest-section { order:4; }
body.home .priority-section { order:5; }
body.home .economy-section { order:6; }
body.home .money-compass { order:7; }
body.home .popular-section { order:8; }
body.home .writer-ranking-section { order:9; }
body.home .writers-section { order:10; }
body.home .office-section { order:11; }
body.home .section-dark { order:12; }
.writer-ranking-section { border-top:1px solid #dbece5; background:#f7fbfa; }.writer-ranking-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }.writer-ranking-card { display:grid; grid-template-columns:auto 50px 1fr; gap:10px; align-items:center; min-height:98px; padding:12px; border:1px solid #d8e8e2; border-radius:8px; background:#fff; }.writer-ranking-card:hover { border-color:#87b7a3; background:#fbfefc; }.writer-ranking-card .writer-photo { width:50px; height:50px; }.writer-ranking-number { display:grid; width:21px; height:21px; place-items:center; border-radius:50%; background:#e8f5ff; color:#315c72; font-size:11px; font-weight:900; }.writer-ranking-card strong,.writer-ranking-card small,.writer-ranking-card em { display:block; }.writer-ranking-card strong { color:#18334a; font-size:14px; }.writer-ranking-card small { color:#607b88; font-size:10px; font-weight:800; line-height:1.35; }.writer-ranking-card em { margin-top:3px; color:#597b65; font-size:10px; font-style:normal; font-weight:900; }
@media (max-width:760px) { .article { margin:22px 14px 42px; padding:24px 20px; }.article h1 { font-size:29px; line-height:1.42; }.article p { font-size:16px; line-height:1.9; }.article li { font-size:15px; }.article .article-writer .writer-photo { flex-basis:56px; width:56px; height:56px; }.article .article-writer-link { display:none; }.article-date-row { gap:6px; }.post-card { min-height:0; }.writer-ranking-grid { grid-template-columns:1fr 1fr; }.writer-ranking-card { grid-template-columns:auto 44px 1fr; min-height:88px; padding:10px; }.writer-ranking-card .writer-photo { width:44px; height:44px; } }
@media (max-width:760px) { .section-heading { align-items:flex-start; flex-direction:column; gap:8px; }.section-heading .team-note { width:100%; max-width:none; }.latest-section .section-heading { margin-bottom:16px; } }

/* Article tables need to work as decision tools, not as a dense spreadsheet. */
.article table { width:100%; margin:20px 0 28px; border:1px solid #d7e5e0; border-collapse:separate; border-spacing:0; border-radius:8px; background:#fff; overflow:hidden; font-size:15px; }
.article table th,.article table td { padding:14px 15px; border-right:1px solid #e2ece8; border-bottom:1px solid #dce8e4; color:#30485a; text-align:left; vertical-align:top; line-height:1.65; }
.article table th { color:#24475d; background:#f1f8f5; font-size:13px; font-weight:900; }
.article table th:last-child,.article table td:last-child { border-right:0; }
.article table tr:last-child th,.article table tr:last-child td { border-bottom:0; }
.article .campaign-tool table { margin:0; border:0; border-radius:0; }
.article .campaign-tool table th,.article .campaign-tool table td { padding:12px; }
.article table.mobile-card-table { table-layout:fixed; }
.article .campaign-tool table.mobile-card-table th { width:auto; }
.article table.mobile-card-table.table-columns-2 tr > :first-child { width:30%; }
.article table.mobile-card-table.table-columns-2 tr > :last-child { width:70%; }
.article table.mobile-card-table.table-columns-4 tr > :first-child { width:22%; }
.article table.mobile-card-table.table-columns-4 tr > :not(:first-child) { width:26%; }
.article table.mobile-card-table th,.article table.mobile-card-table td { overflow-wrap:anywhere; }
.article .economy-decision-table { border:2px solid #7cbda7; box-shadow:0 5px 0 rgba(70,137,116,.09); }
.article .economy-decision-table th { background:#dff3e8; color:#244e4b; }
.article .economy-decision-table td:nth-child(2) { min-width:100px; color:#286f64; font-size:17px; font-weight:900; }
.article .economy-result-table { border-color:#b9d5e2; }
.article .economy-result-table th { background:#eaf5fb; color:#305d76; }
.article .economy-result-table td:nth-child(1) { min-width:84px; color:#18334a; font-weight:900; }
.article .economy-result-table td:nth-child(3) { min-width:110px; color:#b44c39; font-weight:900; }
.article .affiliate-disclosure { margin:0 0 18px; padding:9px 12px; border:1px solid #d8e5e0; border-radius:6px; background:#f7faf9; color:#5b7079; font-size:12px; font-weight:800; line-height:1.65; }
@media (max-width:760px) {
  .article .table-scroll,.article .table-scroll.mobile-table-ready { overflow:visible; }
  .article table:not(.mobile-card-table):not(.mobile-key-value-table) { table-layout:fixed; font-size:13px; }
  .article table:not(.mobile-card-table):not(.mobile-key-value-table) th,.article table:not(.mobile-card-table):not(.mobile-key-value-table) td { min-width:0; padding:9px; overflow-wrap:anywhere; }
  .article table.mobile-key-value-table { display:block; border:0; border-radius:0; overflow:visible; background:transparent; font-size:14px; }
  .article table.mobile-key-value-table tbody { display:grid; gap:10px; }
  .article table.mobile-key-value-table tr { display:grid; grid-template-columns:minmax(94px,35%) minmax(0,1fr); overflow:hidden; border:1px solid #d7e5e0; border-radius:8px; background:#fff; }
  .article table.mobile-key-value-table tr > th,.article table.mobile-key-value-table tr > td { display:block; width:auto; min-width:0; padding:11px 12px; border:0; background:#fff; overflow-wrap:anywhere; }
  .article table.mobile-key-value-table tr > th { border-right:1px solid #e2ece8; background:#f1f8f5; color:#315c61; font-size:12px; font-weight:900; }
  .article .campaign-tool table.mobile-key-value-table { display:block; }
  .article table.mobile-card-table { display:block; border:0; border-radius:0; overflow:visible; background:transparent; font-size:14px; }
  .article table.mobile-card-table thead,.article table.mobile-card-table .mobile-table-header { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
  .article table.mobile-card-table tbody { display:grid; gap:12px; }
  .article table.mobile-card-table tr { display:block; overflow:hidden; border:1px solid #d7e5e0; border-radius:8px; background:#fff; }
  .article table.mobile-card-table tr > th,.article table.mobile-card-table tr > td { display:grid; grid-template-columns:minmax(88px,35%) minmax(0,1fr); gap:12px; min-width:0; padding:11px 12px; border:0; border-bottom:1px solid #e2ece8; background:#fff; color:#30485a; font-size:14px; font-weight:700; overflow-wrap:anywhere; }
  .article table.mobile-card-table.table-columns-2 tr > :first-child,.article table.mobile-card-table.table-columns-2 tr > :last-child,.article table.mobile-card-table.table-columns-4 tr > :first-child,.article table.mobile-card-table.table-columns-4 tr > :not(:first-child) { width:auto; }
  .article table.mobile-card-table tr > :last-child { border-bottom:0; }
  .article table.mobile-card-table tr > [data-label]::before { content:attr(data-label); color:#315c61; font-size:12px; font-weight:900; line-height:1.55; }
  .article table.mobile-card-table.economy-decision-table,.article table.mobile-card-table.economy-result-table { border:0; box-shadow:none; }
  .article table.mobile-card-table.economy-decision-table tr,.article table.mobile-card-table.economy-result-table tr { border-color:#a9d3c4; }
  .article .campaign-tool table.mobile-card-table { display:block; }
  .article .campaign-tool table.mobile-card-table tr > th,.article .campaign-tool table.mobile-card-table tr > td { min-width:0; padding:10px 11px; }
  .article h1 { font-size:26px; line-height:1.4; letter-spacing:0; }
}

/* Keep home article cards readable on narrow screens. Two-column cards made
   titles and date badges overflow the viewport. */
@media (max-width:760px) {
  body.home .latest-section .cards,
  body.home .popular-section .cards,
  body.home #s-rating .cards { grid-template-columns:1fr; }
  body.home .cards .post-card-link > .post-card-dates {
    flex:0 1 100%; width:100%; min-width:0; margin-left:0;
  }
}

/* Returning readers get a compact, useful reason to come back near the top. */
.return-hub { border-bottom:1px solid #dbece5; background:#fff; }
.today-pulse { display:flex; min-height:58px; align-items:center; gap:14px; padding:9px 0; }
.today-pulse > div { display:flex; align-items:baseline; gap:10px; margin-right:auto; }
.today-pulse-label { color:#e77560; font-size:10px; font-weight:900; }
.today-pulse strong { font-size:15px; }
.today-pulse small { color:#607b88; font-size:11px; font-weight:800; }
.today-pulse a { padding:5px 8px; color:#316a82; font-size:12px; font-weight:900; }
.return-digest { display:grid; grid-template-columns:1fr 1fr .78fr; gap:12px; padding:0 0 20px; }
.return-digest-card { min-height:138px; padding:15px; border:1px solid #d8e7e1; border-radius:8px; background:#fffdf7; }
.return-digest-card h2 { margin:3px 0 10px; font-size:18px; line-height:1.3; }
.return-digest-kicker { color:#e77560; font-size:10px; font-weight:900; letter-spacing:0; }
.return-digest-card ul { display:grid; gap:8px; margin:0; padding:0; list-style:none; }
.return-digest-card li { display:grid; gap:2px; min-width:0; }
.return-digest-card li a { display:-webkit-box; overflow:hidden; color:#18334a; font-size:13px; font-weight:900; line-height:1.45; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.return-digest-card li small { color:#607b88; font-size:10px; font-weight:900; }
.return-watch-links { display:flex; flex-wrap:wrap; gap:7px; }
.return-watch-links a { padding:6px 10px; border:1px solid #cddfd8; border-radius:999px; background:#fff; color:#315c72; font-size:12px; font-weight:900; }
.return-reading { padding:22px 0 28px; border-top:1px solid #e0ece8; }
.return-reading[hidden],.return-reading-list[hidden] { display:none; }
.return-reading-head { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:14px; }
.return-reading h2 { margin:2px 0 0; font-size:23px; line-height:1.2; }
.return-reading-tabs { display:flex; gap:4px; padding:3px; border:1px solid #d8e7e1; border-radius:7px; background:#f4f8f6; }
.return-reading-tabs button { min-height:32px; padding:4px 12px; border:0; border-radius:5px; background:transparent; color:#607b88; font:inherit; font-size:12px; font-weight:900; cursor:pointer; }
.return-reading-tabs button[aria-selected="true"] { background:#fff; color:#285e52; box-shadow:0 1px 4px rgba(24,51,74,.12); }
.return-reading-list { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.return-reading-item { display:grid; min-height:78px; grid-template-columns:72px minmax(0,1fr); gap:11px; align-items:center; padding:9px; border:1px solid #d8e7e1; border-radius:8px; background:#fffdf7; }
.return-reading-item:not(.has-image) { grid-template-columns:1fr; }
.return-reading-item:hover { border-color:#87b7a3; }
.return-reading-item img { width:72px; height:56px; border-radius:5px; object-fit:cover; }
.return-reading-item small,.return-reading-item strong { display:block; }
.return-reading-item small { margin-bottom:2px; color:#e77560; font-size:10px; font-weight:900; }
.return-reading-item strong { display:-webkit-box; overflow:hidden; font-size:13px; line-height:1.45; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.return-reading-all { display:block; width:max-content; margin:13px 0 0 auto; color:#316a82; font-size:12px; font-weight:900; }
.return-reading-all[hidden] { display:none; }
.watchlist-toggle { display:inline-flex; align-items:center; gap:7px; }
.watchlist-toggle > [aria-hidden="true"] { font-size:17px; line-height:1; }
@media (max-width:760px) {
  .today-pulse { min-height:54px; gap:6px; }
  .today-pulse > div { align-items:flex-start; flex-direction:column; gap:0; }
  .today-pulse-label,.today-pulse small { display:none; }
  .today-pulse a { flex:0 0 auto; padding:5px; font-size:11px; }
  .return-digest { grid-template-columns:1fr; gap:9px; padding-bottom:16px; }
  .return-digest-card { min-height:0; padding:13px; }
  .return-digest-card h2 { font-size:17px; }
  .return-digest-card li:nth-child(n+3) { display:none; }
  .return-reading { padding:18px 0 22px; }
  .return-reading-head { align-items:flex-start; flex-direction:column; gap:10px; }
  .return-reading h2 { font-size:21px; }
  .return-reading-tabs { width:100%; }
  .return-reading-tabs button { flex:1; }
  .return-reading-list { grid-template-columns:1fr; }
  .return-reading-item { min-height:74px; }
  .return-reading-item:nth-child(n+3) { display:none; }
  .perfecty-push-dialog-box { display:grid; width:calc(100% - 28px); max-width:390px; grid-template-columns:48px minmax(0,1fr); gap:10px; padding:12px; flex-wrap:nowrap; text-align:left; }
  .perfecty-push-dialog-box .perfecty-push-dialog-icon { width:48px; height:48px; object-fit:contain; }
  .perfecty-push-dialog-form { min-width:0; }
  .perfecty-push-dialog-container .perfecty-push-dialog-form .perfecty-push-dialog-title { margin:0 0 8px; font-size:13px; font-weight:800; line-height:1.5; }
  .perfecty-push-dialog-buttons { display:flex; justify-content:flex-end; gap:6px; }
  .perfecty-push-dialog-container .perfecty-push-dialog-form button { min-height:36px; margin:0; padding:8px 10px; font-size:12px; }
}

/* The compass is a real chooser: one clear destination, not four stacked messages. */
.compass-control button { display:grid; align-content:center; justify-items:start; gap:2px; min-height:62px; padding:10px 13px; text-align:left; }.compass-control button b { font-size:14px; }.compass-control button span { color:#63808d; font-size:10px; font-weight:800; }.compass-control button[aria-selected="true"] span { color:#d9f65c; }.compass-control button:focus-visible { outline:3px solid #8abfd1; outline-offset:2px; }.compass-result[hidden] { display:none; }.compass-result { grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:14px; padding:18px; }.compass-result > div b { display:block; color:#18334a; font-size:16px; }.compass-result > div p { margin:3px 0 0; color:#587181; font-size:13px; font-weight:700; line-height:1.65; }.compass-step { display:grid; width:54px; height:54px; place-items:center; border-radius:50%; background:#dff7eb; color:#315c61; font-size:10px; font-weight:900; text-align:center; line-height:1.2; }.compass-result a { justify-self:end; white-space:nowrap; }
@media (max-width:760px) { .compass-control button { min-height:68px; padding:9px; }.compass-control button b { font-size:13px; }.compass-result { grid-template-columns:50px minmax(0,1fr); gap:11px; padding:15px; }.compass-step { width:48px; height:48px; }.compass-result > div b { font-size:15px; }.compass-result a { grid-column:2; justify-self:start; } }

.article .article-inline-visual { margin:28px 0 34px; overflow:hidden; border:1px solid var(--writer-accent,var(--line)); border-radius:8px; background:var(--writer-soft,#f3fbf5); }.article .article-inline-visual img { display:block; width:100%; aspect-ratio:16 / 9; object-fit:cover; }.article .article-inline-visual figcaption { padding:11px 14px; color:var(--writer-accent,#587181); font-size:13px; font-weight:800; line-height:1.7; }

.photo-iluma { background:#dff7eb url("assets/iluma-profile.jpg") center/cover no-repeat; }
.article .iluma-editor-profile { border-color:#9ed7c9; background:#f5fcf9; }
.iluma-editor-profile-grid { display:grid; grid-template-columns:160px minmax(0,1fr); gap:22px; align-items:center; }
.iluma-editor-profile-grid figure { margin:0; }
.iluma-editor-profile-grid img { display:block; width:160px; height:160px; border-radius:50%; object-fit:cover; box-shadow:0 0 0 3px #fff,0 0 0 4px #b9ded0; }
.article .iluma-editor-profile-grid p { margin:0 0 8px; font-size:16px; line-height:1.85; }
.article .iluma-editor-profile-grid p:last-child { margin-bottom:0; }
.writer-card.social-member { border-color:#72c7b4; background:#f5fcf9; }
.team-profile-section { background:#fffdf7; }
.team-profile-layout { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(280px,.8fr); gap:48px; align-items:start; }
.team-profile-layout h2 { margin:7px 0 12px; color:#24475d; font-size:32px; }
.team-profile-layout p { max-width:760px; margin:0; color:#4c6572; font-size:17px; line-height:1.95; }
.team-social-links { display:grid; gap:10px; }
.team-social-links a { display:flex; align-items:center; justify-content:space-between; gap:18px; min-height:58px; padding:12px 16px; border:1px solid #cde7da; border-radius:8px; background:#fff; color:#24475d; text-decoration:none; }
.team-social-links a:hover { border-color:#58a995; background:#f0faf6; }
@media (max-width:760px) { .iluma-editor-profile-grid { grid-template-columns:1fr; justify-items:start; }.iluma-editor-profile-grid img { width:112px; height:112px; } }
.team-social-links span { color:#587181; font-size:12px; font-weight:900; }
.team-social-links strong { font-size:14px; }
@media (max-width:760px) { .team-profile-layout { grid-template-columns:1fr; gap:28px; }.team-profile-layout h2 { font-size:25px; }.team-profile-layout p { font-size:16px; }.team-social-links a { min-height:54px; } }
.writer-background-section { background:#fffdf7; }
.writer-background-grid { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(260px,.7fr); gap:38px; align-items:start; }
.writer-background-grid h2 { margin:7px 0 12px; color:#24475d; font-size:30px; }
.writer-background-grid p { margin:0; color:#4c6572; font-size:16px; line-height:1.9; }
.writer-profile-points { display:grid; gap:12px; margin:0; }
.writer-profile-points div { padding:14px 16px; border:1px solid #d8e8e2; border-radius:8px; background:#f7fbfa; }
.writer-profile-points dt { margin:0 0 5px; color:#587181; font-size:12px; font-weight:900; }
.writer-profile-points dd { margin:0; color:#24475d; font-size:14px; font-weight:800; line-height:1.7; }
@media (max-width:760px) { .writer-background-grid { grid-template-columns:1fr; gap:22px; }.writer-background-grid h2 { font-size:24px; }.writer-background-grid p { font-size:15px; } }

/* GA4 shows mobile visitors need a shorter path from the brand to fresh articles. */
body.home .latest-section { order:3; }
body.home .return-hub { order:4; }
body.home .flow-gateway { order:5; }
body.home .priority-section { order:6; }
body.home .economy-section { order:7; }
body.home .money-compass { order:8; }
body.home .popular-section { order:9; }
body.home .writer-ranking-section { order:10; }
body.home .writers-section { order:11; }
body.home .office-section { order:12; }
body.home .section-dark { order:13; }

.flow-gateway { padding:22px 0; border-top:1px solid #d8e0de; border-bottom:1px solid #d8e0de; background:#eef3f1; }
.flow-gateway-inner { display:grid; grid-template-columns:minmax(0,1fr) auto auto; gap:28px; align-items:center; }
.flow-gateway-copy h2 { margin:3px 0 4px; color:#173d43; font-size:clamp(22px,2.4vw,31px); line-height:1.3; }
.flow-gateway-copy p { margin:0; color:#526b70; font-size:13px; font-weight:700; }
.flow-gateway-status { display:flex; flex-wrap:wrap; gap:6px; justify-content:flex-end; }
.flow-gateway-status span { padding:4px 9px; border:1px solid #b9ccca; border-radius:4px; background:#fffdf7; color:#365c61; font-size:11px; font-weight:900; }
.flow-gateway-link { display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:46px; padding:10px 16px; border-radius:6px; background:#173d43; color:#fff; font-size:13px; font-weight:900; white-space:nowrap; }
.flow-gateway-link:hover { background:#285b5f; }

@media (max-width:760px) {
  body.home .home-hero { padding-top:170px; }
  body.home .home-hero::before { height:170px; }
  body.home .home-hero-inner { padding:15px 14px 18px; }
  body.home .home-hero h1 { margin:5px 0 7px; font-size:29px; }
  body.home .home-hero-role { font-size:12px; line-height:1.55; }
  body.home .home-hero-link { margin-top:11px; padding:8px 11px; }
  body.home .quick-nav-inner { display:flex; width:100%; padding:10px 14px; overflow-x:auto; gap:7px; scroll-snap-type:x proximity; scrollbar-width:none; }
  body.home .quick-nav-inner::-webkit-scrollbar { display:none; }
  body.home .quick-nav a { flex:0 0 108px; min-height:50px; padding:8px 10px; scroll-snap-align:start; font-size:13px; }
  body.home .latest-section { padding:27px 0 30px; }
  body.home .latest-section .team-note { display:none; }
  body.home .latest-section .cards { gap:0; }
  body.home .latest-section .post-card-link { padding:12px 0; }
  .flow-gateway { padding:20px 0; }
  .flow-gateway-inner { grid-template-columns:1fr; gap:13px; }
  .flow-gateway-copy h2 { font-size:23px; }
  .flow-gateway-copy p { font-size:12px; line-height:1.7; }
  .flow-gateway-status { justify-content:flex-start; }
  .flow-gateway-link { width:100%; }
}


/* Fix: mobile hamburger reveals all primary nav links (was hiding 4 of 6 with no menu). */
.nav-toggle { display:none; }
@media (max-width:900px) {
  .nav-toggle { display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; margin-left:auto; padding:0; border:1px solid #d8ebe4; border-radius:8px; background:#fffdf7; cursor:pointer; }
  .nav-toggle-box { position:relative; width:18px; height:12px; }
  .nav-toggle-bar,.nav-toggle-box::before,.nav-toggle-box::after { content:""; position:absolute; left:0; width:18px; height:2px; border-radius:2px; background:#18334a; transition:transform .2s ease,opacity .2s ease; }
  .nav-toggle-bar { top:5px; }
  .nav-toggle-box::before { top:0; }
  .nav-toggle-box::after { top:10px; }
  .site-header.nav-open .nav-toggle-box::before { transform:translateY(5px) rotate(45deg); }
  .site-header.nav-open .nav-toggle-bar { opacity:0; }
  .site-header.nav-open .nav-toggle-box::after { transform:translateY(-5px) rotate(-45deg); }
  .site-header .nav-links { position:absolute; top:calc(100% + 1px); left:0; right:0; z-index:20; display:none; flex-direction:column; gap:0; padding:6px; background:#fffdf7; border:1px solid var(--line); border-radius:0 0 12px 12px; box-shadow:0 14px 26px rgba(24,51,74,.13); }
  .site-header.nav-open .nav-links { display:flex; }
  .nav-links a { display:block; padding:13px 12px; border-radius:8px; font-size:16px; }
  .nav-links a:not(:last-child) { display:block; }
  .nav-links a:hover,.nav-links a:active { background:var(--mint); }
}

/* Home order: latest first, then category nav, rating, and context sections. */
body.home .latest-section { order:2; }
body.home .quick-nav { order:3; }
body.home .rating-finder { order:4; }
body.home .deep-dive-section { order:5; }
body.home .priority-section { order:6; }
body.home .return-hub { order:7; }
body.home .flow-gateway { order:8; }


/* Tablet tier (761-900px): give multi-column sections a clean 2-3 col layout (fixes writer-grid overflow). */
@media (min-width:761px) and (max-width:900px) {
  .writer-grid,.team-grid,.cards,.trust-grid,.writer-ranking-grid,.advanced-guide-grid,.related-grid { grid-template-columns:repeat(2,1fr); }
  .quick-nav-inner,.economy-grid,.office-flow { grid-template-columns:repeat(3,1fr); }
}


/* --- Site search + archive/search listings --- */
.site-search { background:#fffdf7; border-bottom:1px solid var(--line); }
.site-search .container { padding:12px 0; }
.search-form { display:flex; gap:8px; width:min(560px,100%); margin:0 auto; }
.search-form .search-field { flex:1; min-width:0; height:44px; padding:0 14px; border:1px solid #cddfd8; border-radius:8px; background:#fff; font:inherit; font-size:15px; color:var(--ink); }
.search-form .search-field:focus { outline:2px solid #a9d8c8; outline-offset:0; border-color:#a9d8c8; }
.search-form .search-submit { flex:0 0 auto; height:44px; padding:0 18px; border:0; border-radius:8px; background:var(--ink); color:#fffdf7; font-weight:900; font-size:14px; cursor:pointer; }
.search-form .search-submit:hover { background:#24506e; }
.screen-reader-text { position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.archive-section { background:#f5fbf8; }
.archive-heading h1 { margin:4px 0 0; font-size:30px; line-height:1.2; }
.archive-desc { margin-top:8px; color:#587181; font-size:14px; }
.archive-sort { display:inline-flex; gap:4px; margin:0 0 20px; padding:4px; border:1px solid var(--line); border-radius:999px; background:#fffdf7; }
.archive-sort-tab { padding:7px 16px; border-radius:999px; font-size:13px; font-weight:900; color:#57717d; }
.archive-sort-tab.is-active { background:var(--ink); color:#fffdf7; }
.search-again { margin:0 0 20px; }
.empty-note { margin:18px 0; padding:22px; border:1px dashed #cddfd8; border-radius:10px; background:#fffdf7; color:#587181; font-weight:700; }
.search-suggest { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-top:14px; font-size:14px; color:#587181; }
.search-suggest a { padding:7px 13px; border:1px solid #cddfd8; border-radius:999px; font-weight:900; color:var(--ink); background:#fffdf7; }
.search-suggest a:hover { background:var(--mint); }
.pagination { margin-top:26px; }
.pagination .nav-links { display:flex; flex-wrap:wrap; justify-content:center; gap:6px; }
.pagination .page-numbers { display:inline-flex; min-width:40px; height:40px; align-items:center; justify-content:center; padding:0 12px; border:1px solid #cddfd8; border-radius:8px; background:#fffdf7; color:var(--ink); font-weight:900; font-size:14px; }
.pagination .page-numbers.current { background:var(--ink); color:#fffdf7; border-color:var(--ink); }
.pagination a.page-numbers:hover { background:var(--mint); }
.mark-expired { background:#ececec; color:#7a7a7a; }


/* Okaneta rating finder: glossy rank filters with mobile-first tap targets. */
.rating-finder { padding:30px 0 36px; border-bottom:1px solid var(--line); background:#f7fbf9; }
.rating-finder-heading { align-items:end; }
.rating-tabs { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:9px; margin-top:18px; }
.rating-tab { --rank-a:#477d68; --rank-b:#1d493d; --rank-ink:#fffdf7; position:relative; display:grid; grid-template-columns:auto minmax(0,1fr); gap:9px; align-items:center; min-height:72px; padding:11px 12px; border:0; border-radius:8px; overflow:hidden; background:linear-gradient(180deg,rgba(255,255,255,.72),rgba(255,255,255,.08) 43%,rgba(0,0,0,.08) 100%),linear-gradient(135deg,var(--rank-a),var(--rank-b)); color:var(--rank-ink); box-shadow:inset 0 1px 0 rgba(255,255,255,.72),0 10px 22px rgba(24,51,74,.13); font:inherit; text-align:left; cursor:pointer; }
.rating-tab::after { content:""; position:absolute; inset:0 0 auto; height:45%; background:linear-gradient(180deg,rgba(255,255,255,.32),rgba(255,255,255,0)); pointer-events:none; }
.rating-tab[aria-selected="true"] { transform:translateY(-2px); box-shadow:inset 0 1px 0 rgba(255,255,255,.82),0 14px 28px rgba(24,51,74,.18); outline:2px solid rgba(24,51,74,.18); outline-offset:2px; }
.rating-tab:focus-visible { outline:3px solid #18334a; outline-offset:3px; }
.rating-tab .rating-letter { position:relative; z-index:1; display:grid; width:36px; height:36px; place-items:center; border-radius:8px; background:rgba(255,255,255,.24); box-shadow:inset 0 1px 0 rgba(255,255,255,.58); font-size:22px; font-weight:900; line-height:1; }
.rating-tab b,.rating-tab small { position:relative; z-index:1; display:block; letter-spacing:0; }
.rating-tab b { font-size:14px; line-height:1.25; }
.rating-tab small { margin-top:3px; opacity:.88; font-size:11px; font-weight:900; line-height:1.3; }
.rating-s { --rank-a:#244a37; --rank-b:#c49a35; }
.rating-a { --rank-a:#49b982; --rank-b:#216f57; }
.rating-b { --rank-a:#45a9d8; --rank-b:#266c9b; }
.rating-c { --rank-a:#eba33b; --rank-b:#aa6420; }
.rating-d { --rank-a:#c87a86; --rank-b:#6f6872; }
.rating-panel { margin-top:16px; }
.rating-panel[hidden] { display:none; }
.rating-panel-copy { display:flex; flex-wrap:wrap; gap:8px 12px; align-items:baseline; margin:0 0 12px; color:#587181; font-size:13px; font-weight:800; }
.rating-panel-copy strong { color:#18334a; font-size:17px; }
.rating-cards { padding:2px 0 0; }
.rating-empty { margin:0; padding:18px; border:1px dashed #c9ddd5; border-radius:8px; background:#fffdf7; color:#587181; font-size:13px; font-weight:800; line-height:1.7; }
.okaneta-rating-badge { display:inline-flex; width:max-content; margin:7px 6px 0 0; padding:3px 8px; border-radius:999px; color:#fffdf7; font-size:10px; font-weight:900; line-height:1.2; box-shadow:inset 0 1px 0 rgba(255,255,255,.45); }
.okaneta-rating-badge.rating-s { background:linear-gradient(135deg,#244a37,#c49a35); }
.okaneta-rating-badge.rating-a { background:linear-gradient(135deg,#49b982,#216f57); }
.okaneta-rating-badge.rating-b { background:linear-gradient(135deg,#45a9d8,#266c9b); }
.okaneta-rating-badge.rating-c { background:linear-gradient(135deg,#eba33b,#aa6420); }
.okaneta-rating-badge.rating-d { background:linear-gradient(135deg,#c87a86,#6f6872); }

@media (max-width:760px) {
  .rating-finder { padding:25px 0 28px; }
  .rating-finder-heading { align-items:start; }
  .rating-finder .team-note { max-width:320px; font-size:12px; line-height:1.6; }
  .rating-tabs { display:flex; width:calc(100% + 28px); margin:14px -14px 0; padding:0 14px 5px; gap:8px; overflow-x:auto; scroll-snap-type:x proximity; scrollbar-width:none; }
  .rating-tabs::-webkit-scrollbar { display:none; }
  .rating-tab { flex:0 0 142px; min-height:64px; padding:9px 10px; scroll-snap-align:start; }
  .rating-tab[aria-selected="true"] { flex-basis:176px; }
  .rating-tab .rating-letter { width:34px; height:34px; font-size:21px; }
  .rating-tab b { font-size:13px; }
  .rating-tab small { font-size:10px; }
  .rating-panel { margin-top:10px; }
  .rating-panel-copy { margin-bottom:8px; }
  .rating-cards { gap:0; }
  .rating-cards .post-card-link { padding:12px 0; }
}

/* Deep-dive home hub separates durable analysis from fast news. */
.deep-dive-section { padding:38px 0 42px; border-bottom:1px solid var(--line); background:#fffdf7; }
.deep-dive-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.deep-dive-card { display:flex; min-height:176px; flex-direction:column; gap:8px; padding:17px; border:1px solid #d8e8e2; border-top:4px solid #7fb4c6; border-radius:8px; background:#fff; color:#18334a; }
.deep-dive-card:hover { transform:translateY(-2px); border-color:#8abf9b; box-shadow:0 8px 18px rgba(38,72,81,.08); }
.deep-dive-card span { color:#607b88; font-size:11px; font-weight:900; }
.deep-dive-card strong { font-size:16px; line-height:1.45; }
.deep-dive-card small { margin-top:auto; color:#526d77; font-size:12px; font-weight:800; line-height:1.6; }
.dive-card-credit { border-top-color:#6fb7d6; }
.dive-card-economy { border-top-color:#ff9b83; }
.dive-card-flow { border-top-color:#a98fe0; }
.dive-card-fixed { border-top-color:#8fc65a; }
.economy-guide-strip { display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.economy-guide-strip a,.economy-guide-link { display:inline-flex; align-items:center; justify-content:center; min-height:36px; padding:8px 12px; border:1px solid #cddfd8; border-radius:8px; background:#fff; color:#285a4d; font-size:12px; font-weight:900; }
.economy-guide-strip a:hover,.economy-guide-link:hover { border-color:#87b7a3; background:#f0faf6; }
.economy-guide-link { margin-top:16px; }

@media (max-width:760px) {
  .deep-dive-section { padding:30px 0 34px; }
  .deep-dive-grid { grid-template-columns:1fr; gap:9px; }
  .deep-dive-card { min-height:0; padding:14px; }
  .deep-dive-card strong { font-size:15px; }
  .economy-guide-strip { flex-wrap:nowrap; width:calc(100% + 28px); margin:12px -14px 0; padding:0 14px 3px; overflow-x:auto; scrollbar-width:none; }
  .economy-guide-strip::-webkit-scrollbar { display:none; }
  .economy-guide-strip a { flex:0 0 auto; }
}


/* Priority cards: category color accent + deadline urgency badge (home "今日、先にやること"). */
.priority-card { border-left-width:4px; border-left-color:#d7c39a; }
body.home .priority-card.pcat-credit-card { border-left-color:#6fb7d6; }
body.home .priority-card.pcat-bank { border-left-color:#5fbf95; }
body.home .priority-card.pcat-securities { border-left-color:#a98fe0; }
body.home .priority-card.pcat-point { border-left-color:#ff9b83; }
body.home .priority-card.pcat-breaking { border-left-color:#ff7a52; }
body.home .priority-card.pcat-tax { border-left-color:#e6b73c; }
body.home .priority-card.pcat-saving { border-left-color:#8fc65a; }
body.home .priority-card.pcat-rakuten { border-left-color:#d1666e; }
body.home .priority-card.pcat-paypay { border-left-color:#ef7f66; }
body.home .priority-card.pcat-subscription,body.home .priority-card.pcat-fixed-cost,body.home .priority-card.pcat-water-server { border-left-color:#7fb4c6; }
.priority-card-top { justify-content:flex-start; }
.priority-time { margin-left:auto; }
.priority-deadline { display:inline-flex; align-items:center; gap:5px; min-height:22px; padding:2px 9px; border-radius:999px; font-size:11px; font-weight:900; line-height:1; }
.priority-deadline time { font-style:normal; }
.priority-deadline.is-urgent { background:#fdecea; color:#c0392b; box-shadow:inset 0 0 0 1px #f2b6ad; }
.priority-deadline.is-urgent::before { content:""; width:6px; height:6px; border-radius:50%; background:#e0402c; }
.priority-deadline.is-soon { background:#fff3e0; color:#b26a00; box-shadow:inset 0 0 0 1px #f0d29a; }
.priority-deadline.is-later { background:#eef6ff; color:#316a82; box-shadow:inset 0 0 0 1px #c2dde8; }


/* Priority cards: self-hosted official service logo (favicon). */
.priority-logo { flex:0 0 auto; width:28px; height:28px; border-radius:6px; object-fit:contain; background:#fff; box-shadow:inset 0 0 0 1px rgba(24,51,74,.10); }
.priority-card-main .priority-logo { width:34px; height:34px; border-radius:7px; }


/* ---- breadcrumb ---- */
.breadcrumb {
  margin: 0 0 12px;
  font-size: 12px;
  line-height: 1.6;
}
.breadcrumb ol {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.breadcrumb li {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  color: var(--muted, #6b7280);
}
.breadcrumb li + li::before {
  content: "\203A";
  color: var(--muted, #9ca3af);
}
.breadcrumb a {
  color: var(--muted, #6b7280);
  text-decoration: none;
}
.breadcrumb a:hover {
  text-decoration: underline;
}
.breadcrumb [aria-current="page"] {
  color: var(--ink, #111827);
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}


/* ---- archive lead ---- */
.archive-desc {
  max-width: 62ch;
  margin: 8px 0 0;
  color: var(--muted, #4b5563);
  font-size: 14px;
  line-height: 1.85;
}
.archive-desc p {
  margin: 0;
}
.archive-list-heading {
  margin: 24px 0 12px;
  font-size: 15px;
  font-weight: 700;
  color: var(--muted, #6b7280);
  letter-spacing: 0.02em;
}

/* Footer taxonomy links: every article was more than one hop from the
   homepage, so 43 of 98 posts went uncrawled. This puts each archive on
   every page. */
.footer-categories { width:100%; }
.footer-categories-title { display:block; margin-bottom:10px; color:#fffdf7; font-size:12px; font-weight:900; letter-spacing:.06em; }

/* --- Mobile home (<=760px) --------------------------------------------------
   The article feed sat second at 1,937px tall, which pushed "今日、先にやること"
   down to 4,512px — over five screens of scrolling before the daily action
   block and the genre menu. Reorder for mobile only; the desktop order above is
   deliberate and stays as it is.
   Card children were each their own flex row, so a 44px badge cost a full line.
   Let the label row share one line and keep the rest full width. */
@media (max-width:760px) {
  body.home .quick-nav { order:1; }
  body.home .home-hero { order:2; }
  body.home .rating-finder { order:3; }
  body.home .economy-section { order:4; }
  body.home .priority-section { order:5; }
  body.home .return-hub { order:6; }
  body.home .latest-section { order:7; }
  body.home .money-compass { order:8; }
  body.home .flow-gateway { order:9; }
  body.home .popular-section { order:10; }
  body.home .deep-dive-section { order:11; }
  body.home .writer-ranking-section { order:12; }
  body.home .writers-section { order:13; }
  body.home .office-section { order:14; }
  body.home .section-dark { order:15; }

  /* As the first thing on the page this is the chooser, so show all six at
     once: the horizontal strip only fit three on a 390px screen. */
  body.home .quick-nav-inner { display:grid; overflow-x:visible;
    grid-template-columns:repeat(auto-fit,minmax(100px,1fr)); }
  body.home .quick-nav-inner > a { width:auto; }


  /* Consistent vertical rhythm. Section padding ranged from 20px to 48px with
     no system; the hero is excluded because its padding-top reserves space for
     the ::before artwork. */
  body.home main > section:not(.home-hero):not(.return-hub) { padding-top:24px; padding-bottom:24px; }

  /* .economy-grid and .writer-ranking-grid were already two columns on mobile.
     The article and writer lists were the odd ones out at one column, which is
     what made the page run long. Match them. */
  body.home .cards,
  body.home .deep-dive-grid,
  body.home .writer-grid { grid-template-columns:repeat(2,1fr); }
  /* Grid gaps were 8px, 10px and 12px depending on the section. One value. */
  body.home .cards,
  body.home .deep-dive-grid,
  body.home .writer-grid,
  body.home .economy-grid,
  body.home .writer-ranking-grid,
  body.home .priority-grid,
  body.home .quick-nav-inner,
  body.home .latest-section .cards { gap:10px; }
  body.home .cards .post-card-link > h3 { font-size:14px; line-height:1.45;
    display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
  body.home .cards .post-card-link > .post-card-dates { margin-left:0; }
  /* .writer-card pins its portrait column at 88px, which left only 43px for the
     text once the grid went to two columns and made the cards taller than they
     were at one. Shrink the portrait to match the narrower cell. */
  body.home .writer-grid .writer-card { grid-template-columns:44px 1fr; gap:10px; padding:12px; }
  body.home .writer-grid .writer-card img,
  body.home .writer-grid .writer-card .writer-photo { width:44px; height:44px; }

  .cards .post-card-link { flex-flow:row wrap; align-items:center; column-gap:6px; }
  .cards .post-card-link > h3,
  .cards .post-card-link > .article-marks,
  .cards .post-card-link > .post-card-writer { flex:0 0 100%; }
  .cards .post-card-link > .article-decision { flex:1 1 auto; }
  .cards .post-card-link > .post-card-dates { flex:0 0 auto; margin-left:auto; }
  .cards .post-card-link > .okaneta-rating-badge,
  .cards .post-card-link > .economy-badge { margin-top:0; }
  .cards .post-card-writer { gap:8px; }
  .cards .post-card-writer .writer-photo { width:24px; height:24px; }
  .cards .post-card-writer small { display:none; }
}

/* 記事内目次（2026-08-18 追加）。既存の世代ルールには触れず、末尾で定義して上書きする。 */
.article .article-toc { margin:0 0 30px; padding:0; border:1px solid #b9ded0; border-radius:8px; background:var(--writer-soft,#f1faf5); }
.article .article-toc > summary { display:flex; align-items:baseline; gap:10px; padding:14px 18px; list-style:none; cursor:pointer; }
.article .article-toc > summary::-webkit-details-marker { display:none; }
.article .article-toc > summary::after { content:"閉じる"; margin-left:auto; color:var(--writer-accent,#4c927d); font-size:12px; font-weight:900; }
.article .article-toc:not([open]) > summary::after { content:"開く"; }
.article .article-toc > summary strong { color:#18334a; font-size:15px; font-weight:900; }
.article .article-toc > summary .eyebrow { color:var(--writer-accent,#e77560); }
.article .article-toc nav { padding:0 18px 16px; }
.article .toc-list { margin:0; padding:0 0 0 1.4em; list-style:decimal; }
.article .toc-list > .toc-item { margin:0 0 9px; color:#30485a; font-size:15px; font-weight:800; line-height:1.6; }
.article .toc-list > .toc-item:last-child { margin-bottom:0; }
.article .toc-list a { text-decoration:underline; text-underline-offset:3px; text-decoration-color:#b9ded0; }
.article .toc-list a:hover { color:var(--writer-accent,#40748a); text-decoration-color:currentColor; }
.article .toc-sub { margin:8px 0 0; padding:0 0 0 1.1em; list-style:disc; }
.article .toc-sub li { margin:0 0 7px; color:#4a6572; font-size:14px; font-weight:700; line-height:1.6; }
.article .toc-sub li:last-child { margin-bottom:0; }
.article h2[id],.article h3[id] { scroll-margin-top:14px; }
@media (prefers-reduced-motion:no-preference) { html { scroll-behavior:smooth; } }
@media (max-width:760px) {
  .article .article-toc { margin:0 0 24px; }
  .article .article-toc > summary { padding:12px 14px; }
  .article .article-toc nav { padding:0 14px 14px; }
  .article .toc-list > .toc-item { font-size:14px; }
  .article .toc-sub li { font-size:13px; }
}
@media (max-width:760px) {
  /* 見出しが極端に多い記事でも、目次が1画面を占有しないようにする（通常の記事では発火しない）。 */
  .article .article-toc[open] nav { max-height:52vh; overflow-y:auto; overscroll-behavior:contain; }
}

/* ============================================================
   PC構成の刷新（2026-08-19）
   トップの並びをモバイル（586-600行）と同じ順序に揃えたうえで、
   広い画面とマウス操作に向いた導線を足す。
   既存の order 世代（21 / 90-99 / 140-150 / 301-311 / 365-371行）は
   どれが生きているか読み解くコストが高いので触らず、ここで
   全15セクションを明示して上書きする。旧構成にあった
   order:7（return-hub と economy-section）と order:8
   （money-compass と flow-gateway）の衝突もこれで解消する。
   ============================================================ */
@media (min-width:761px) {
  /* quick-nav はPCでは下で畳むが、再表示したときに順序が崩れないよう
     order は15セクション分そのまま明示しておく。 */
  body.home .quick-nav { order:1; }
  body.home .home-hero { order:2; }
  body.home .rating-finder { order:3; }
  body.home .economy-section { order:4; }
  body.home .priority-section { order:5; }
  body.home .return-hub { order:6; }
  body.home .latest-section { order:7; }
  body.home .money-compass { order:8; }
  body.home .flow-gateway { order:9; }
  body.home .popular-section { order:10; }
  body.home .deep-dive-section { order:11; }
  body.home .writer-ranking-section { order:12; }
  body.home .writers-section { order:13; }
  body.home .office-section { order:14; }
  body.home .section-dark { order:15; }

  /* ナビをヘッダー側に一本化する。
     ヘッダーのリンク（経済圏/クレカ/銀行/証券・NISA/ポイント/締切/FLOW）は
     quick-nav の行き先を完全に含んでおり、PCでは両方が同時に見えて
     ほぼ同じリンクが2段重なっていた。ヘッダーは全ページにあるので
     そちらを残し、トップ限定の quick-nav をPCでは畳む。
     モバイルはヘッダーがハンバーガーに畳まれて quick-nav が本体なので、
     この指定は 761px 以上にしか効かせない。 */
  body.home .quick-nav { display:none; }

  /* 一本化した以上、そのヘッダーは常に出ていないと意味がない。
     トップは7000px超、記事も長いので全ページで固定する。
     ヘッダー内のモバイル用ドロップダウン（z-index:20）は子要素なので
     このスタッキングコンテキストの内側に収まる。 */
  .site-header { position:sticky; top:0; z-index:20;
    box-shadow:0 6px 16px rgba(24,51,74,.07); }
  /* 固定ヘッダー（約85px）の下に見出しが潜らないようにする。
     トップの #today / #latest / #popular と、記事内目次の飛び先の両方。 */
  body.home main [id] { scroll-margin-top:96px; }
  .article h2[id],.article h3[id] { scroll-margin-top:96px; }

  /* セクションの上下余白が 30/36/38/40/56/68px とばらついていた。
     モバイル（612行）と同じ考え方で一つの値に揃える。
     home-hero は ::before の背景画像と連動、return-hub は内側で余白を
     持つ、flow-gateway は意図的に薄いCTA帯なので、この3つは除外。 */
  body.home main > section:not(.home-hero):not(.return-hub):not(.flow-gateway) {
    padding-top:48px; padding-bottom:48px; }

  /* マウス前提のホバー。economy-card と deep-dive-card には既にあるので、
     取り残されていた priority-card と compass のボタンを合わせる。 */
  body.home .priority-card { transition:border-color .16s ease, box-shadow .16s ease; }
  body.home .priority-card:hover { border-color:#c2a86f; box-shadow:0 8px 18px rgba(38,72,81,.08); }
  body.home .priority-card-main:hover { border-color:#9dcb63; }
  body.home .compass-control button[aria-selected="false"]:hover { border-color:#b3a2d4; background:#f7f4ff; }
}


/* 2026-08-22: upcoming campaigns (_tokuhaya_starts_at) — announced but not open yet. */
.priority-deadline.is-upcoming { background:#f3f1fb; color:#5b4b9a; box-shadow:inset 0 0 0 1px #d4cdeb; }
.campaign-state.campaign-state-upcoming { border-color:#d4cdeb; background:#f7f5fd; color:#5f5680; }
.campaign-state.campaign-state-upcoming strong { color:#5b4b9a; }

.priority-upcoming { display:flex; flex-wrap:wrap; gap:8px 14px; align-items:baseline; margin:14px 0 0; padding:12px 14px; border:1px dashed #d4cdeb; border-radius:8px; background:#faf9fe; }
.priority-upcoming-label { color:#5b4b9a; font-size:11px; font-weight:900; letter-spacing:.04em; }
.priority-upcoming ul { display:flex; flex-wrap:wrap; gap:6px 18px; margin:0; padding:0; list-style:none; }
.priority-upcoming li { display:flex; gap:8px; align-items:center; }

/* 2026-08-30: TOP service picker — choose a network, bank, or card first. */
.service-picker-section { background:#f8fbf9; }
.service-picker-jumps { display:flex; gap:8px; margin:0 0 28px; }
.service-picker-jumps a { min-width:112px; padding:9px 14px; border:1px solid #b9d9ce; border-radius:999px; background:#fff; color:#285a4d; text-align:center; font-size:13px; font-weight:900; }
.service-picker-jumps a:hover { border-color:#5f9b87; background:#edf8f3; }
.service-picker-group + .service-picker-group { margin-top:38px; padding-top:34px; border-top:1px solid #dbe9e4; }
.service-picker-heading { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:14px; }
.service-picker-heading span { color:#50766a; font-size:10px; font-weight:900; letter-spacing:.12em; }
.service-picker-heading h3 { margin:3px 0 0; color:#18334a; font-size:22px; line-height:1.3; }
.service-picker-heading p { max-width:520px; margin:0; color:#526d77; font-size:13px; font-weight:700; }
.service-picker-heading > a { color:#2d6b61; font-size:13px; font-weight:900; text-decoration:underline; text-underline-offset:3px; }
.service-picker-section .economy-grid { grid-template-columns:repeat(3,1fr); }
.service-picker-section .economy-card { min-height:156px; }
.service-choice-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
.service-choice-card { display:flex; min-height:142px; flex-direction:column; gap:6px; padding:15px; border:1px solid #d8e8e2; border-top:4px solid #75a995; border-radius:8px; background:#fff; color:#18334a; transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease; }
.service-choice-card:hover { transform:translateY(-2px); border-color:#75a995; box-shadow:0 8px 18px rgba(38,72,81,.08); }
.service-choice-card > span { color:#607b88; font-size:10px; font-weight:900; letter-spacing:.08em; }
.service-choice-card strong { font-size:16px; line-height:1.35; }
.service-choice-card small { color:#526d77; font-size:12px; font-weight:700; line-height:1.5; }
.service-choice-card em { margin-top:auto; color:#2d6b61; font-size:12px; font-style:normal; font-weight:900; }
.service-choice-card-brand { border-top-color:#d88778; }
.service-choice-card-brand:hover { border-color:#d88778; }
body.home #choose-economy,body.home #choose-bank,body.home #choose-card { scroll-margin-top:96px; }
@media (max-width:760px) {
  .service-picker-section .section-heading h2 { font-size:24px; }
  .service-picker-jumps { position:sticky; top:0; z-index:5; margin:0 -14px 22px; padding:8px 14px; overflow-x:auto; background:rgba(248,251,249,.96); }
  .service-picker-jumps a { flex:1 0 92px; min-width:92px; padding:8px 10px; }
  .service-picker-heading { align-items:start; flex-direction:column; gap:6px; }
  .service-picker-heading h3 { font-size:19px; }
  .service-picker-heading p { font-size:12px; }
  .service-picker-section .economy-grid,.service-choice-grid { grid-template-columns:repeat(2,1fr); }
  .service-picker-section .economy-card,.service-choice-card { min-height:136px; padding:12px; }
  .service-picker-section .economy-card strong,.service-choice-card strong { font-size:14px; }
  .service-picker-section .economy-card small,.service-choice-card small { font-size:11px; }
  body.home #choose-economy,body.home #choose-bank,body.home #choose-card { scroll-margin-top:12px; }
}
.priority-upcoming a { color:var(--ink); font-size:13px; font-weight:800; line-height:1.5; }
@media (max-width:760px) { .priority-upcoming { flex-direction:column; gap:8px; padding:12px; } .priority-upcoming ul { flex-direction:column; gap:8px; } .priority-upcoming li { align-items:flex-start; } }

/* ===== 「今日、先にやること」を締切14日以内に絞った分の調整 (2026-08-23) =====
   index.php が候補数に応じて .priority-grid-1 / -2 / -3 を出すようになった。
   元の 1.2fr/.8fr 2列 + .priority-card-main{grid-row:span 2} は
   「3枚ある」前提のレイアウトなので、1枚だと右列がまるごと空いて間延びする。
   §4 の方針どおりレガシーの連鎖には触らず末尾で上書きする。 */
.priority-grid-1, .priority-grid-2 { grid-template-rows:auto; }
.priority-grid-1 { grid-template-columns:minmax(0,640px); }
.priority-grid-2 { grid-template-columns:1fr 1fr; }
.priority-grid-1 .priority-card-main,
.priority-grid-2 .priority-card-main { grid-row:auto; }
/* 54行目のモバイル定義(.priority-grid{grid-template-columns:1fr})より
   ソース順で後ろに来てしまうため、760px以下を明示的に戻す。 */
@media (max-width:760px) {
  .priority-grid-1, .priority-grid-2 { grid-template-columns:1fr; }
}

/* --- 2026-08-26 フッター上段の潰れを修正 ---
   .footer-row は flex 1行だが .footer-categories に width:100% があるため、
   本来326pxの編集長カード(.footer-editor)が153pxまで押し潰され、
   X のリンクが3行に折り返していた。行を折り返してカテゴリ一覧を2段目に落とす。
   モバイル(760px以下)の縦積みは 49行目の @media で定義済みだが、
   ここでの再指定が同詳細度・後方ソースで勝ってしまうため下で再宣言する。 */
.footer-row { flex-wrap:wrap; align-items:flex-end; row-gap:30px; }
.footer-editor { flex:0 0 auto; }
.footer-links { flex:1 1 240px; }
.footer-categories { flex:1 0 100%; }
@media (max-width:760px) {
  /* 760px以下は .footer-row が flex-direction:column なので、上の flex-basis は
     幅ではなく「高さ」として効いてしまう（footer-links が240px高になる）。
     縦積みでは basis を auto に戻す。 */
  .footer-row { flex-direction:column; align-items:flex-start; row-gap:20px; }
  .footer-editor, .footer-links, .footer-categories { flex:0 0 auto; width:100%; }
  .footer-editor { max-width:100%; }
}

/* --- 2026-08-26 記事内の追記ブロック ---
   似た記事を量産せず、既存記事に追記していく運用のためのマーカー。
   本文に <p class="article-addendum"><strong>8月26日 追記</strong> 本文…</p> と書く。
   日付バッジ＋左ボーダーで、どこが新しく足された情報か読者に分かるようにする。 */
.article-addendum { margin:22px 0; padding:14px 16px; border-left:4px solid var(--lime); border-radius:0 6px 6px 0; background:#f6fbef; font-size:16px; line-height:1.85; }
.article-addendum strong { display:inline-block; margin-right:8px; padding:2px 9px; border-radius:99px; background:#31505f; color:#fffdf7; font-size:12px; font-weight:900; letter-spacing:.03em; vertical-align:2px; }
.article-addendum + .article-addendum { margin-top:12px; }
@media (max-width:760px) {
  .article-addendum { margin:18px 0; padding:12px 13px; font-size:15px; }
}


/* ===== 2026-09-03 ダークモード（Obsidian）=====
   AI Studio のモックの配色を移植。既存の明色ルールには一切触れていないので、
   ライトモードの見た目は移行前と完全に同一。ここは全部その上書き。
   トークン: base #020617 / surface #0f172a / raised #111c30
             text #e2e8f0 / muted #94a3b8 / line rgba(148,163,184,.18)
             accent #34d399 (emerald-400)
   ※ このブロックは /opt/tokuhaya-editorial/tools/gen_dark.py が style.css から機械生成している。
      色を足したら再生成すること。手で1行だけ直すと次の再生成で消える。 */
html[data-theme="dark"] { color-scheme:dark; }
html[data-theme="dark"] body { background:#020617; color:#e2e8f0; }
html[data-theme="dark"] .site-header { background:#0f172a; }
html[data-theme="dark"] .nav-links { color:#94a3b8; }
html[data-theme="dark"] .nav-links a:hover { color:#34d399; }
html[data-theme="dark"] .nav-flow-link { color:#34d399; }
html[data-theme="dark"] .home-intro { background:#0f172a; }
html[data-theme="dark"] .home-intro p { color:#94a3b8; }
html[data-theme="dark"] .hero { background-color:#0f172a; }
html[data-theme="dark"] .eyebrow, html[data-theme="dark"] .category { color:#34d399; }
html[data-theme="dark"] .hero p { color:#94a3b8; }
html[data-theme="dark"] .button-primary { box-shadow:0 4px 0 #34d399; }
html[data-theme="dark"] .button-secondary { border-color:rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .agent-strip { background:#0f172a; }
html[data-theme="dark"] .agent-dot:after { background:#020617; }
html[data-theme="dark"] .agent-grid p { color:#94a3b8; }
html[data-theme="dark"] .ticker-label { color:#34d399; }
html[data-theme="dark"] .quick-nav { background:#0f172a; }
html[data-theme="dark"] .quick-nav a { border:1px solid rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .quick-nav a:hover { border-color:rgba(148,163,184,.18); }
html[data-theme="dark"] .quick-nav span { color:#34d399; }
html[data-theme="dark"] .quick-nav .quick-nav-flow { border-color:#34d399; background:#0f172a; }
html[data-theme="dark"] .quick-nav .quick-nav-flow span { color:#34d399; }
html[data-theme="dark"] .section-link { color:#94a3b8; }
html[data-theme="dark"] .office-section { background:#0f172a; }
html[data-theme="dark"] .office-stage { border:1px solid rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .office-caption span { background:#0f172a; color:#34d399; }
html[data-theme="dark"] .team-note { color:#94a3b8; }
html[data-theme="dark"] .team-card { border:1px solid rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .team-card small { color:#94a3b8; }
html[data-theme="dark"] .team-card p { color:#94a3b8; }
html[data-theme="dark"] .role-orb { color:#e2e8f0; }
html[data-theme="dark"] .orb-gold { background:#34d399; }
html[data-theme="dark"] .orb-cyan { background:#64748b; }
html[data-theme="dark"] .office-flow { background:#0f172a; border:1px solid rgba(148,163,184,.18); }
html[data-theme="dark"] .office-flow b { color:#34d399; }
html[data-theme="dark"] .office-flow span { color:#94a3b8; }
html[data-theme="dark"] .popular-section { background:#0f172a; }
html[data-theme="dark"] .writers-section { background:#0f172a; }
html[data-theme="dark"] .writer-card { border:1px solid rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .writer-card.office-member { border-color:rgba(148,163,184,.18); }
html[data-theme="dark"] .writer-card small { color:#94a3b8; }
html[data-theme="dark"] .writer-card p { color:#94a3b8; }
html[data-theme="dark"] .writer-profile-hero { background:#0f172a; }
html[data-theme="dark"] .writer-profile-hero p { color:#94a3b8; }
html[data-theme="dark"] .article-writer { border:1px solid rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .article-writer small { color:#94a3b8; }
html[data-theme="dark"] .article-writer-link { color:#94a3b8; }
html[data-theme="dark"] .pickup-section { background:#0f172a; }
html[data-theme="dark"] .latest-section { background:#0f172a; }
html[data-theme="dark"] .feature-main, html[data-theme="dark"] .story-card { background:#0f172a; }
html[data-theme="dark"] .feature-main { background:#111c30; }
html[data-theme="dark"] .feature-main p, html[data-theme="dark"] .story-card p { color:#94a3b8; }
html[data-theme="dark"] .post-card p { color:#94a3b8; }
html[data-theme="dark"] .meta { color:#64748b; }
html[data-theme="dark"] .section-dark { background:#111c30; }
html[data-theme="dark"] .trust { background:#0f172a; border:1px solid rgba(148,163,184,.18); }
html[data-theme="dark"] .trust b { color:#34d399; }
html[data-theme="dark"] .trust p { color:#94a3b8; }
html[data-theme="dark"] .site-footer { background:#020617; color:#e2e8f0; }
html[data-theme="dark"] .article { background:#0f172a; }
html[data-theme="dark"] .article a { color:#94a3b8; }
html[data-theme="dark"] .footer-editor strong { color:#e2e8f0; }
html[data-theme="dark"] .footer-editor p { color:#64748b; }
html[data-theme="dark"] .footer-editor a { color:#34d399; }
html[data-theme="dark"] .tokuhaya-contact-form label { color:#e2e8f0; }
html[data-theme="dark"] .tokuhaya-contact-form input, html[data-theme="dark"] .tokuhaya-contact-form textarea { border:1px solid rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .tokuhaya-contact-form button { background:#0f172a; color:#e2e8f0; }
html[data-theme="dark"] .tokuhaya-contact-notice { background:#111c30; color:#e2e8f0; }
html[data-theme="dark"] .tokuhaya-contact-notice.is-error { background:#0f172a; color:#34d399; }
html[data-theme="dark"] .article .article-visual figcaption { color:#94a3b8; }
html[data-theme="dark"] .article .writer-byline { color:#94a3b8; }
html[data-theme="dark"] .article .campaign-tool { border:1px solid rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .article .campaign-tool th, html[data-theme="dark"] .article .campaign-tool td { border-bottom:1px solid rgba(148,163,184,.18); }
html[data-theme="dark"] .article .campaign-tool th { color:#94a3b8; background:#111c30; }
html[data-theme="dark"] .article .action-checklist li { border:1px solid rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .writer-profile-link { color:#94a3b8; }
html[data-theme="dark"] .writer-article-visual { border:1px solid rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .writer-article-visual p { color:#94a3b8; }
html[data-theme="dark"] .writer-article-visual.visual-yuki { background:#0f172a; }
html[data-theme="dark"] .writer-article-visual.visual-natsumi { background:#111c30; }
html[data-theme="dark"] .writer-article-visual.visual-shiki { background:#0f172a; }
html[data-theme="dark"] .office-reference { border:1px solid rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .mark-time { background:#111c30; color:#94a3b8; }
html[data-theme="dark"] .mark-value { background:#111c30; color:#34d399; }
html[data-theme="dark"] .mark-effort { background:#111c30; color:#34d399; }
html[data-theme="dark"] .article-reward { color:#34d399; }
html[data-theme="dark"] .article-entry { color:#94a3b8; }
html[data-theme="dark"] .mark-kind { background:#020617; color:#e2e8f0; }
html[data-theme="dark"] .priority-section { background:#0f172a; }
html[data-theme="dark"] .priority-card { border:1px solid #34d399; background:#0f172a; }
html[data-theme="dark"] .priority-card-main { border-color:#34d399; background:#111c30; }
html[data-theme="dark"] .priority-kicker { background:#020617; color:#e2e8f0; }
html[data-theme="dark"] .priority-time { background:#0f172a; color:#94a3b8; border:1px solid rgba(148,163,184,.18); }
html[data-theme="dark"] .priority-signals strong { color:#34d399; }
html[data-theme="dark"] .priority-signals span { color:#34d399; }
html[data-theme="dark"] .priority-card p { color:#94a3b8; }
html[data-theme="dark"] .priority-link { color:#94a3b8; }
html[data-theme="dark"] .priority-card-main .priority-link { color:#e2e8f0; }
html[data-theme="dark"] .time-nav { background:#0f172a; }
html[data-theme="dark"] .time-nav a { background:#0f172a; }
html[data-theme="dark"] .time-label { background:#020617; color:#e2e8f0; }
html[data-theme="dark"] .time-nav-copy { color:#94a3b8; }
html[data-theme="dark"] body.home .home-hero { color:#e2e8f0; }
html[data-theme="dark"] body.home .home-hero p { color:#94a3b8; }
html[data-theme="dark"] body.home .home-hero-link { border:1px solid rgba(148,163,184,.18); background:#34d399; color:#e2e8f0; }
html[data-theme="dark"] body.home .home-hero-role { color:#e2e8f0; }
html[data-theme="dark"] body.home .home-hero-subcopy { color:#94a3b8; }
html[data-theme="dark"] .policy-brief p { color:#94a3b8; }
html[data-theme="dark"] .photo-ren { background:#111c30; }
html[data-theme="dark"] .photo-sora { background:#111c30; }
html[data-theme="dark"] .photo-ren::before, html[data-theme="dark"] .photo-sora::before { background:#34d399; }
html[data-theme="dark"] .photo-ren::after, html[data-theme="dark"] .photo-sora::after { background:#0f172a; box-shadow:17px 35px 0 -13px #0f172a, 36px 35px 0 -13px #0f172a; }
html[data-theme="dark"] .photo-sora::after { background:#0f172a; box-shadow:17px 35px 0 -13px #0f172a, 36px 35px 0 -13px #0f172a; }
html[data-theme="dark"] .photo-tokumi { background:#111c30; }
html[data-theme="dark"] .photo-shiki { background:#0f172a; }
html[data-theme="dark"] .photo-miruna { background:#111c30; }
html[data-theme="dark"] .photo-seiri { background:#111c30; }
html[data-theme="dark"] .photo-tokumi::before, html[data-theme="dark"] .photo-shiki::before, html[data-theme="dark"] .photo-miruna::before, html[data-theme="dark"] .photo-seiri::before { border:5px solid rgba(148,163,184,.18); background:rgba(148,163,184,.18); box-shadow:inset 0 0 0 3px #64748b; }
html[data-theme="dark"] .photo-shiki::before { background:#111c30; box-shadow:inset 0 0 0 3px #34d399; }
html[data-theme="dark"] .photo-miruna::before { background:#111c30; box-shadow:inset 0 0 0 3px #64748b; }
html[data-theme="dark"] .photo-seiri::before { background:rgba(148,163,184,.18); box-shadow:inset 0 0 0 3px #34d399; }
html[data-theme="dark"] .photo-tokumi::after, html[data-theme="dark"] .photo-shiki::after, html[data-theme="dark"] .photo-miruna::after, html[data-theme="dark"] .photo-seiri::after { background:#0f172a; color:#94a3b8; }
html[data-theme="dark"] .photo-shiki::after { color:#34d399; }
html[data-theme="dark"] .photo-miruna::after { color:#94a3b8; }
html[data-theme="dark"] .photo-seiri::after { color:#34d399; }
html[data-theme="dark"] .photo-tokumi::before, html[data-theme="dark"] .photo-shiki::before, html[data-theme="dark"] .photo-miruna::before, html[data-theme="dark"] .photo-seiri::before { border:6px solid rgba(148,163,184,.18); background:#0f172a; box-shadow:inset 0 0 0 3px #64748b; }
html[data-theme="dark"] .photo-shiki::before { box-shadow:inset 0 0 0 3px #34d399; }
html[data-theme="dark"] .photo-miruna::before { box-shadow:inset 0 0 0 3px #64748b; }
html[data-theme="dark"] .photo-seiri::before { box-shadow:inset 0 0 0 3px #34d399; }
html[data-theme="dark"] .photo-tokumi::after, html[data-theme="dark"] .photo-shiki::after, html[data-theme="dark"] .photo-miruna::after, html[data-theme="dark"] .photo-seiri::after { background:#0f172a; color:#64748b; }
html[data-theme="dark"] .photo-shiki::after { color:#34d399; }
html[data-theme="dark"] .photo-miruna::after { color:#64748b; }
html[data-theme="dark"] .photo-seiri::after { color:#34d399; }
html[data-theme="dark"] .article .article-visual { background:var(--writer-soft,#0f172a); }
html[data-theme="dark"] .article .article-visual figcaption { color:var(--writer-accent,#94a3b8); }
html[data-theme="dark"] .article-utility span, html[data-theme="dark"] .article-utility a { border:1px solid rgba(148,163,184,.18); background:#0f172a; color:#94a3b8; }
html[data-theme="dark"] .article-utility a { border-color:var(--writer-accent,rgba(148,163,184,.18)); color:var(--writer-accent,#94a3b8); background:#0f172a; }
html[data-theme="dark"] .related-grid a { border:1px solid rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .related-grid a:hover { border-color:var(--writer-accent,rgba(148,163,184,.18)); background:var(--writer-soft,#0f172a); }
html[data-theme="dark"] .related-grid span { color:var(--writer-accent,#94a3b8); }
html[data-theme="dark"] .economy-section { border-top:1px solid rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .economy-card { border:1px solid rgba(148,163,184,.18); background:#0f172a; color:#e2e8f0; }
html[data-theme="dark"] .economy-card:hover { border-color:rgba(148,163,184,.18); }
html[data-theme="dark"] .economy-card-kicker { color:#94a3b8; }
html[data-theme="dark"] .economy-card small { color:#94a3b8; }
html[data-theme="dark"] .economy-card em { color:#94a3b8; }
html[data-theme="dark"] .economy-coral { border-top:4px solid #34d399; }
html[data-theme="dark"] .economy-blue { border-top:4px solid rgba(148,163,184,.18); }
html[data-theme="dark"] .economy-yellow { border-top:4px solid #34d399; }
html[data-theme="dark"] .economy-orange { border-top:4px solid #34d399; }
html[data-theme="dark"] .economy-green { border-top:4px solid rgba(148,163,184,.18); }
html[data-theme="dark"] .economy-badge { border:1px solid rgba(148,163,184,.18); background:#0f172a; color:#94a3b8; }
html[data-theme="dark"] .economy-hub-hero { border-bottom:1px solid rgba(148,163,184,.18); background:#111c30; }
html[data-theme="dark"] .economy-hub-hero h1 { color:#e2e8f0; }
html[data-theme="dark"] .economy-hub-hero p { color:#94a3b8; }
html[data-theme="dark"] .economy-hub-actions a { border:1px solid rgba(148,163,184,.18); background:#0f172a; color:#e2e8f0; }
html[data-theme="dark"] .economy-guide { background:#0f172a; }
html[data-theme="dark"] .economy-guide h2 { color:#e2e8f0; }
html[data-theme="dark"] .economy-guide p { color:#94a3b8; }
html[data-theme="dark"] .economy-guide li { border-bottom:1px solid rgba(148,163,184,.18); color:#94a3b8; }
html[data-theme="dark"] .economy-guide li::before { background:#111c30; color:#e2e8f0; }
html[data-theme="dark"] .economy-hub .post-card { background:#0f172a; }
html[data-theme="dark"] .compare-hero { background:#111c30; }
html[data-theme="dark"] .compare-hero p { color:#94a3b8; }
html[data-theme="dark"] .compare-table-head { background:#111c30; color:#94a3b8; }
html[data-theme="dark"] .compare-row { background:#0f172a; }
html[data-theme="dark"] .compare-row:hover { background:#0f172a; }
html[data-theme="dark"] .compare-row span { color:#94a3b8; }
html[data-theme="dark"] .deadline-item { border:1px solid rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .deadline-item > strong { color:#34d399; }
html[data-theme="dark"] .campaign-state { border:1px solid rgba(148,163,184,.18); background:#111c30; color:#94a3b8; }
html[data-theme="dark"] .campaign-state strong { color:#94a3b8; }
html[data-theme="dark"] .campaign-state-expired { border-color:#34d399; background:#0f172a; }
html[data-theme="dark"] .campaign-state-expired strong { color:#34d399; }
html[data-theme="dark"] .campaign-state a { color:#94a3b8; }
html[data-theme="dark"] .watchlist-toggle { border:1px solid rgba(148,163,184,.18); background:#111c30; color:#94a3b8; }
html[data-theme="dark"] .watchlist-toggle[aria-pressed="true"] { border-color:rgba(148,163,184,.18); background:#111c30; color:#94a3b8; }
html[data-theme="dark"] .watchlist-item { border:1px solid rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .watchlist-empty { border:1px dashed rgba(148,163,184,.18); color:#94a3b8; }
html[data-theme="dark"] .money-compass { background:#0f172a; }
html[data-theme="dark"] .compass-control button { border:1px solid rgba(148,163,184,.18); background:#0f172a; color:#94a3b8; }
html[data-theme="dark"] .compass-control button[aria-selected="true"] { border-color:rgba(148,163,184,.18); background:#64748b; color:#e2e8f0; }
html[data-theme="dark"] .compass-result { border:1px solid rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .compass-result b { color:#94a3b8; }
html[data-theme="dark"] .compass-result p { color:#94a3b8; }
html[data-theme="dark"] .compass-result a { color:#94a3b8; }
html[data-theme="dark"] .fact-box { border:1px solid rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .fact-box strong { color:#e2e8f0; }
html[data-theme="dark"] .fact-box dt { color:#94a3b8; }
html[data-theme="dark"] .fact-box dd { color:#94a3b8; }
html[data-theme="dark"] .fact-box > a { color:#94a3b8; }
html[data-theme="dark"] body.home .priority-section { background:#0f172a; }
html[data-theme="dark"] body.home .money-compass { background:#111c30; }
html[data-theme="dark"] body.home .priority-card { border-color:rgba(148,163,184,.18); }
html[data-theme="dark"] body.home .priority-card-main { border-color:rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] body.home .priority-time { border-color:rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] body.home .compass-control button { border-color:rgba(148,163,184,.18); color:#94a3b8; }
html[data-theme="dark"] body.home .compass-control button[aria-selected="true"] { color:#e2e8f0; }
html[data-theme="dark"] body.home .compass-result { border-color:rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] body.home .quick-nav { background:#0f172a; }
html[data-theme="dark"] body.home .quick-nav a { border-color:rgba(148,163,184,.18); }
html[data-theme="dark"] body.home .quick-nav span { color:#94a3b8; }
html[data-theme="dark"] body.home .writers-section { background:#0f172a; }
html[data-theme="dark"] .economy-violet { border-top:4px solid rgba(148,163,184,.18); }
html[data-theme="dark"] .article { border:1px solid rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .article h1 { color:#e2e8f0; }
html[data-theme="dark"] .article h2 { color:#e2e8f0!important; }
html[data-theme="dark"] .article h3 { color:#e2e8f0; }
html[data-theme="dark"] .article > .writer-tone-natsumi > p, html[data-theme="dark"] .article > .writer-tone-yuki > p, html[data-theme="dark"] .article > .writer-tone-mina > p, html[data-theme="dark"] .article > .writer-tone-akari > p, html[data-theme="dark"] .article > .writer-tone-ren > p, html[data-theme="dark"] .article > .writer-tone-sora > p, html[data-theme="dark"] .article > .writer-tone-kai > p, html[data-theme="dark"] .article > .writer-tone-tokumi > p, html[data-theme="dark"] .article > .writer-tone-shiki > p, html[data-theme="dark"] .article > .writer-tone-miruna > p, html[data-theme="dark"] .article > .writer-tone-seiri > p, html[data-theme="dark"] .article p { color:#e2e8f0; }
html[data-theme="dark"] .article li { color:#e2e8f0; }
html[data-theme="dark"] .article .article-writer-intro { border-bottom:1px solid rgba(148,163,184,.18); }
html[data-theme="dark"] .article .article-writer .writer-photo { border:2px solid rgba(148,163,184,.18); box-shadow:0 0 0 1px rgba(148,163,184,.18); }
html[data-theme="dark"] .article .article-writer strong { color:#e2e8f0; }
html[data-theme="dark"] .article .article-writer small { color:#94a3b8; }
html[data-theme="dark"] .article .article-writer-link { color:#94a3b8; }
html[data-theme="dark"] .article-date-row span { border:1px solid rgba(148,163,184,.18); color:#94a3b8; background:#0f172a; }
html[data-theme="dark"] .article-writer-intro > p { color:#94a3b8; }
html[data-theme="dark"] .article-writer-intro > p strong { color:#e2e8f0; }
html[data-theme="dark"] .article-writer-intro .writer-opening-note { border-left:4px solid var(--writer-accent,rgba(148,163,184,.18)); background:var(--writer-soft,#0f172a); }
html[data-theme="dark"] .article .article-utility span, html[data-theme="dark"] .article .article-utility a { border-color:rgba(148,163,184,.18); background:#0f172a; color:#94a3b8; }
html[data-theme="dark"] .article .article-utility a { background:#0f172a; color:#94a3b8; }
html[data-theme="dark"] .article .article-quick-answer { border:1px solid rgba(148,163,184,.18); border-left:5px solid var(--writer-accent,rgba(148,163,184,.18)); background:var(--writer-soft,#0f172a); }
html[data-theme="dark"] .article .article-quick-answer strong { color:#e2e8f0; }
html[data-theme="dark"] .article .article-quick-answer p { color:#e2e8f0; }
html[data-theme="dark"] .article .fact-box { border-color:rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .article .campaign-tool { border-color:rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .article .campaign-tool th { color:#e2e8f0; background:#111c30; }
html[data-theme="dark"] .article .campaign-tool td { color:#e2e8f0; }
html[data-theme="dark"] .article .action-checklist li { border-color:rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .post-card-link:hover h3 { color:#94a3b8; }
html[data-theme="dark"] .post-card-link:focus-visible { outline:3px solid #64748b; }
html[data-theme="dark"] .post-card-writer { border-top:1px solid rgba(148,163,184,.18); }
html[data-theme="dark"] .post-card-writer b { color:#94a3b8; }
html[data-theme="dark"] .post-card-writer small { color:#94a3b8; }
html[data-theme="dark"] .post-rank { background:#020617; color:#e2e8f0; }
html[data-theme="dark"] .post-card-dates time { border:1px solid rgba(148,163,184,.18); background:#0f172a; color:#94a3b8; }
html[data-theme="dark"] .post-card-dates .post-card-updated { border-color:#34d399; background:#0f172a; color:#34d399; }
html[data-theme="dark"] .mark-expired { background:#111c30; color:#94a3b8; }
html[data-theme="dark"] .writer-ranking-section { border-top:1px solid rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .writer-ranking-card { border:1px solid rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .writer-ranking-card:hover { border-color:rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .writer-ranking-number { background:#111c30; color:#94a3b8; }
html[data-theme="dark"] .writer-ranking-card strong { color:#e2e8f0; }
html[data-theme="dark"] .writer-ranking-card small { color:#94a3b8; }
html[data-theme="dark"] .writer-ranking-card em { color:#94a3b8; }
html[data-theme="dark"] .article table { border:1px solid rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .article table th, html[data-theme="dark"] .article table td { border-right:1px solid rgba(148,163,184,.18); border-bottom:1px solid rgba(148,163,184,.18); color:#e2e8f0; }
html[data-theme="dark"] .article table th { color:#e2e8f0; background:#111c30; }
html[data-theme="dark"] .article .economy-decision-table { border:2px solid rgba(148,163,184,.18); }
html[data-theme="dark"] .article .economy-decision-table th { background:#111c30; color:#e2e8f0; }
html[data-theme="dark"] .article .economy-decision-table td:nth-child(2) { color:#94a3b8; }
html[data-theme="dark"] .article .economy-result-table { border-color:rgba(148,163,184,.18); }
html[data-theme="dark"] .article .economy-result-table th { background:#111c30; color:#94a3b8; }
html[data-theme="dark"] .article .economy-result-table td:nth-child(1) { color:#e2e8f0; }
html[data-theme="dark"] .article .economy-result-table td:nth-child(3) { color:#34d399; }
html[data-theme="dark"] .article .affiliate-disclosure { border:1px solid rgba(148,163,184,.18); background:#0f172a; color:#94a3b8; }
html[data-theme="dark"] .return-hub { border-bottom:1px solid rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .today-pulse-label { color:#34d399; }
html[data-theme="dark"] .today-pulse small { color:#94a3b8; }
html[data-theme="dark"] .today-pulse a { color:#94a3b8; }
html[data-theme="dark"] .return-digest-card { border:1px solid rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .return-digest-kicker { color:#34d399; }
html[data-theme="dark"] .return-digest-card li a { color:#e2e8f0; }
html[data-theme="dark"] .return-digest-card li small { color:#94a3b8; }
html[data-theme="dark"] .return-watch-links a { border:1px solid rgba(148,163,184,.18); background:#0f172a; color:#94a3b8; }
html[data-theme="dark"] .return-reading { border-top:1px solid rgba(148,163,184,.18); }
html[data-theme="dark"] .return-reading-tabs { border:1px solid rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .return-reading-tabs button { color:#94a3b8; }
html[data-theme="dark"] .return-reading-tabs button[aria-selected="true"] { background:#0f172a; color:#e2e8f0; }
html[data-theme="dark"] .return-reading-item { border:1px solid rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .return-reading-item:hover { border-color:rgba(148,163,184,.18); }
html[data-theme="dark"] .return-reading-item small { color:#34d399; }
html[data-theme="dark"] .return-reading-all { color:#94a3b8; }
html[data-theme="dark"] .compass-control button span { color:#94a3b8; }
html[data-theme="dark"] .compass-control button[aria-selected="true"] span { color:#34d399; }
html[data-theme="dark"] .compass-control button:focus-visible { outline:3px solid #64748b; }
html[data-theme="dark"] .compass-result > div b { color:#e2e8f0; }
html[data-theme="dark"] .compass-result > div p { color:#94a3b8; }
html[data-theme="dark"] .compass-step { background:#111c30; color:#94a3b8; }
html[data-theme="dark"] .article .article-inline-visual { background:var(--writer-soft,#0f172a); }
html[data-theme="dark"] .article .article-inline-visual figcaption { color:var(--writer-accent,#94a3b8); }
html[data-theme="dark"] .article .iluma-editor-profile { border-color:rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .iluma-editor-profile-grid img { box-shadow:0 0 0 3px #0f172a,0 0 0 4px rgba(148,163,184,.18); }
html[data-theme="dark"] .writer-card.social-member { border-color:rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .team-profile-section { background:#0f172a; }
html[data-theme="dark"] .team-profile-layout h2 { color:#e2e8f0; }
html[data-theme="dark"] .team-profile-layout p { color:#94a3b8; }
html[data-theme="dark"] .team-social-links a { border:1px solid rgba(148,163,184,.18); background:#0f172a; color:#e2e8f0; }
html[data-theme="dark"] .team-social-links a:hover { border-color:rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .team-social-links span { color:#94a3b8; }
html[data-theme="dark"] .writer-background-section { background:#0f172a; }
html[data-theme="dark"] .writer-background-grid h2 { color:#e2e8f0; }
html[data-theme="dark"] .writer-background-grid p { color:#94a3b8; }
html[data-theme="dark"] .writer-profile-points div { border:1px solid rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .writer-profile-points dt { color:#94a3b8; }
html[data-theme="dark"] .writer-profile-points dd { color:#e2e8f0; }
html[data-theme="dark"] .flow-gateway { border-top:1px solid rgba(148,163,184,.18); border-bottom:1px solid rgba(148,163,184,.18); background:#111c30; }
html[data-theme="dark"] .flow-gateway-copy h2 { color:#e2e8f0; }
html[data-theme="dark"] .flow-gateway-copy p { color:#94a3b8; }
html[data-theme="dark"] .flow-gateway-status span { border:1px solid rgba(148,163,184,.18); background:#0f172a; color:#94a3b8; }
html[data-theme="dark"] .flow-gateway-link { background:#020617; color:#e2e8f0; }
html[data-theme="dark"] .flow-gateway-link:hover { background:#0f172a; }
html[data-theme="dark"] .site-search { background:#0f172a; }
html[data-theme="dark"] .search-form .search-field { border:1px solid rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .search-form .search-field:focus { outline:2px solid #64748b; border-color:rgba(148,163,184,.18); }
html[data-theme="dark"] .search-form .search-submit { color:#e2e8f0; }
html[data-theme="dark"] .search-form .search-submit:hover { background:#0f172a; }
html[data-theme="dark"] .archive-section { background:#0f172a; }
html[data-theme="dark"] .archive-desc { color:#94a3b8; }
html[data-theme="dark"] .archive-sort { background:#0f172a; }
html[data-theme="dark"] .archive-sort-tab { color:#94a3b8; }
html[data-theme="dark"] .archive-sort-tab.is-active { color:#e2e8f0; }
html[data-theme="dark"] .empty-note { border:1px dashed rgba(148,163,184,.18); background:#0f172a; color:#94a3b8; }
html[data-theme="dark"] .search-suggest { color:#94a3b8; }
html[data-theme="dark"] .search-suggest a { border:1px solid rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .pagination .page-numbers { border:1px solid rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .pagination .page-numbers.current { color:#e2e8f0; }
html[data-theme="dark"] .mark-expired { background:#111c30; color:#94a3b8; }
html[data-theme="dark"] .rating-finder { background:#0f172a; }
html[data-theme="dark"] .rating-tab:focus-visible { outline:3px solid #020617; }
html[data-theme="dark"] .rating-panel-copy { color:#94a3b8; }
html[data-theme="dark"] .rating-panel-copy strong { color:#e2e8f0; }
html[data-theme="dark"] .rating-empty { border:1px dashed rgba(148,163,184,.18); background:#0f172a; color:#94a3b8; }
html[data-theme="dark"] .okaneta-rating-badge { color:#e2e8f0; }
html[data-theme="dark"] .okaneta-rating-badge.rating-s { background:linear-gradient(135deg,#020617,#34d399); }
html[data-theme="dark"] .okaneta-rating-badge.rating-a { background:linear-gradient(135deg,#64748b,#0f172a); }
html[data-theme="dark"] .okaneta-rating-badge.rating-b { background:linear-gradient(135deg,#64748b,#0f172a); }
html[data-theme="dark"] .okaneta-rating-badge.rating-c { background:linear-gradient(135deg,#34d399,#059669); }
html[data-theme="dark"] .okaneta-rating-badge.rating-d { background:linear-gradient(135deg,#34d399,#0f172a); }
html[data-theme="dark"] .deep-dive-section { background:#0f172a; }
html[data-theme="dark"] .deep-dive-card { border:1px solid rgba(148,163,184,.18); border-top:4px solid rgba(148,163,184,.18); background:#0f172a; color:#e2e8f0; }
html[data-theme="dark"] .deep-dive-card:hover { border-color:rgba(148,163,184,.18); }
html[data-theme="dark"] .deep-dive-card span { color:#94a3b8; }
html[data-theme="dark"] .deep-dive-card small { color:#94a3b8; }
html[data-theme="dark"] .dive-card-credit { border-top-color:rgba(148,163,184,.18); }
html[data-theme="dark"] .dive-card-economy { border-top-color:#34d399; }
html[data-theme="dark"] .dive-card-flow { border-top-color:rgba(148,163,184,.18); }
html[data-theme="dark"] .dive-card-fixed { border-top-color:#34d399; }
html[data-theme="dark"] .economy-guide-strip a, html[data-theme="dark"] .economy-guide-link { border:1px solid rgba(148,163,184,.18); background:#0f172a; color:#e2e8f0; }
html[data-theme="dark"] .economy-guide-strip a:hover, html[data-theme="dark"] .economy-guide-link:hover { border-color:rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .priority-card { border-left-color:#34d399; }
html[data-theme="dark"] body.home .priority-card.pcat-credit-card { border-left-color:rgba(148,163,184,.18); }
html[data-theme="dark"] body.home .priority-card.pcat-bank { border-left-color:rgba(148,163,184,.18); }
html[data-theme="dark"] body.home .priority-card.pcat-securities { border-left-color:rgba(148,163,184,.18); }
html[data-theme="dark"] body.home .priority-card.pcat-point { border-left-color:#34d399; }
html[data-theme="dark"] body.home .priority-card.pcat-breaking { border-left-color:#34d399; }
html[data-theme="dark"] body.home .priority-card.pcat-tax { border-left-color:#34d399; }
html[data-theme="dark"] body.home .priority-card.pcat-saving { border-left-color:#34d399; }
html[data-theme="dark"] body.home .priority-card.pcat-rakuten { border-left-color:#34d399; }
html[data-theme="dark"] body.home .priority-card.pcat-paypay { border-left-color:#34d399; }
html[data-theme="dark"] body.home .priority-card.pcat-subscription, html[data-theme="dark"] body.home .priority-card.pcat-fixed-cost, html[data-theme="dark"] body.home .priority-card.pcat-water-server { border-left-color:rgba(148,163,184,.18); }
html[data-theme="dark"] .priority-deadline.is-urgent { background:#111c30; color:#34d399; box-shadow:inset 0 0 0 1px #34d399; }
html[data-theme="dark"] .priority-deadline.is-urgent::before { background:#34d399; }
html[data-theme="dark"] .priority-deadline.is-soon { background:#111c30; color:#34d399; box-shadow:inset 0 0 0 1px #34d399; }
html[data-theme="dark"] .priority-deadline.is-later { background:#0f172a; color:#94a3b8; box-shadow:inset 0 0 0 1px rgba(148,163,184,.18); }
html[data-theme="dark"] .priority-logo { background:#0f172a; }
html[data-theme="dark"] .breadcrumb li { color:var(--muted, #94a3b8); }
html[data-theme="dark"] .breadcrumb li + li::before { color:var(--muted, #64748b); }
html[data-theme="dark"] .breadcrumb a { color:var(--muted, #94a3b8); }
html[data-theme="dark"] .breadcrumb [aria-current="page"] { color:var(--ink, #e2e8f0); }
html[data-theme="dark"] .archive-desc { color:var(--muted, #94a3b8); }
html[data-theme="dark"] .archive-list-heading { color:var(--muted, #94a3b8); }
html[data-theme="dark"] .footer-categories-title { color:#e2e8f0; }
html[data-theme="dark"] .article .article-toc { border:1px solid rgba(148,163,184,.18); background:var(--writer-soft,#0f172a); }
html[data-theme="dark"] .article .article-toc > summary::after { color:var(--writer-accent,#94a3b8); }
html[data-theme="dark"] .article .article-toc > summary strong { color:#e2e8f0; }
html[data-theme="dark"] .article .article-toc > summary .eyebrow { color:var(--writer-accent,#34d399); }
html[data-theme="dark"] .article .toc-list > .toc-item { color:#e2e8f0; }
html[data-theme="dark"] .article .toc-list a { text-decoration-color:rgba(148,163,184,.18); }
html[data-theme="dark"] .article .toc-list a:hover { color:var(--writer-accent,#94a3b8); }
html[data-theme="dark"] .article .toc-sub li { color:#94a3b8; }
html[data-theme="dark"] .priority-deadline.is-upcoming { background:#0f172a; color:#94a3b8; box-shadow:inset 0 0 0 1px rgba(148,163,184,.18); }
html[data-theme="dark"] .campaign-state.campaign-state-upcoming { border-color:rgba(148,163,184,.18); background:#0f172a; color:#94a3b8; }
html[data-theme="dark"] .campaign-state.campaign-state-upcoming strong { color:#94a3b8; }
html[data-theme="dark"] .priority-upcoming { border:1px dashed rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .priority-upcoming-label { color:#94a3b8; }
html[data-theme="dark"] .service-picker-section { background:#0f172a; }
html[data-theme="dark"] .service-picker-jumps a { border:1px solid rgba(148,163,184,.18); background:#0f172a; color:#e2e8f0; }
html[data-theme="dark"] .service-picker-jumps a:hover { border-color:rgba(148,163,184,.18); background:#111c30; }
html[data-theme="dark"] .service-picker-group + .service-picker-group { border-top:1px solid rgba(148,163,184,.18); }
html[data-theme="dark"] .service-picker-heading span { color:#94a3b8; }
html[data-theme="dark"] .service-picker-heading h3 { color:#e2e8f0; }
html[data-theme="dark"] .service-picker-heading p { color:#94a3b8; }
html[data-theme="dark"] .service-picker-heading > a { color:#94a3b8; }
html[data-theme="dark"] .service-choice-card { border:1px solid rgba(148,163,184,.18); border-top:4px solid rgba(148,163,184,.18); background:#0f172a; color:#e2e8f0; }
html[data-theme="dark"] .service-choice-card:hover { border-color:rgba(148,163,184,.18); }
html[data-theme="dark"] .service-choice-card > span { color:#94a3b8; }
html[data-theme="dark"] .service-choice-card small { color:#94a3b8; }
html[data-theme="dark"] .service-choice-card em { color:#94a3b8; }
html[data-theme="dark"] .service-choice-card-brand { border-top-color:#34d399; }
html[data-theme="dark"] .service-choice-card-brand:hover { border-color:#34d399; }
html[data-theme="dark"] .article-addendum { background:#0f172a; }
html[data-theme="dark"] .article-addendum strong { background:#0f172a; color:#e2e8f0; }
@media (max-width:760px) {
  html[data-theme="dark"] body.home .home-hero-inner { background:#0f172a; }
  html[data-theme="dark"] body.home .home-hero-role { color:#e2e8f0; }
  html[data-theme="dark"] .article table.mobile-key-value-table tr { border:1px solid rgba(148,163,184,.18); background:#0f172a; }
  html[data-theme="dark"] .article table.mobile-key-value-table tr > th, html[data-theme="dark"] .article table.mobile-key-value-table tr > td { background:#0f172a; }
  html[data-theme="dark"] .article table.mobile-key-value-table tr > th { border-right:1px solid rgba(148,163,184,.18); background:#111c30; color:#94a3b8; }
  html[data-theme="dark"] .article table.mobile-card-table tr { border:1px solid rgba(148,163,184,.18); background:#0f172a; }
  html[data-theme="dark"] .article table.mobile-card-table tr > th, html[data-theme="dark"] .article table.mobile-card-table tr > td { border-bottom:1px solid rgba(148,163,184,.18); background:#0f172a; color:#e2e8f0; }
  html[data-theme="dark"] .article table.mobile-card-table tr > [data-label]::before { color:#94a3b8; }
  html[data-theme="dark"] .article table.mobile-card-table.economy-decision-table tr, html[data-theme="dark"] .article table.mobile-card-table.economy-result-table tr { border-color:rgba(148,163,184,.18); }
}
@media (max-width:900px) {
  html[data-theme="dark"] .nav-toggle { border:1px solid rgba(148,163,184,.18); background:#0f172a; }
  html[data-theme="dark"] .nav-toggle-bar, html[data-theme="dark"] .nav-toggle-box::before, html[data-theme="dark"] .nav-toggle-box::after { background:#020617; }
  html[data-theme="dark"] .site-header .nav-links { background:#0f172a; }
}
@media (min-width:761px) {
  html[data-theme="dark"] body.home .priority-card:hover { border-color:#34d399; }
  html[data-theme="dark"] body.home .priority-card-main:hover { border-color:#34d399; }
  html[data-theme="dark"] body.home .compass-control button[aria-selected="false"]:hover { border-color:rgba(148,163,184,.18); background:#0f172a; }
}


/* ===== 2026-09-03 ヘッダー新規パーツ（配色トグル／マーケットティッカー）=====
   上のダークモード用ブロックは style.css から機械生成しているが、ここは
   新規クラスなので生成元に存在しない。ライト／ダーク両方を手で書いている。
   生成スクリプトはこのマーカー以降を入力から切り落とすので、再生成しても消えない。 */

/* --- 配色トグル --- */
.nav-actions { display:flex; align-items:center; gap:8px; }
.theme-toggle { display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px; padding:0; border:1px solid #d8ebe4; border-radius:10px; background:#fffdf7; color:#40748a; cursor:pointer; transition:border-color .18s ease, color .18s ease; }
.theme-toggle:hover { border-color:#a9d8c8; color:#e77560; }
.theme-toggle:focus-visible { outline:2px solid #40748a; outline-offset:2px; }
/* 太陽と月は CSS だけで描く（アイコンフォントも SVG も足さない） */
.theme-toggle-sun, .theme-toggle-moon { display:block; width:15px; height:15px; border-radius:50%; }
.theme-toggle-sun { background:currentColor; box-shadow:0 -10px 0 -5.5px currentColor, 0 10px 0 -5.5px currentColor, -10px 0 0 -5.5px currentColor, 10px 0 0 -5.5px currentColor, 7px 7px 0 -5.5px currentColor, -7px -7px 0 -5.5px currentColor, 7px -7px 0 -5.5px currentColor, -7px 7px 0 -5.5px currentColor; }
.theme-toggle-moon { box-shadow:inset -4.5px -2.5px 0 0 currentColor; transform:rotate(-24deg); }
.theme-toggle-sun { display:none; }
html[data-theme="dark"] .theme-toggle-sun { display:block; }
html[data-theme="dark"] .theme-toggle-moon { display:none; }
html[data-theme="dark"] .theme-toggle { border-color:rgba(148,163,184,.24); background:#0f172a; color:#94a3b8; }
html[data-theme="dark"] .theme-toggle:hover { border-color:#34d399; color:#34d399; }

/* --- マーケットティッカー（終値・前営業日比。リアルタイムではない） --- */
.market-ticker { background:#effbf4; border-bottom:1px solid var(--line); overflow:hidden; }
.market-ticker-inner { width:min(1180px,calc(100% - 40px)); margin:auto; display:flex; align-items:center; gap:14px; min-height:42px; }
.market-ticker-label { flex:0 0 auto; font-size:11px; font-weight:900; letter-spacing:.09em; color:#e77560; }
.market-ticker-track { flex:1 1 auto; min-width:0; display:flex; overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent,#000 22px,#000 calc(100% - 22px),transparent); mask-image:linear-gradient(90deg,transparent,#000 22px,#000 calc(100% - 22px),transparent); }
.market-ticker-list { flex:0 0 auto; display:flex; align-items:center; gap:24px; margin:0; padding:0 12px 0 0; list-style:none; animation:okaneta-ticker 46s linear infinite; }
.market-ticker-track:hover .market-ticker-list { animation-play-state:paused; }
.market-ticker-item { display:flex; align-items:baseline; gap:7px; white-space:nowrap; font-size:13px; }
.market-ticker-name { color:#587181; font-weight:800; }
.market-ticker-value { font-weight:900; font-variant-numeric:tabular-nums; }
.market-ticker-delta { padding:1px 7px; border-radius:99px; font-size:11px; font-weight:900; font-variant-numeric:tabular-nums; }
.market-ticker-delta.is-up { color:#1c6b4c; background:#d5f0e2; }
.market-ticker-delta.is-down { color:#a8402f; background:#ffe1d9; }
.market-ticker-delta.is-flat { color:#5c7480; background:#e3ece9; }
.market-ticker-note { flex:0 0 auto; font-size:10px; font-weight:700; color:#7f96a3; }
@keyframes okaneta-ticker { from { transform:translateX(0); } to { transform:translateX(-100%); } }
@media (prefers-reduced-motion:reduce) {
  .market-ticker-list { animation:none; }
  .market-ticker-track { overflow-x:auto; -webkit-mask-image:none; mask-image:none; }
  .market-ticker-list[aria-hidden="true"] { display:none; }
}
html[data-theme="dark"] .market-ticker { background:#0b1120; border-bottom-color:rgba(148,163,184,.18); }
html[data-theme="dark"] .market-ticker-label { color:#34d399; }
html[data-theme="dark"] .market-ticker-name { color:#94a3b8; }
html[data-theme="dark"] .market-ticker-value { color:#e2e8f0; }
html[data-theme="dark"] .market-ticker-note { color:#64748b; }
html[data-theme="dark"] .market-ticker-delta.is-up { color:#6ee7b7; background:rgba(16,185,129,.16); }
html[data-theme="dark"] .market-ticker-delta.is-down { color:#fca5a5; background:rgba(248,113,113,.16); }
html[data-theme="dark"] .market-ticker-delta.is-flat { color:#94a3b8; background:rgba(148,163,184,.14); }

@media (max-width:760px) {
  .market-ticker-inner { width:min(100% - 28px,1180px); gap:10px; min-height:38px; }
  .market-ticker-note { display:none; }
  .market-ticker-item { font-size:12px; }
  .theme-toggle { width:34px; height:34px; }
}


/* --- ダークモードの手当て（機械生成では拾えなかった箇所）--- */

/* 1) CSS変数。--lime / --coral / --sky / --lavender はブランドのアクセントで
      暗色地でもよく映えるので、あえて据え置く（カード上端の色分けが生きる）。
      地・文字・罫線だけを暗色側へ寄せる。 */
html[data-theme="dark"] {
  --paper:#0f172a;
  --mint:#111c30;
  --ink:#e2e8f0;
  --night:#020617;
  --line:rgba(148,163,184,.18);
  --muted:#94a3b8;
}

/* 2) ロゴ。ダーク用の白抜きSVG(okaneta-brand-light.svg)は元からあり、
      フッターで使っている。ヘッダーでは両方出して CSS で出し分ける
      （<img src> は CSS で差し替えられず、<picture> の media では
      手動トグルに追従できないため）。 */
.brand-logo-dark { display:none; }
html[data-theme="dark"] .brand-logo-light { display:none; }
html[data-theme="dark"] .brand-logo-dark { display:block; }

/* 3) ヒーロー。背景写真は明るいイラストなので、そのままだと暗色地に
      白文字を重ねても読めない。文字が乗る左側だけを暗く落とす。
      背景画像そのものは差し替えない（テーマ資産を増やさない）。 */
html[data-theme="dark"] body.home .home-hero {
  background-image:linear-gradient(90deg, rgba(2,6,23,.95) 0%, rgba(2,6,23,.88) 38%, rgba(2,6,23,.42) 72%, rgba(2,6,23,.22) 100%), url("assets/tokuhaya-cute-ai-office-1280.webp");
  background-position:center; background-size:cover; background-repeat:no-repeat;
  border-bottom-color:rgba(148,163,184,.18);
}
html[data-theme="dark"] body.home .home-hero h1 { color:#e2e8f0; }
html[data-theme="dark"] body.home .home-hero .home-hero-role,
html[data-theme="dark"] body.home .home-hero .home-hero-subcopy { color:#94a3b8; }
html[data-theme="dark"] body.home .home-hero-link { background:#34d399; color:#020617; box-shadow:none; }
html[data-theme="dark"] body.home .home-hero-link:hover { background:#6ee7b7; }
@media (max-width:760px) {
  /* モバイルは文字が画像の上に全幅で乗るので、一様に暗く落とす */
  html[data-theme="dark"] body.home .home-hero {
    background-image:linear-gradient(180deg, rgba(2,6,23,.93) 0%, rgba(2,6,23,.86) 60%, rgba(2,6,23,.72) 100%), url("assets/tokuhaya-cute-ai-office-1280.webp");
  }
}


/* ===== 2026-09-03 ヒーロー内クイックファインダー＋カテゴリグリッド =====
   AI Studio のモックの構成に合わせて追加した新規パーツ。
   モックの記事・数値はダミーだったので、中身は実在のカテゴリと実計算に置き換えている。
   ダークの上書きはこのブロック内に手で書く（生成スクリプトの対象外）。 */

/* --- ヒーローを2カラムにする --- */
body.home .home-hero { min-height:520px; }
body.home .home-hero-inner > .hero-finder { width:auto; }
@media (min-width:981px) {
  body.home .home-hero-inner { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,430px); gap:44px; align-items:center; }
  body.home .home-hero-inner > div:first-child { width:auto; max-width:520px; }
}

.hero-finder { margin-top:26px; border:1px solid #cde7da; border-radius:12px; background:rgba(255,253,247,.94); box-shadow:0 10px 30px rgba(24,51,74,.10); backdrop-filter:blur(3px); overflow:hidden; }
.hero-finder-tabs { display:flex; gap:0; border-bottom:1px solid var(--line); }
.hero-finder-tabs button { flex:1 1 0; min-height:46px; padding:0 12px; border:0; border-bottom:2px solid transparent; background:transparent; color:#587181; font:inherit; font-size:13px; font-weight:900; cursor:pointer; }
.hero-finder-tabs button[aria-selected="true"] { color:#18334a; border-bottom-color:#e77560; background:rgba(217,246,92,.16); }
.hero-finder-tabs button:focus-visible { outline:2px solid #40748a; outline-offset:-2px; }
.hero-finder-panel { padding:16px; }
.hero-finder-lead { margin:0 0 12px; color:#587181; font-size:12px; font-weight:800; line-height:1.6; }

/* 目的から探す */
.goal-list { display:grid; grid-template-columns:1fr; gap:8px; margin:0; padding:0; list-style:none; }
.goal-card { display:block; padding:12px 14px; border:1px solid #d8ebe4; border-left:3px solid var(--lime); border-radius:8px; background:#fffdf7; }
.goal-card:hover { border-color:#a9d8c8; border-left-color:var(--lime); background:var(--mint); }
.goal-securities { border-left-color:var(--sky); }
.goal-credit-card { border-left-color:var(--coral); }
.goal-tax { border-left-color:var(--lavender); }
.goal-label { display:block; color:#e77560; font-size:10px; font-weight:900; letter-spacing:.04em; }
.goal-card strong { display:block; margin-top:3px; font-size:14px; line-height:1.45; }
.goal-card small { display:block; margin-top:2px; color:#607b88; font-size:11px; font-weight:700; }
.goal-card em { display:block; margin-top:5px; color:#40748a; font-size:11px; font-weight:900; font-style:normal; }

/* 新NISAシミュレーター */
.sim-controls { display:grid; gap:11px; }
.sim-controls label { display:grid; gap:4px; color:#587181; font-size:11px; font-weight:900; }
.sim-controls label span { justify-self:end; margin-top:-16px; color:#18334a; font-size:13px; }
.sim-controls input[type="range"] { width:100%; accent-color:#e77560; }
.sim-result { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:14px 0 0; }
.sim-result > div { padding:9px 11px; border:1px solid #d8ebe4; border-radius:8px; background:#fffdf7; }
.sim-result dt { color:#607b88; font-size:10px; font-weight:900; }
.sim-result dd { margin:2px 0 0; font-size:16px; font-weight:900; font-variant-numeric:tabular-nums; }
.sim-result-main { border-color:#a9d8c8; background:var(--mint); }
.sim-result-main dd { font-size:20px; }
.sim-result-tax { grid-column:1 / -1; border-color:#ead9bb; background:#fff8ec; }
.sim-result-tax dd { color:#b64e38; }
.sim-note { margin:11px 0 0; color:#7f96a3; font-size:10px; font-weight:700; line-height:1.6; }
.sim-note a { color:#40748a; font-weight:900; text-decoration:underline; text-underline-offset:2px; }

/* --- カテゴリから探す --- */
.category-browse { background:#fffdf7; }
.category-browse-grid { display:grid; grid-template-columns:repeat(6,1fr); gap:10px; margin:0; padding:0; list-style:none; }
.category-browse-card { display:flex; align-items:center; justify-content:space-between; gap:8px; min-height:58px; padding:11px 13px; border:1px solid #d8ebe4; border-radius:8px; background:#fffdf7; }
.category-browse-card:hover { border-color:#a9d8c8; background:var(--mint); }
.category-browse-card strong { font-size:14px; font-weight:900; line-height:1.3; }
.category-browse-card span { flex:0 0 auto; color:#e77560; font-size:16px; font-weight:900; font-variant-numeric:tabular-nums; }
.category-browse-card small { margin-left:1px; color:#7f96a3; font-size:10px; font-weight:800; }

@media (max-width:980px) {
  .hero-finder { max-width:520px; }
}
@media (max-width:760px) {
  body.home .home-hero { min-height:0; }
  .hero-finder { margin-top:20px; max-width:100%; }
  .hero-finder-panel { padding:13px; }
  .goal-card strong { font-size:13px; }
  .sim-result { gap:6px; }
  .sim-result dd { font-size:15px; }
  .sim-result-main dd { font-size:18px; }
  .category-browse-grid { grid-template-columns:repeat(2,1fr); gap:8px; }
  .category-browse-card { min-height:50px; padding:9px 11px; }
  .category-browse-card strong { font-size:13px; }
}

/* --- ダーク --- */
html[data-theme="dark"] .hero-finder { border-color:rgba(148,163,184,.22); background:rgba(15,23,42,.92); box-shadow:0 14px 40px rgba(2,6,23,.55); }
html[data-theme="dark"] .hero-finder-tabs { border-bottom-color:rgba(148,163,184,.18); }
html[data-theme="dark"] .hero-finder-tabs button { color:#94a3b8; }
html[data-theme="dark"] .hero-finder-tabs button[aria-selected="true"] { color:#e2e8f0; border-bottom-color:#34d399; background:rgba(52,211,153,.12); }
html[data-theme="dark"] .hero-finder-lead { color:#94a3b8; }
html[data-theme="dark"] .goal-card { border-color:rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .goal-card:hover { border-color:rgba(52,211,153,.5); background:#111c30; }
html[data-theme="dark"] .goal-label { color:#34d399; }
html[data-theme="dark"] .goal-card small { color:#94a3b8; }
html[data-theme="dark"] .goal-card em { color:#6ee7b7; }
html[data-theme="dark"] .sim-controls label { color:#94a3b8; }
html[data-theme="dark"] .sim-controls label span { color:#e2e8f0; }
html[data-theme="dark"] .sim-controls input[type="range"] { accent-color:#34d399; }
html[data-theme="dark"] .sim-result > div { border-color:rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .sim-result dt { color:#94a3b8; }
html[data-theme="dark"] .sim-result-main { border-color:rgba(52,211,153,.45); background:rgba(52,211,153,.10); }
html[data-theme="dark"] .sim-result-tax { border-color:rgba(251,191,36,.35); background:rgba(251,191,36,.08); }
html[data-theme="dark"] .sim-result-tax dd { color:#fcd34d; }
html[data-theme="dark"] .sim-note { color:#64748b; }
html[data-theme="dark"] .sim-note a { color:#6ee7b7; }
html[data-theme="dark"] .category-browse { background:#020617; }
html[data-theme="dark"] .category-browse-card { border-color:rgba(148,163,184,.18); background:#0f172a; }
html[data-theme="dark"] .category-browse-card:hover { border-color:rgba(52,211,153,.5); background:#111c30; }
html[data-theme="dark"] .category-browse-card span { color:#34d399; }
html[data-theme="dark"] .category-browse-card small { color:#64748b; }

/* --- 2026-09-03 トップのセクション順（最終世代・全セクションを明示）---
   style.css には order の定義が複数世代残っていて、実効順が世代のマージになっていた。
   ここで全セクションを一度に指定し、実効順がこのブロックだけで決まるようにする。
   セクションを足したら必ずここにも追記すること（書き忘れると order:0 で先頭に飛ぶ）。
   PC・モバイルとも同じ並び（2026-08-19 以降の方針）。 */
body.home main { display:flex; flex-direction:column; }
body.home .quick-nav            { order:1; }
body.home .home-hero            { order:2; }
body.home .category-browse      { order:3; }
body.home .economy-section      { order:4; }
body.home .return-hub           { order:5; }
body.home .priority-section     { order:6; }
body.home .latest-section       { order:7; }
body.home .popular-section      { order:8; }
body.home .flow-gateway         { order:9; }
body.home .writer-ranking-section { order:10; }
body.home .writers-section      { order:11; }
body.home .office-section       { order:12; }
body.home .section-dark         { order:13; }

/* --- 2026-09-03 ダーク: 「濃い地に白文字」のチップの手当て ---
   元のライトテーマは background:var(--ink) + color:#fffdf7 で反転チップを作っていた。
   ダークでは --ink が明色になるうえ #fffdf7 も明色へ写るため、地と文字が同色になって
   文字が消える（検索ボタンが白い箱になっていた）。アクセントのチップとして描き直す。 */
html[data-theme="dark"] .search-form .search-submit,
html[data-theme="dark"] body.home .priority-kicker,
html[data-theme="dark"] body.home .compass-control button[aria-selected="true"],
html[data-theme="dark"] .archive-sort-tab.is-active,
html[data-theme="dark"] .pagination .page-numbers.current {
  background:#34d399; color:#020617; border-color:#34d399;
}
html[data-theme="dark"] .search-form .search-submit:hover,
html[data-theme="dark"] .archive-sort-tab.is-active:hover { background:#6ee7b7; color:#020617; }

/* --- 2026-09-03 ダーク: コントラスト不足の手当て ---
   ブラウザ上で全要素の実効コントラストを測って出た未達分（WCAG AA 4.5:1）。
   いずれも #64748b（2段目のミュート色）が暗色地に対して弱かったもの。 */
html[data-theme="dark"] .category-browse-card small { color:#8b9cb3; }
html[data-theme="dark"] .market-ticker-note { color:#8b9cb3; }
html[data-theme="dark"] .writer-card p,
html[data-theme="dark"] .team-card p { color:#94a3b8; }


/* ===================================================================
   2026-09-03 モック（AI Studio）の造形に寄せるスキン
   これ以降のブロックが最終世代。ヘッダー・上部ストリップ・ヒーローは
   ここで作り直しているので、上のレガシー定義は実質使われない。
   ダークが既定。ライトは同じ骨格の明色版として成立させている。
   =================================================================== */

:root {
  --ok-base:#020617; --ok-surface:#0f172a; --ok-raise:#111c30;
  --ok-line:rgba(148,163,184,.16); --ok-line-strong:rgba(148,163,184,.28);
  --ok-text:#e2e8f0; --ok-muted:#94a3b8; --ok-dim:#8b9cb3;
  --ok-accent:#34d399; --ok-accent-2:#6ee7b7; --ok-accent-deep:#059669;
  --ok-radius:14px;
}
html[data-theme="light"] {
  --ok-base:#f7faf9; --ok-surface:#ffffff; --ok-raise:#f2f7f5;
  --ok-line:rgba(24,51,74,.12); --ok-line-strong:rgba(24,51,74,.22);
  --ok-text:#0f2233; --ok-muted:#5b7180; --ok-dim:#6b8190;
  --ok-accent:#0f9d6e; --ok-accent-2:#0b7f59; --ok-accent-deep:#0b7f59;
}

body {
  font-family:"Plus Jakarta Sans","Zen Kaku Gothic New",-apple-system,BlinkMacSystemFont,"Hiragino Sans",Meiryo,sans-serif;
  background:var(--ok-base); color:var(--ok-text);
}
html[data-theme="dark"] body { background:var(--ok-base); color:var(--ok-text); }

/* --- 上部ストリップ --- */
.top-strip { border-bottom:1px solid var(--ok-line); background:var(--ok-base); font-size:11.5px; }
.top-strip-inner { width:min(1320px,calc(100% - 40px)); margin:auto; display:flex; align-items:center; gap:14px; min-height:34px; }
.top-strip-badge { flex:0 0 auto; padding:3px 9px; border-radius:6px; background:rgba(52,211,153,.14); color:var(--ok-accent); font-weight:800; letter-spacing:.06em; font-size:10.5px; }
.top-strip-lead { flex:1 1 auto; min-width:0; color:var(--ok-muted); font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.top-strip-facts { flex:0 0 auto; display:flex; align-items:center; gap:8px; color:var(--ok-muted); font-weight:700; }
.top-strip-facts i { font-style:normal; color:var(--ok-line-strong); }
.top-strip-facts a { color:var(--ok-accent); }
.top-strip-dot { width:6px; height:6px; border-radius:50%; background:var(--ok-accent); box-shadow:0 0 0 3px rgba(52,211,153,.16); }

/* --- ヘッダー --- */
.site-header { position:sticky; top:0; z-index:40; background:color-mix(in srgb, var(--ok-base) 88%, transparent); backdrop-filter:blur(10px); border-bottom:1px solid var(--ok-line); }
.site-header .topline { display:none; }
.nav { width:min(1320px,calc(100% - 40px)); margin:auto; display:flex; align-items:center; gap:22px; height:74px; }
.brand { flex:0 0 auto; display:flex; align-items:center; gap:11px; }
.brand-mark { width:42px; height:42px; display:grid; place-items:center; border-radius:12px; background:linear-gradient(140deg,var(--ok-accent),var(--ok-accent-deep)); color:#03130d; font-size:21px; font-weight:900; line-height:1; }
.brand-text { display:block; }
.brand-name { display:flex; align-items:center; gap:7px; color:var(--ok-text); font-size:21px; font-weight:800; letter-spacing:-.01em; line-height:1.1; }
.brand-tld { color:var(--ok-muted); font-weight:700; }
.brand-name em { padding:2px 7px; border-radius:6px; background:var(--ok-raise); border:1px solid var(--ok-line); color:var(--ok-muted); font-size:10px; font-style:normal; font-weight:800; }
.brand-text small { display:block; margin-top:1px; color:var(--ok-muted); font-size:10.5px; font-weight:700; }

.nav-links { flex:1 1 auto; display:flex; align-items:center; justify-content:center; gap:6px; font-size:13.5px; font-weight:800; color:var(--ok-muted); }
.nav-links a { padding:8px 12px; border-radius:9px; color:var(--ok-muted); }
.nav-links a:hover { color:var(--ok-text); background:var(--ok-raise); }
.nav-links .nav-pill.is-current { background:rgba(52,211,153,.14); color:var(--ok-accent); }
.nav-links .nav-flow-link { color:var(--ok-accent); }

.nav-actions { flex:0 0 auto; display:flex; align-items:center; gap:9px; }
.nav-search { position:relative; display:flex; align-items:center; }
.nav-search input { width:230px; height:40px; padding:0 34px 0 34px; border:1px solid var(--ok-line); border-radius:11px; background:var(--ok-surface); color:var(--ok-text); font:inherit; font-size:13px; font-weight:600; }
.nav-search input::placeholder { color:var(--ok-muted); }
.nav-search input:focus { outline:none; border-color:var(--ok-accent); }
.nav-search-icon { position:absolute; left:12px; width:13px; height:13px; border:2px solid var(--ok-muted); border-radius:50%; pointer-events:none; }
.nav-search-icon::after { content:""; position:absolute; right:-5px; bottom:-3px; width:6px; height:2px; background:var(--ok-muted); transform:rotate(45deg); }
.nav-search kbd { position:absolute; right:9px; min-width:20px; padding:1px 5px; border:1px solid var(--ok-line); border-radius:5px; background:var(--ok-raise); color:var(--ok-muted); font:inherit; font-size:11px; font-weight:800; text-align:center; }
.theme-toggle { width:40px; height:40px; border-radius:11px; border:1px solid var(--ok-line); background:var(--ok-surface); color:var(--ok-muted); }
.theme-toggle:hover { border-color:var(--ok-accent); color:var(--ok-accent); }

/* --- マーケットティッカー（スキン側で塗り直す） --- */
.market-ticker { background:var(--ok-surface); border-bottom:1px solid var(--ok-line); }
.market-ticker-inner { width:min(1320px,calc(100% - 40px)); min-height:40px; }
.market-ticker-label { color:var(--ok-accent); }
.market-ticker-name { color:var(--ok-muted); }
.market-ticker-value { color:var(--ok-text); }
.market-ticker-note { color:var(--ok-dim); }

/* --- ヒーロー：写真をやめ、モックと同じ平面のダーク地にする --- */
body.home .home-hero {
  min-height:0; display:block; border-bottom:1px solid var(--ok-line);
  background:
    radial-gradient(1100px 460px at 78% -10%, rgba(52,211,153,.13), transparent 62%),
    radial-gradient(760px 420px at 8% 8%, rgba(56,189,248,.07), transparent 60%),
    var(--ok-base);
}
body.home .home-hero::before { content:none; }
body.home .home-hero-inner { width:min(1320px,calc(100% - 40px)); display:block; padding:30px 0 44px; }
body.home .home-hero-inner > div:first-child { width:auto; max-width:none; }

.hero-top { display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; margin-bottom:24px; }
.hero-badges { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.hero-badge { display:inline-flex; align-items:center; gap:7px; padding:7px 13px; border:1px solid var(--ok-line); border-radius:999px; background:var(--ok-surface); color:var(--ok-muted); font-size:12.5px; font-weight:800; }
.hero-badge i { font-style:normal; color:var(--ok-accent); }
.hero-badge-accent { border-color:rgba(52,211,153,.3); background:rgba(52,211,153,.10); color:var(--ok-text); }

.hero-finder-tabs { display:inline-flex; gap:4px; padding:4px; border:1px solid var(--ok-line); border-radius:12px; background:var(--ok-surface); }
.hero-finder-tabs button { display:inline-flex; align-items:center; gap:7px; min-height:38px; padding:0 15px; border:0; border-radius:9px; background:transparent; color:var(--ok-muted); font:inherit; font-size:13px; font-weight:800; cursor:pointer; }
.hero-finder-tabs button i { font-style:normal; }
.hero-finder-tabs button[aria-selected="true"] { background:linear-gradient(140deg,var(--ok-accent),var(--ok-accent-deep)); color:#03130d; }
.hero-finder-tabs button:focus-visible { outline:2px solid var(--ok-accent); outline-offset:2px; }

body.home .home-hero h1 { max-width:none; margin:0 0 18px; color:var(--ok-text); font-size:clamp(32px,4.6vw,56px); font-weight:800; line-height:1.24; letter-spacing:-.02em; }
.hero-accent { background:linear-gradient(96deg,var(--ok-accent) 0%, var(--ok-accent-2) 42%, #d9f99d 100%); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:var(--ok-accent); }
.hero-sub { max-width:760px; margin:0 0 26px; color:var(--ok-muted); font-size:15px; font-weight:600; line-height:1.85; }

.hero-panel-head { display:flex; align-items:baseline; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:14px; }
.hero-panel-head h2 { display:flex; align-items:center; gap:9px; margin:0; font-size:15px; font-weight:800; color:var(--ok-text); }
.hero-panel-head p { margin:0; color:var(--ok-dim); font-size:12px; font-weight:700; }
.hero-dot { width:8px; height:8px; border-radius:50%; background:var(--ok-accent); box-shadow:0 0 0 4px rgba(52,211,153,.15); }

.goal-list { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin:0; padding:0; list-style:none; }
.goal-card { display:flex; flex-direction:column; height:100%; padding:18px; border:1px solid var(--ok-line); border-radius:var(--ok-radius); background:var(--ok-surface); transition:border-color .18s ease, transform .18s ease; }
.goal-card:hover { border-color:rgba(52,211,153,.55); transform:translateY(-2px); }
.goal-top { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:14px; }
.goal-icon { width:40px; height:40px; display:grid; place-items:center; border-radius:11px; background:var(--ok-raise); border:1px solid var(--ok-line); font-size:18px; }
.goal-label { padding:4px 9px; border-radius:999px; background:rgba(52,211,153,.12); color:var(--ok-accent); font-size:11px; font-weight:800; }
.goal-card strong { display:block; color:var(--ok-text); font-size:16px; font-weight:800; line-height:1.45; }
.goal-card small { display:block; margin-top:7px; color:var(--ok-muted); font-size:12.5px; font-weight:600; line-height:1.65; }
.goal-card em { display:flex; align-items:center; justify-content:space-between; margin-top:auto; padding-top:16px; color:var(--ok-accent); font-size:12.5px; font-style:normal; font-weight:800; }

/* シミュレーター */
.sim-wrap { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.15fr); gap:18px; align-items:start; }
.sim-controls { display:grid; gap:14px; padding:18px; border:1px solid var(--ok-line); border-radius:var(--ok-radius); background:var(--ok-surface); }
.sim-controls label { display:grid; gap:5px; color:var(--ok-muted); font-size:12px; font-weight:800; }
.sim-controls label span { justify-self:end; margin-top:-18px; color:var(--ok-text); font-size:15px; font-weight:800; }
.sim-controls input[type="range"] { width:100%; accent-color:var(--ok-accent); }
.sim-result { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:0; }
.sim-result > div { padding:13px 15px; border:1px solid var(--ok-line); border-radius:var(--ok-radius); background:var(--ok-surface); }
.sim-result dt { color:var(--ok-muted); font-size:11px; font-weight:800; }
.sim-result dd { margin:4px 0 0; color:var(--ok-text); font-size:19px; font-weight:800; font-variant-numeric:tabular-nums; }
.sim-result-main { border-color:rgba(52,211,153,.45); background:rgba(52,211,153,.09); }
.sim-result-main dd { font-size:25px; color:var(--ok-accent); }
.sim-result-tax { grid-column:1 / -1; border-color:rgba(251,191,36,.32); background:rgba(251,191,36,.07); }
.sim-result-tax dd { color:#fcd34d; }
.sim-note { margin:14px 0 0; color:var(--ok-dim); font-size:11px; font-weight:600; line-height:1.75; }
.sim-note a { color:var(--ok-accent); font-weight:800; text-decoration:underline; text-underline-offset:2px; }
html[data-theme="light"] .sim-result-tax dd { color:#a16207; }

/* --- 以降の共通セクション：モックのカード意匠に合わせる --- */
body.home main > section { background:var(--ok-base); }
body.home .container { width:min(1320px,calc(100% - 40px)); }
.section { padding:56px 0; }
.section-heading h2 { color:var(--ok-text); font-size:27px; font-weight:800; letter-spacing:-.01em; }
.eyebrow { color:var(--ok-accent); font-size:11px; font-weight:800; letter-spacing:.1em; }
.team-note { color:var(--ok-muted); font-size:12.5px; font-weight:600; }
.category-browse { background:var(--ok-base); }
.category-browse-card,
.service-choice-card,
.economy-card { border:1px solid var(--ok-line); border-radius:var(--ok-radius); background:var(--ok-surface); }
.category-browse-card:hover,
.service-choice-card:hover,
.economy-card:hover { border-color:rgba(52,211,153,.5); background:var(--ok-raise); }
.category-browse-card strong { color:var(--ok-text); }
.category-browse-card span { color:var(--ok-accent); }
.category-browse-card small { color:var(--ok-dim); }

@media (max-width:1100px) {
  .nav-links { display:none; }
  .nav-search input { width:180px; }
  .goal-list { grid-template-columns:repeat(2,1fr); }
  .sim-wrap { grid-template-columns:1fr; }
}
@media (max-width:760px) {
  .top-strip-lead, .top-strip-facts i, .nav-search kbd { display:none; }
  .top-strip-inner, .nav, .market-ticker-inner, body.home .home-hero-inner, body.home .container { width:min(100% - 28px,1320px); }
  .nav { height:64px; gap:12px; }
  .brand-mark { width:36px; height:36px; border-radius:10px; font-size:18px; }
  .brand-name { font-size:17px; }
  .brand-text small { display:none; }
  .nav-search { display:none; }
  .hero-top { margin-bottom:18px; }
  .hero-finder-tabs { width:100%; }
  .hero-finder-tabs button { flex:1 1 0; justify-content:center; padding:0 8px; font-size:12px; }
  body.home .home-hero-inner { padding:22px 0 34px; }
  body.home .home-hero h1 { font-size:30px; line-height:1.3; }
  .hero-sub { font-size:14px; margin-bottom:20px; }
  .goal-list { grid-template-columns:1fr; gap:10px; }
  .goal-card { padding:15px; }
  .sim-result { grid-template-columns:1fr 1fr; gap:8px; }
  .sim-result dd { font-size:16px; }
  .sim-result-main dd { font-size:21px; }
  .section { padding:40px 0; }
  .section-heading h2 { font-size:23px; }
}

/* モバイルのドロワー（レガシー定義の色を上書き） */
@media (max-width:1100px) {
  .site-header .nav-links { position:absolute; top:100%; left:0; right:0; z-index:30; flex-direction:column; align-items:stretch; gap:2px; padding:8px; background:var(--ok-surface); border-bottom:1px solid var(--ok-line); box-shadow:0 18px 40px rgba(2,6,23,.45); }
  .site-header.nav-open .nav-links { display:flex; }
  .site-header .nav-links a { display:block; padding:12px 13px; border-radius:9px; font-size:15px; }
}

/* --- 2026-09-03 スキンの取りこぼし修正 ---
   1) ヒーロー背景: 先に入れた html[data-theme="dark"] body.home .home-hero の
      background-image（写真＋暗幕）が詳細度で勝っていたので、同じ詳細度で打ち消す。
      モックにヒーロー写真は無いので、平面のグラデーションだけにする。
   2) .home-hero-inner > div の width:min(470px,92%)（レガシー）が #quick-finder にも
      効いて、目的別カードが470px幅に潰れていた。 */
html[data-theme="dark"] body.home .home-hero,
html[data-theme="light"] body.home .home-hero,
body.home .home-hero {
  background-image:
    radial-gradient(1100px 460px at 78% -10%, rgba(52,211,153,.13), transparent 62%),
    radial-gradient(760px 420px at 8% 8%, rgba(56,189,248,.07), transparent 60%);
  background-color:var(--ok-base);
  background-repeat:no-repeat;
  background-size:auto;
  background-position:0 0;
}
body.home .home-hero-inner > div { width:auto; max-width:none; }
.hero-finder-tabs button { white-space:nowrap; }

@media (max-width:760px) {
  html[data-theme="dark"] body.home .home-hero,
  html[data-theme="light"] body.home .home-hero,
  body.home .home-hero {
    background-image:radial-gradient(700px 380px at 82% -6%, rgba(52,211,153,.14), transparent 62%);
  }
}


/* ===================================================================
   2026-09-03 モックの下半分（FeaturedHighlights / CategoryNavGrid /
   ContentFeed）の造形。寸法はモックの Tailwind クラスから起こしている。
   =================================================================== */

/* --- 共通の見出し（3セクションで同じ形。下に罫線） --- */
.feed-heading { display:flex; flex-direction:column; gap:6px; margin-bottom:24px; padding-bottom:8px; border-bottom:1px solid var(--ok-line); }
.feed-heading > div { min-width:0; }
.feed-heading h2 { margin:2px 0 0; color:var(--ok-text); font-size:22px; font-weight:800; letter-spacing:-.01em; }
.feed-heading > p { margin:0; color:var(--ok-dim); font-size:12px; font-weight:600; }
.feed-heading .eyebrow { display:flex; align-items:center; gap:7px; color:var(--ok-accent); font-size:11px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.feed-heading .eyebrow-amber { color:#f59e0b; }
html[data-theme="light"] .feed-heading .eyebrow-amber { color:#b45309; }
.eyebrow-spark { font-size:12px; line-height:1; }
@media (min-width:761px) {
  .feed-heading { flex-direction:row; align-items:flex-end; justify-content:space-between; gap:20px; }
  .feed-heading h2 { font-size:26px; }
}

/* --- 今週の一押し・必読ガイド：3カラム、16:9のアイキャッチ --- */
.featured-section { padding:44px 0; background:var(--ok-base); }
.featured-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.featured-card { display:flex; }
.featured-card-link { display:flex; flex-direction:column; width:100%; border:1px solid var(--ok-line); border-radius:16px; background:var(--ok-surface); overflow:hidden; transition:border-color .2s ease, box-shadow .2s ease, transform .2s ease; }
.featured-card-link:hover { border-color:var(--ok-line-strong); box-shadow:0 12px 30px rgba(2,6,23,.32); transform:translateY(-2px); }
.featured-thumb { position:relative; display:block; aspect-ratio:16 / 9; overflow:hidden; background:var(--ok-raise); }
.featured-thumb img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .3s ease; }
.featured-card-link:hover .featured-thumb img { transform:scale(1.05); }
.featured-thumb-shade { position:absolute; inset:0; background:linear-gradient(to top, rgba(0,0,0,.62), transparent 58%); }
.featured-badge { position:absolute; top:12px; left:12px; padding:4px 10px; border:1px solid rgba(255,255,255,.22); border-radius:999px; background:rgba(15,23,42,.82); backdrop-filter:blur(3px); color:#fff; font-size:11px; font-weight:800; }
.featured-verified { position:absolute; bottom:10px; left:12px; display:flex; align-items:center; gap:6px; color:rgba(255,255,255,.92); font-size:12px; font-weight:700; }
.featured-verified i { width:8px; height:8px; border-radius:50%; background:var(--ok-accent); }
.featured-body { display:block; padding:18px 20px 0; }
.featured-meta { display:flex; align-items:center; gap:9px; margin-bottom:9px; color:var(--ok-dim); font-size:12px; font-weight:700; font-variant-numeric:tabular-nums; }
.featured-meta em { padding:2px 7px; border-radius:5px; background:rgba(52,211,153,.12); color:var(--ok-accent); font-size:10px; font-style:normal; font-weight:800; }
.featured-card h3 { margin:0 0 9px; color:var(--ok-text); font-size:17px; font-weight:800; line-height:1.5; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.featured-card-link:hover h3 { color:var(--ok-accent); }
.featured-body p { margin:0; color:var(--ok-muted); font-size:12.5px; font-weight:600; line-height:1.75; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.featured-foot { display:flex; align-items:center; justify-content:space-between; margin:14px 20px 18px; padding-top:13px; border-top:1px solid var(--ok-line); color:var(--ok-accent); font-size:12.5px; font-weight:800; }

/* --- カテゴリから探す：3カラム、40pxアイコンタイル＋件数ピル --- */
.category-browse { padding:44px 0; }
.category-browse-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin:0; padding:0; list-style:none; }
.category-browse-card { display:flex; align-items:center; gap:14px; min-height:74px; padding:15px 17px; border:1px solid var(--ok-line); border-radius:14px; background:var(--ok-surface); transition:border-color .18s ease, background .18s ease; }
.category-browse-card:hover { border-color:rgba(52,211,153,.5); background:var(--ok-raise); }
.category-icon { flex:0 0 40px; width:40px; height:40px; display:grid; place-items:center; border-radius:12px; background:var(--ok-raise); border:1px solid var(--ok-line); color:var(--ok-accent); font-size:17px; }
.category-body { flex:1 1 auto; min-width:0; }
.category-body strong { display:block; color:var(--ok-text); font-size:15px; font-weight:800; line-height:1.35; }
.category-body small { display:block; margin-top:2px; color:var(--ok-dim); font-size:11.5px; font-weight:600; }
.category-count { flex:0 0 auto; padding:3px 9px; border-radius:7px; background:var(--ok-raise); border:1px solid var(--ok-line); color:var(--ok-muted); font-size:11px; font-weight:800; font-variant-numeric:tabular-nums; }

/* --- 記事一覧：縦積みの横型カード（サムネ 16:10、幅224/256px） --- */
body.home .latest-section .cards,
body.home .popular-section .cards { display:flex; flex-direction:column; gap:20px; }
body.home .latest-section .post-card,
body.home .popular-section .post-card { min-height:0; padding:0; border-top:0; }
body.home .latest-section .post-card-link,
body.home .popular-section .post-card-link {
  display:grid; grid-template-columns:256px minmax(0,1fr); gap:24px; align-items:start;
  padding:20px; border:1px solid var(--ok-line); border-radius:16px; background:var(--ok-surface);
  transition:border-color .18s ease, box-shadow .18s ease;
}
body.home .latest-section .post-card-link:hover,
body.home .popular-section .post-card-link:hover { border-color:var(--ok-line-strong); box-shadow:0 8px 22px rgba(2,6,23,.28); }
.post-thumb { grid-row:span 8; display:block; aspect-ratio:16 / 10; overflow:hidden; border-radius:12px; background:var(--ok-raise); }
.post-thumb img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .3s ease; }
.post-card-link:hover .post-thumb img { transform:scale(1.05); }
body.home .latest-section .post-card h3,
body.home .popular-section .post-card h3 { margin:6px 0 8px; color:var(--ok-text); font-size:18px; font-weight:800; line-height:1.5; }
body.home .latest-section .post-card-link:hover h3,
body.home .popular-section .post-card-link:hover h3 { color:var(--ok-accent); }

@media (max-width:1100px) {
  .featured-grid { grid-template-columns:repeat(2,1fr); gap:18px; }
  .category-browse-grid { grid-template-columns:repeat(2,1fr); }
  body.home .latest-section .post-card-link,
  body.home .popular-section .post-card-link { grid-template-columns:200px minmax(0,1fr); gap:18px; }
}
@media (max-width:760px) {
  .featured-section, .category-browse { padding:34px 0; }
  .featured-grid { grid-template-columns:1fr; gap:14px; }
  .category-browse-grid { grid-template-columns:1fr; gap:10px; }
  .feed-heading { margin-bottom:18px; }
  .feed-heading h2 { font-size:21px; }
  .featured-body { padding:15px 16px 0; }
  .featured-foot { margin:12px 16px 15px; }
  .featured-card h3 { font-size:16px; }
  /* モックも sm 未満はサムネを上に積む */
  body.home .latest-section .post-card-link,
  body.home .popular-section .post-card-link { grid-template-columns:1fr; gap:13px; padding:14px; }
  .post-thumb { grid-row:auto; }
  body.home .latest-section .post-card h3,
  body.home .popular-section .post-card h3 { font-size:16px; }
}

/* ライト側の面 */
html[data-theme="light"] .featured-card-link:hover { box-shadow:0 12px 26px rgba(24,51,74,.12); }
html[data-theme="light"] .featured-badge { background:rgba(15,23,42,.78); }
html[data-theme="light"] body.home .latest-section .post-card-link:hover,
html[data-theme="light"] body.home .popular-section .post-card-link:hover { box-shadow:0 8px 20px rgba(24,51,74,.10); }

/* --- 2026-09-03(2) セクション順：モックの並びに合わせた最終版 ---
   Header → MarketTicker → Hero → FeaturedHighlights → CategoryNavGrid → ContentFeed
   （モックの App.tsx の描画順そのまま）。以降は既存セクション。
   セクションを足したらここにも必ず追記すること。 */
body.home .quick-nav              { order:1; }
body.home .home-hero              { order:2; }
body.home .featured-section       { order:3; }
body.home .category-browse        { order:4; }
body.home .latest-section         { order:5; }
body.home .popular-section        { order:6; }
body.home .economy-section        { order:7; }
body.home .return-hub             { order:8; }
body.home .priority-section       { order:9; }
body.home .flow-gateway           { order:10; }
body.home .writer-ranking-section { order:11; }
body.home .writers-section        { order:12; }
body.home .office-section         { order:13; }
body.home .section-dark           { order:14; }

/* --- 2026-09-03(3) 記事カードの横型レイアウト修正 ---
   .post-card-link の子要素は「カテゴリ/バッジ/見出し/シグナル/著者」と数が可変で、
   grid にすると1つずつ別の行になる。gap:24px が row-gap にも効いて全要素の間に
   24pxが入り、カードが間延びしていた。row-gap を0にし、サムネは全行にまたがらせ、
   残りは2列目に固定して align-content:start で上詰めにする。 */
body.home .latest-section .post-card-link,
body.home .popular-section .post-card-link {
  grid-template-columns:256px minmax(0,1fr);
  column-gap:24px; row-gap:0; align-content:start; gap:0 24px;
}
body.home .latest-section .post-card-link > *,
body.home .popular-section .post-card-link > * { grid-column:2; }
body.home .latest-section .post-thumb,
body.home .popular-section .post-thumb { grid-column:1; grid-row:1 / -1; align-self:start; }

/* サムネが無い投稿ではカードを1カラムに戻す */
body.home .latest-section .post-card-link:not(:has(.post-thumb)),
body.home .popular-section .post-card-link:not(:has(.post-thumb)) { grid-template-columns:minmax(0,1fr); }
body.home .latest-section .post-card-link:not(:has(.post-thumb)) > *,
body.home .popular-section .post-card-link:not(:has(.post-thumb)) > * { grid-column:1; }

/* カード内の縦の詰め方をモックに合わせる */
body.home .latest-section .post-card .category,
body.home .popular-section .post-card .category { margin-bottom:8px; font-size:11px; }
body.home .latest-section .post-card h3,
body.home .popular-section .post-card h3 { margin:0 0 8px; }
body.home .latest-section .post-card .article-marks,
body.home .popular-section .post-card .article-marks { margin:0 0 8px; }
body.home .latest-section .okaneta-rating-badge,
body.home .popular-section .okaneta-rating-badge { margin-bottom:6px; }
body.home .latest-section .post-writer,
body.home .popular-section .post-writer { margin-top:12px; padding-top:12px; border-top:1px solid var(--ok-line); }

@media (max-width:760px) {
  body.home .latest-section .post-card-link,
  body.home .popular-section .post-card-link { grid-template-columns:minmax(0,1fr); gap:12px 0; }
  body.home .latest-section .post-card-link > *,
  body.home .popular-section .post-card-link > * { grid-column:1; }
  body.home .latest-section .post-thumb,
  body.home .popular-section .post-thumb { grid-column:1; grid-row:auto; margin-bottom:2px; }
}

/* --- 2026-09-03(4) 記事カード: 行が引き伸ばされる件 ---
   サムネに grid-row:1/-1 を与えると、サムネの高さ(160px)を満たすように
   右カラムの各行が引き伸ばされ、「クレカ」と「判定A」の間に大きな空きが出ていた。
   grid-auto-rows:min-content で行の伸長を止める。 */
body.home .latest-section .post-card-link,
body.home .popular-section .post-card-link { grid-auto-rows:min-content; align-items:start; }

/* --- 2026-09-03(5) 記事カード: サムネの行スパン ---
   grid-row:1/-1 は「明示グリッドの最終ライン」を指す。ここは grid-template-rows を
   書いていない＝暗黙グリッドなので -1 が1行目を指し、サムネが1行目だけを占有して
   1行目が160pxに膨らんでいた（実測 gridTemplateRows: 160px 31px 32px …）。
   明示的に十分な行数をまたがせる。 */
body.home .latest-section .post-thumb,
body.home .popular-section .post-thumb { grid-row:1 / span 20; }
@media (max-width:760px) {
  body.home .latest-section .post-thumb,
  body.home .popular-section .post-thumb { grid-row:auto; }
}


/* ===================================================================
   2026-09-03 記事一覧のタブ／フッター／モバイル固定ナビ
   （モックの ContentFeed タブ・Footer・MobileBottomNav の造形）
   =================================================================== */

/* --- 記事一覧のタブ --- */
.feed-heading-tabs { align-items:center; }
.feed-tabs { display:flex; align-items:center; gap:4px; padding:4px; border:1px solid var(--ok-line); border-radius:12px; background:var(--ok-surface); overflow-x:auto; max-width:100%; }
.feed-tabs button { flex:0 0 auto; padding:7px 13px; border:0; border-radius:9px; background:transparent; color:var(--ok-muted); font:inherit; font-size:12.5px; font-weight:800; white-space:nowrap; cursor:pointer; transition:background .16s ease, color .16s ease; }
.feed-tabs button:hover { color:var(--ok-text); }
.feed-tabs button[aria-selected="true"] { background:var(--ok-raise); color:var(--ok-text); box-shadow:0 1px 2px rgba(2,6,23,.4); }
.feed-tabs button:focus-visible { outline:2px solid var(--ok-accent); outline-offset:2px; }
html[data-theme="light"] .feed-tabs button[aria-selected="true"] { background:#fff; box-shadow:0 1px 2px rgba(24,51,74,.12); }
.feed-panel-note { margin:0 0 16px; color:var(--ok-dim); font-size:12px; font-weight:700; }
.feed-all { display:inline-flex; align-items:center; gap:8px; margin-top:22px; padding:11px 18px; border:1px solid var(--ok-line); border-radius:11px; background:var(--ok-surface); color:var(--ok-accent); font-size:13px; font-weight:800; }
.feed-all:hover { border-color:var(--ok-accent); background:var(--ok-raise); }

/* --- フッター --- */
.site-footer { padding:48px 0 48px; border-top:1px solid var(--ok-line); background:#010409; color:var(--ok-muted); font-size:12.5px; }
html[data-theme="light"] .site-footer { background:#0b1220; }
.footer-grid { display:grid; grid-template-columns:1.4fr 1fr 1fr 1.3fr; gap:32px; margin-bottom:36px; }
.footer-brand .brand { display:flex; align-items:center; gap:10px; margin-bottom:12px; }
.footer-brand .brand-mark { width:32px; height:32px; border-radius:11px; font-size:17px; }
.footer-brand .brand-name { color:#fff; font-size:19px; }
.footer-brand .brand-tld { color:#64748b; }
.footer-brand > p { margin:0 0 16px; color:#94a3b8; font-size:12px; font-weight:600; line-height:1.8; }
.footer-editor { display:flex; align-items:center; gap:11px; max-width:300px; padding:11px 13px; border:1px solid rgba(148,163,184,.18); border-radius:12px; background:rgba(15,23,42,.7); }
.footer-editor-photo { flex:0 0 40px; width:40px; height:40px; border-radius:50%; background:#0f172a url("assets/iluma-profile.jpg") center/cover no-repeat; }
.footer-editor strong { display:block; color:#e2e8f0; font-size:12.5px; }
.footer-editor a { display:inline-block; margin-top:3px; color:var(--ok-accent); font-size:11.5px; font-weight:800; }
.footer-col > strong { display:block; margin-bottom:13px; color:#e2e8f0; font-size:11px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.footer-col ul { margin:0; padding:0; list-style:none; display:grid; gap:9px; }
.footer-col a { color:#94a3b8; font-size:12.5px; font-weight:600; }
.footer-col a:hover { color:var(--ok-accent); }
.footer-col .footer-flow { color:var(--ok-accent); font-weight:800; }
.footer-terms { display:flex; flex-wrap:wrap; gap:7px; }
.footer-terms a { padding:4px 10px; border:1px solid rgba(148,163,184,.16); border-radius:999px; background:rgba(15,23,42,.6); color:#94a3b8; font-size:11.5px; font-weight:700; }
.footer-terms a:hover { border-color:var(--ok-accent); color:var(--ok-accent); }
.footer-base { padding-top:22px; border-top:1px solid rgba(148,163,184,.14); }
.footer-disclaimer { margin:0 0 12px; color:#64748b; font-size:11px; font-weight:600; line-height:1.85; }
.footer-copy { margin:0; color:#64748b; font-size:11px; font-weight:700; }

/* --- モバイル固定ナビ（760px以下だけ） --- */
.mobile-nav { display:none; }
.search-sheet[hidden] { display:none; }
@media (max-width:760px) {
  .mobile-nav {
    position:fixed; left:0; right:0; bottom:0; z-index:60;
    display:flex; align-items:center; justify-content:space-around;
    padding:6px 8px calc(6px + env(safe-area-inset-bottom));
    border-top:1px solid var(--ok-line);
    background:color-mix(in srgb, var(--ok-surface) 94%, transparent);
    backdrop-filter:blur(12px);
    box-shadow:0 -6px 20px rgba(2,6,23,.38);
  }
  .mobile-nav-item { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; min-width:56px; min-height:46px; padding:0; border:0; background:transparent; color:var(--ok-muted); font:inherit; font-size:10px; font-weight:800; cursor:pointer; }
  .mobile-nav-item:hover, .mobile-nav-item:focus-visible { color:var(--ok-accent); }
  .mobile-nav-icon { font-size:17px; line-height:1; }
  .mobile-nav-fab { display:grid; place-items:center; width:38px; height:38px; margin-top:-18px; border:2px solid var(--ok-base); border-radius:50%; background:linear-gradient(140deg,var(--ok-accent),var(--ok-accent-deep)); color:#03130d; font-size:18px; line-height:1; box-shadow:0 6px 16px rgba(5,150,105,.4); }
  .mobile-nav-search { color:var(--ok-accent); }
  /* 固定ナビのぶん、本文の下に余白を作る */
  .site-footer { padding-bottom:96px; }

  .search-sheet { position:fixed; inset:0; z-index:70; display:flex; align-items:flex-end; background:rgba(2,6,23,.72); backdrop-filter:blur(3px); }
  .search-sheet-panel { width:100%; padding:18px 16px calc(18px + env(safe-area-inset-bottom)); border-radius:18px 18px 0 0; background:var(--ok-surface); border-top:1px solid var(--ok-line); }
  .search-sheet form { display:flex; gap:8px; }
  .search-sheet input { flex:1 1 auto; min-width:0; height:46px; padding:0 14px; border:1px solid var(--ok-line); border-radius:11px; background:var(--ok-base); color:var(--ok-text); font:inherit; font-size:15px; }
  .search-sheet input:focus { outline:none; border-color:var(--ok-accent); }
  .search-sheet form button { flex:0 0 auto; height:46px; padding:0 18px; border:0; border-radius:11px; background:var(--ok-accent); color:#03130d; font:inherit; font-size:14px; font-weight:800; }
  .search-sheet-close { display:block; width:100%; margin-top:10px; padding:11px; border:0; border-radius:11px; background:transparent; color:var(--ok-muted); font:inherit; font-size:13px; font-weight:800; }
}

@media (max-width:1100px) {
  .footer-grid { grid-template-columns:1fr 1fr; gap:26px; }
  .footer-col-terms { grid-column:1 / -1; }
}
@media (max-width:760px) {
  .site-footer { padding-top:34px; }
  .footer-grid { grid-template-columns:1fr; gap:24px; margin-bottom:26px; }
  .footer-editor { max-width:100%; }
  .feed-heading-tabs { align-items:stretch; }
  .feed-tabs { margin-top:4px; }
  .feed-all { width:100%; justify-content:center; }
}

/* --- 2026-09-03(6) 仕上げ ---
   1) ダーク: フッターの注意書きと著作権表示が #64748b で 4.24:1（AA未達）だったので上げる
   2) ライト: 新パーツ（カテゴリカード／記事カード／今週の一押し／タブ）の面と文字を
      data-theme="light" で明示する。var(--ok-*) 経由だけだと、上に積んだ世代の
      ルールとの兼ね合いでカードだけ暗いままになる場合があった（実測で確認）。 */
html[data-theme="dark"] .footer-disclaimer,
html[data-theme="dark"] .footer-copy { color:#8b9cb3; }

html[data-theme="light"] .category-browse-card,
html[data-theme="light"] .featured-card-link,
html[data-theme="light"] body.home .latest-section .post-card-link,
html[data-theme="light"] .feed-tabs,
html[data-theme="light"] .feed-all,
html[data-theme="light"] .hero-badge,
html[data-theme="light"] .hero-finder-tabs { background:#ffffff; border-color:rgba(24,51,74,.14); }
html[data-theme="light"] .category-icon,
html[data-theme="light"] .category-count,
html[data-theme="light"] .goal-icon { background:#f2f7f5; border-color:rgba(24,51,74,.12); }
html[data-theme="light"] .category-body strong,
html[data-theme="light"] .featured-card h3,
html[data-theme="light"] body.home .latest-section .post-card h3,
html[data-theme="light"] .feed-heading h2 { color:#0f2233; }
html[data-theme="light"] .category-body small,
html[data-theme="light"] .featured-body p,
html[data-theme="light"] .feed-panel-note { color:#5b7180; }
html[data-theme="light"] .category-count { color:#5b7180; }
html[data-theme="light"] .category-icon { color:#0f9d6e; }
html[data-theme="light"] .feed-tabs button { color:#5b7180; }
html[data-theme="light"] .feed-tabs button[aria-selected="true"] { background:#eef5f2; color:#0f2233; }
html[data-theme="light"] .featured-meta { color:#6b8190; }
html[data-theme="light"] .featured-foot { color:#0b7f59; border-top-color:rgba(24,51,74,.12); }

/* --- 2026-09-03 確認体制セクション（E-E-A-T） --- */
.trust-section { padding:44px 0; background:var(--ok-base); }
.trust-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.trust-card { padding:22px; border:1px solid var(--ok-line); border-radius:14px; background:var(--ok-surface); }
.trust-card h3 { display:flex; align-items:center; gap:10px; margin:0 0 11px; color:var(--ok-text); font-size:16px; font-weight:800; line-height:1.5; }
.trust-num { flex:0 0 26px; width:26px; height:26px; display:grid; place-items:center; border-radius:8px; background:rgba(52,211,153,.14); color:var(--ok-accent); font-size:13px; font-weight:900; }
.trust-card p { margin:0 0 13px; color:var(--ok-muted); font-size:13px; font-weight:600; line-height:1.85; }
.trust-card p strong { color:var(--ok-text); font-weight:800; }
.trust-card > a { display:inline-flex; align-items:center; gap:6px; color:var(--ok-accent); font-size:12.5px; font-weight:800; }
.trust-note { margin:20px 0 0; padding:15px 17px; border:1px solid var(--ok-line); border-radius:12px; background:var(--ok-raise); color:var(--ok-dim); font-size:11.5px; font-weight:600; line-height:1.9; }
.trust-note strong { color:var(--ok-muted); font-weight:800; }
.trust-note a { color:var(--ok-accent); font-weight:800; text-decoration:underline; text-underline-offset:2px; }
.hero-kicker { margin:0 0 10px; color:var(--ok-muted); font-size:14px; font-weight:700; }

html[data-theme="light"] .trust-card { background:#ffffff; border-color:rgba(24,51,74,.14); }
html[data-theme="light"] .trust-card h3 { color:#0f2233; }
html[data-theme="light"] .trust-card p { color:#5b7180; }

@media (max-width:1100px) { .trust-grid { grid-template-columns:1fr; } }
@media (max-width:760px) {
  .trust-section { padding:34px 0; }
  .trust-card { padding:17px; }
  .trust-card h3 { font-size:15px; }
  .hero-kicker { font-size:13px; margin-bottom:8px; }
}

/* --- トップのセクション順（確認体制を追加。オフィスは削除済み） --- */
body.home .trust-section { order:3; }
body.home .featured-section { order:4; }
body.home .category-browse { order:5; }
body.home .latest-section { order:6; }
body.home .economy-section { order:7; }
body.home .return-hub { order:8; }
body.home .priority-section { order:9; }
body.home .flow-gateway { order:10; }
body.home .writer-ranking-section { order:11; }
body.home .writers-section { order:12; }
body.home .section-dark { order:13; }

/* 確認体制カード: 見出しテキストに番号が混ざらないよう、番号は h3 の外に出した */
.trust-head { display:flex; align-items:center; gap:10px; margin-bottom:11px; }
.trust-head h3 { margin:0; color:var(--ok-text); font-size:16px; font-weight:800; line-height:1.5; }
html[data-theme="light"] .trust-head h3 { color:#0f2233; }
@media (max-width:760px) { .trust-head h3 { font-size:15px; } }

/* ===== 2026-09-04 ライトを既定にしたことによるコントラスト調整 =====
   既定がダークだった間は #0f9d6e で足りていたが、白地では 3.2〜3.3:1 しかなく
   本文サイズの AA(4.5:1) に届かない。文字・アイコン用のアクセントを一段暗くする。
   ただし「アクセントを背景に敷いて、その上に暗い文字を置いている」箇所
   （ロゴマーク／ヒーローのタブ／モバイルのFAB）は暗くすると文字が沈むので、
   そこだけ明るい緑のまま据え置く。 */
html[data-theme="light"] {
  --ok-accent:#0a7350;
  --ok-accent-2:#0f9d6e;
  --ok-accent-deep:#085f42;
}
html[data-theme="light"] .brand-mark,
html[data-theme="light"] .hero-finder-tabs button[aria-selected="true"],
html[data-theme="light"] .mobile-nav-fab {
  background:linear-gradient(140deg,#10b981,#059669); color:#03251a;
}
html[data-theme="light"] .search-sheet form button { background:#0a7350; color:#ffffff; }

/* H1の2行目。ダークでは emerald→ライムのグラデが映えるが、白地では終端の
   #d9f99d がほぼ読めない。ライトでは暗い緑の中で振る。 */
html[data-theme="light"] .hero-accent {
  background:linear-gradient(96deg,#0a7350 0%, #0f9d6e 55%, #3f8f3a 100%);
  -webkit-background-clip:text; background-clip:text; color:#0a7350;
}

/* 旧世代のコーラル系 eyebrow。クリーム地で 2.8〜2.95:1 だった箇所を暗くする。 */
html[data-theme="light"] .today-pulse-label,
html[data-theme="light"] .return-digest-kicker,
html[data-theme="light"] .post-card .category,
html[data-theme="light"] .quick-nav span,
html[data-theme="light"] .priority-card .category,
html[data-theme="light"] .article-writer small,
html[data-theme="light"] .post-card-writer small { color:#a8412a; }
html[data-theme="light"] .category-browse-card .category-count { color:#4a6470; }

/* --- 2026-09-04 ライト既定の詰め ---
   1) フッターはライトでも地が暗色(#0b1220)。アクセントを白地用に暗くしたせいで
      フッター内のリンクが 3.0〜3.2:1 に落ちたので、フッター内だけ明るい緑に戻す。
   2) --ok-dim(#6b8190) が白地で 3.75〜3.93:1 と AA にわずかに届かないので一段暗く。 */
html[data-theme="light"] .site-footer { --ok-accent:#34d399; --ok-accent-2:#6ee7b7; --ok-dim:#94a3b8; }
html[data-theme="light"] .site-footer .footer-editor a,
html[data-theme="light"] .site-footer .footer-flow,
html[data-theme="light"] .site-footer .footer-col a:hover,
html[data-theme="light"] .site-footer .footer-terms a:hover { color:#34d399; }
html[data-theme="light"] .site-footer .footer-disclaimer,
html[data-theme="light"] .site-footer .footer-copy { color:#94a3b8; }

html[data-theme="light"] { --ok-dim:#55697a; }
html[data-theme="light"] .category-icon { color:#0a6448; }

/* --- 2026-09-04 ライト既定の仕上げ --- */
/* 1) 「今週の一押し」の確認日は画像の上に白文字で乗る。明るい写真だと沈むので
      下端のグラデを強め、影を足す（写真の明暗に依存しない可読性にする）。 */
.featured-thumb-shade { background:linear-gradient(to top, rgba(0,0,0,.78) 0%, rgba(0,0,0,.45) 26%, transparent 52%); }
.featured-verified { text-shadow:0 1px 3px rgba(0,0,0,.7); }

/* 2) 白地でAAにわずかに届かなかったミュート系をもう一段暗く */
html[data-theme="light"] { --ok-dim:#4d6070; }
html[data-theme="light"] .economy-card-kicker,
html[data-theme="light"] .service-choice-card span,
html[data-theme="light"] .featured-meta,
html[data-theme="light"] .post-card-dates,
html[data-theme="light"] .return-reading-tabs button { color:#4d6070; }

/* 3) 1100〜1360px でヘッダーのナビが2行に折り返していたので折り返さない */
.nav-links a { white-space:nowrap; }
@media (min-width:1101px) and (max-width:1360px) {
  .nav-links { gap:2px; }
  .nav-links a { padding:8px 8px; font-size:13px; }
  .nav-search input { width:190px; }
}

/* 「前回の続きから」の履歴カード内のコーラル小文字（白地で2.9:1）を暗くする */
html[data-theme="light"] .return-reading-list small,
html[data-theme="light"] .return-reading-list em { color:#a8412a; }