/*
Theme Name: Okaneta
Description: Evidence-first smart-living news theme.
Version: 0.2.0
Text Domain: tokuhaya
*/
: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; }
.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.png"); 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(5,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; }
.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; }
.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 a:not(:last-child) { 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; }.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.png") 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; min-height:390px; align-items:end; background-position:58% center; } body.home .home-hero::before { content:""; position:absolute; inset:0; z-index:0; background:rgba(255,253,247,.32); } body.home .home-hero-inner { position:relative; z-index:1; padding:20px 0; } body.home .home-hero-inner > div { width:100%; } body.home .home-hero h1 { font-size:36px; } body.home .home-hero-role { max-width:285px; color:#18334a; font-size:13px; text-shadow:0 0 8px rgba(255,253,247,.9); }.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; }
@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 .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 .latest-section { order:3; }
body.home .priority-section { order:4; }
body.home .economy-section { order:5; }
body.home .money-compass { order:6; }
body.home .popular-section { order:7; }
body.home .writer-ranking-section { order:8; }
body.home .writers-section { order:9; }
body.home .office-section { order:10; }
body.home .section-dark { order:11; }
.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 .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; }
@media (max-width:760px) {
  .article table { display:block; overflow-x:auto; -webkit-overflow-scrolling:touch; font-size:14px; }
  .article table th,.article table td { min-width:118px; padding:12px; }
  .article .campaign-tool table { display:table; }
  .article .campaign-tool table th,.article .campaign-tool table td { min-width:0; padding:10px; }
  .article .economy-decision-table th,.article .economy-decision-table td { min-width:148px; }
  .article .economy-result-table th,.article .economy-result-table td { min-width:132px; }
  .article h1 { font-size:26px; line-height:1.4; letter-spacing:0; }
}

/* 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; }