*,:before,:after{box-sizing:border-box}img,video,svg{max-width:100%;height:auto;display:block}button,input,select,textarea{font:inherit;color:inherit}:root{--bg:#faf9f5;--bg-surface:#fff;--bg-muted:#e8f5ed;--bg-deep:#1a3a28;--cat-tech:#2d6748;--cat-movie:#8b5a2b;--cat-book:#4a7c59;--cat-food:#c9a227;--cat-daily:#6b5b73;--cat-sake:#8b3a62;--cat-sports:#4a90a4;--cat-short:#a0785a;--cat-other:#5a6b5a;--text:#1a2e22;--text-sub:#3d5a47;--text-muted:#7a9d88;--accent:#2d6748;--accent-hover:#3d8a5e;--accent-dark:#1a3a28;--border:#c5d9cc;--border-accent:#7a9d88;--shadow:#1a3a281f;--shadow-hover:#1a3a282e;--font-heading:"Noto Sans JP", -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;--font-base:"Noto Sans JP", -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif}:root.dark{--bg:#0d1f14;--bg-surface:#1a3024;--bg-muted:#132b1c;--bg-deep:#0a1810;--text:#e8f2ec;--text-sub:#d0e4d8;--text-muted:#a8c4b2;--accent:#3d7a58;--accent-hover:#4a9d6f;--accent-dark:#2d5a42;--border:#2d4a38;--border-accent:#4d6a57;--shadow:#0000004d;--shadow-hover:#00000080;--cat-tech:#6bb38a;--cat-movie:#d0a070;--cat-book:#95c4a1;--cat-food:#f5d56b;--cat-daily:#b8a9c2;--cat-sake:#d68fa8;--cat-sports:#8fc4d5;--cat-short:#d5b298;--cat-other:#a0b0a0}html,body{overflow-x:clip}html{height:100%}@font-face{font-family:Atkinson;src:url(/fonts/atkinson-regular.woff)format("woff");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Atkinson;src:url(/fonts/atkinson-bold.woff)format("woff");font-weight:700;font-style:normal;font-display:swap}body{font-family:var(--font-base);text-align:left;background-color:var(--bg);word-wrap:break-word;overflow-wrap:break-word;color:var(--text);font-feature-settings:"palt";-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;flex-direction:column;min-height:100vh;margin:0;padding:0;font-size:16px;line-height:1.8;display:flex;position:relative}main{flex:1 0 auto;max-width:calc(100% - 2em);margin:auto;padding:3em 1em}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);color:var(--text);letter-spacing:.02em;margin:0 0 .5rem;line-height:1.3}h1{margin:0 0 1rem;font-size:2.5em;font-weight:600}h2{margin:2rem 0 1rem;font-size:2em;font-weight:600}h3{margin:1.5rem 0 .75rem;font-size:1.5em;font-weight:600}h4{margin:1rem 0 .5rem;font-size:1.25em;font-weight:600}h5{font-size:1.1em;font-weight:600}strong,b{font-weight:700}.article-body{color:var(--text);max-width:none;font-size:1rem;line-height:1.75}.article-body h1,.article-body h2,.article-body h3,.article-body h4{font-family:var(--font-heading);color:var(--text)}.article-body h1{font-size:2.25em}.article-body h2{font-size:1.5em}.article-body h3{font-size:1.25em}@media (width<=720px){.article-body h1{font-size:1.5em}}.article-body strong,.article-body b{color:var(--text)}.article-body a{color:var(--accent);text-decoration:none}.article-body a:hover{color:var(--accent-hover)}.article-body li{color:var(--text)}.article-body ul>li::marker,.article-body ol>li::marker{color:var(--text-sub)}.article-body table{border:none;margin:0}.article-body thead{border:none}.article-body thead th{color:var(--text);border:none;padding:0}.article-body tbody tr{border:none}.article-body tbody td{color:var(--text);border:none;padding:0}.article-body blockquote{border-left:4px solid var(--border);color:var(--text-sub);padding-left:1em;font-style:italic}:root.dark .article-body,:root.dark .article-body p,:root.dark .article-body li,:root.dark .article-body td,:root.dark .article-body th{color:#e8f0eb}a{color:var(--accent);text-decoration:none;transition:color .2s}a:hover{color:var(--accent-hover);text-decoration:underline}p{margin-bottom:1em}p:last-child{margin-bottom:0}.article-body p{margin-bottom:2em}.article-body p:last-child{margin-bottom:0}textarea{width:100%;font-size:16px}input{font-size:16px}table{width:100%}img{border-radius:16px;max-width:100%;height:auto}code{background-color:var(--bg-muted);border:none;border-radius:6px;padding:.2em .5em;font-family:Consolas,Monaco,Courier New,monospace;font-size:.9em}:root.dark code{background-color:var(--bg-surface);color:var(--accent-hover);border:none}pre{background-color:var(--bg-deep);box-shadow:0 4px 16px var(--shadow);color:#c8e8d4;border:none;border-radius:16px;padding:1.5em;font-size:.9em;line-height:1.5;overflow-x:auto}:root.dark pre{background-color:var(--bg-deep)}pre>code{all:unset;color:inherit;background:0 0!important;border:none!important}blockquote{border-left:4px solid var(--accent-hover);color:var(--text-sub);background-color:var(--bg-muted);border-radius:0 16px 16px 0;margin:1.5em 0;padding:1em 1.5em;font-style:italic}hr{border:none;border-top:1px solid var(--border)}@media (width<=720px){body{font-size:15px}main{padding:1em}h1,h2{font-size:1.5em}}.fade-in-element{opacity:0;transition:opacity .5s,transform .5s;transform:translateY(20px)}@media (prefers-reduced-motion:reduce){.fade-in-element{opacity:1;transition:none;transform:none}}.fade-in-element.is-visible{opacity:1;transform:translateY(0)}.fade-in-element:first-child{transition-delay:0s}.fade-in-element:nth-child(2){transition-delay:50ms}.fade-in-element:nth-child(3){transition-delay:.1s}.fade-in-element:nth-child(4){transition-delay:.15s}.fade-in-element:nth-child(5){transition-delay:.2s}.fade-in-element:nth-child(6){transition-delay:.25s}.fade-in-element:nth-child(7){transition-delay:.3s}.fade-in-element:nth-child(8){transition-delay:.35s}.fade-in-element:nth-child(9){transition-delay:.4s}.fade-in-element:nth-child(n+10){transition-delay:.45s}:root.dark .article-body,:root.dark .article-body p,:root.dark .article-body li,:root.dark .article-body td,:root.dark .article-body th,:root.dark .article-body span{color:#e8f2ec!important}:root.dark .article-body h1,:root.dark .article-body h2,:root.dark .article-body h3,:root.dark .article-body h4,:root.dark .article-body h5,:root.dark .article-body h6{color:#f5fbf8!important}:root.dark .article-body strong,:root.dark .article-body b{color:#f0f8f5!important}:root.dark svg[id^=mermaid]{fill:#e8f2ec!important}:root.dark svg[id^=mermaid] .label,:root.dark svg[id^=mermaid] .label text,:root.dark svg[id^=mermaid] .label span,:root.dark svg[id^=mermaid] .cluster-label text,:root.dark svg[id^=mermaid] .cluster-label span,:root.dark svg[id^=mermaid] text,:root.dark svg[id^=mermaid] .nodeLabel,:root.dark svg[id^=mermaid] .edgeLabel,:root.dark svg[id^=mermaid] .edgeLabel span,:root.dark svg[id^=mermaid] p{fill:#e8f2ec!important;color:#e8f2ec!important;background-color:#0000!important}:root.dark svg[id^=mermaid] .edgeLabel,:root.dark svg[id^=mermaid] .edgeLabel span,:root.dark svg[id^=mermaid] .edgeLabel p,:root.dark svg[id^=mermaid] .labelBkg,:root.dark svg[id^=mermaid] g.label,:root.dark svg[id^=mermaid] .nodeLabel,:root.dark svg[id^=mermaid] .nodeLabel span,:root.dark svg[id^=mermaid] .nodeLabel p,:root.dark svg[id^=mermaid] foreignObject span,:root.dark svg[id^=mermaid] foreignObject p,:root.dark svg[id^=mermaid] foreignObject div{background:0 0!important}:root.dark svg[id^=mermaid] .node rect,:root.dark svg[id^=mermaid] .node circle,:root.dark svg[id^=mermaid] .node ellipse,:root.dark svg[id^=mermaid] .node polygon,:root.dark svg[id^=mermaid] .node path{fill:#1a3024!important;stroke:#4a9d6f!important}:root.dark svg[id^=mermaid] .edgePath path,:root.dark svg[id^=mermaid] .flowchart-link{stroke:#6bb38a!important}:root.dark svg[id^=mermaid] .marker,:root.dark svg[id^=mermaid] .marker path{fill:#6bb38a!important;stroke:#6bb38a!important}:root.dark svg[id^=mermaid] .actor,:root.dark svg[id^=mermaid] .actor-box{fill:#1a3024!important;stroke:#4a9d6f!important}:root.dark svg[id^=mermaid] .actor-line{stroke:#4a9d6f!important}:root.dark svg[id^=mermaid] .messageLine0,:root.dark svg[id^=mermaid] .messageLine1{stroke:#6bb38a!important}:root.dark svg[id^=mermaid] .messageText,:root.dark svg[id^=mermaid] text.actor tspan,:root.dark svg[id^=mermaid] .actor-box tspan,:root.dark svg[id^=mermaid] tspan{fill:#e8f2ec!important}:root.dark svg[id^=mermaid] .classBox{fill:#1a3024!important;stroke:#4a9d6f!important}:root.dark svg[id^=mermaid] .classLabel .box{fill:#132b1c!important;stroke:#4a9d6f!important}:root.dark svg[id^=mermaid] .classLabel .label{fill:#e8f2ec!important}:root.dark svg[id^=mermaid] .relation{stroke:#6bb38a!important}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.card-base{background-color:var(--bg-surface);box-shadow:0 2px 12px var(--shadow);border:none;border-radius:20px}.card-hover{transition:all .2s}.card-hover:hover{box-shadow:0 8px 24px var(--shadow-hover);transform:translateY(-4px)}.page-main{max-width:1000px;margin:0 auto;padding:2rem 1rem}@media (width>=768px){.page-main{padding:4rem 2rem}}.page-main-with-sidebar{max-width:1200px;margin:0 auto;padding:1.5rem 1rem}@media (width>=768px){.page-main-with-sidebar{padding:2rem 1rem}}.content-with-sidebar{flex-direction:column;gap:2rem;display:flex}@media (width>=1024px){.content-with-sidebar{grid-template-columns:1fr 300px;gap:2rem;display:grid}}.main-content{min-width:0}.sidebar-wrapper{display:none}@media (width>=1024px){.sidebar-wrapper{align-self:start;display:block;position:sticky;top:88px}}.page-header{text-align:center;margin-bottom:2rem}@media (width>=768px){.page-header{margin-bottom:3rem}}.page-title{font-family:var(--font-heading);color:var(--text);letter-spacing:.05em;margin-bottom:.75rem;font-size:1.875rem;font-weight:600}@media (width>=768px){.page-title{font-size:2.25rem}}.page-description{color:var(--text-sub);line-height:1.6}.article-list{flex-direction:column;gap:1rem;display:flex}.article-card{margin-bottom:0}.article-link{background-color:var(--bg-surface);color:inherit;box-shadow:0 2px 12px var(--shadow);border:none;border-radius:20px;flex-direction:column;gap:1rem;padding:1rem;text-decoration:none;transition:transform .25s cubic-bezier(.4,0,.2,1),box-shadow .25s cubic-bezier(.4,0,.2,1);display:flex;position:relative}.article-link:after{content:"";border:1.5px solid var(--accent);opacity:0;pointer-events:none;border-radius:20px;transition:opacity .3s;position:absolute;inset:0}.article-link:hover{box-shadow:0 2px 6px #1a3a2814, 0 14px 32px var(--shadow-hover);transform:translateY(-4px)scale(1.005)}.article-link:hover:after{opacity:1}@media (width>=768px){.article-link{flex-direction:row;gap:1.5rem;min-height:180px}}.article-image-wrapper{aspect-ratio:16/9;border:1px solid var(--border);border-radius:14px;flex-shrink:0;width:100%;position:relative;overflow:hidden}@media (width>=768px){.article-image-wrapper{width:240px}}:global(:root.dark) .article-image-wrapper{border-color:var(--border-accent)}.article-image{object-fit:contain;background-color:var(--bg-muted);width:100%;height:100%}:global(:root.dark) .article-image{background-color:var(--bg-deep)}.article-content{flex-direction:column;flex:1;justify-content:center;min-height:0;display:flex}.article-meta-top{color:var(--text-muted);flex-wrap:wrap;align-items:center;gap:.625rem;margin-bottom:.375rem;font-size:.75rem;display:flex}.article-views,.article-reading-time{align-items:center;gap:.25rem;display:inline-flex}.article-views svg,.article-reading-time svg{transform-origin:50%;transition:transform .3s}.article-link:hover .article-views svg,.article-link:hover .article-reading-time svg{transform:rotate(10deg)scale(1.15)}.article-title{font-family:var(--font-heading);color:var(--text);-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:0 0 .5rem;font-size:1.125rem;font-weight:600;line-height:1.4;transition:color .2s;display:-webkit-box;overflow:hidden}.article-link:hover .article-title{color:var(--accent)}@media (width>=768px){.article-title{margin-bottom:.75rem;font-size:1.25rem}}.article-description{color:var(--text-sub);-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:.5rem 0;font-size:.875rem;line-height:1.6;display:-webkit-box;overflow:hidden}@media (width>=768px){.article-description{font-size:.9rem}}.article-date{color:var(--text-muted);margin:0;font-size:.75rem}@media (width>=768px){.article-date{font-size:.8rem}}.article-meta-row{flex-wrap:wrap;align-items:center;gap:.5rem;margin-top:.5rem;display:flex}.article-categories{flex-wrap:wrap;gap:.3rem;display:flex}.article-category{background-color:color-mix(in srgb, var(--cat-color,var(--accent)) 12%, transparent);border:1px solid color-mix(in srgb, var(--cat-color,var(--accent)) 30%, transparent);color:var(--cat-color,var(--accent));border-radius:20px;padding:.2rem .6rem;font-size:.7rem;font-weight:600;display:inline-block}.article-tags{flex-wrap:wrap;gap:.3rem;display:flex}.article-tag{background-color:var(--bg-muted);border:1px solid var(--border);color:var(--text-muted);border-radius:20px;padding:.15rem .5rem;font-size:.65rem;font-weight:500;transition:all .2s;display:inline-block}.article-tag:hover{background-color:var(--accent);color:#fff;border-color:var(--accent)}.clickable-tag{cursor:pointer}.pagination{justify-content:center;align-items:center;gap:.5rem;margin-top:3rem;display:flex}.pagination-btn{background-color:var(--bg-surface);color:var(--text-sub);border:1px solid var(--border);box-shadow:0 2px 8px var(--shadow);font-family:var(--font-heading);border-radius:12px;padding:.5rem 1rem;font-size:.875rem;font-weight:500;text-decoration:none;transition:all .2s}.pagination-btn:hover:not(.pagination-btn-disabled){background-color:var(--bg-muted);border-color:var(--accent);color:var(--accent);box-shadow:0 4px 12px var(--shadow);transform:translateY(-1px)}.pagination-btn-disabled{background-color:var(--bg-muted);color:var(--text-muted);cursor:not-allowed;box-shadow:none}.pagination-numbers{gap:.5rem;display:flex}.pagination-num{background-color:var(--bg-surface);color:var(--text-sub);border:1px solid var(--border);box-shadow:0 2px 8px var(--shadow);font-family:var(--font-heading);border-radius:12px;padding:.5rem 1rem;font-size:.875rem;font-weight:500;text-decoration:none;transition:all .2s}.pagination-num:hover:not(.pagination-num-active){background-color:var(--bg-muted);border-color:var(--accent);color:var(--accent);box-shadow:0 4px 12px var(--shadow);transform:translateY(-1px)}.pagination-num-active{background-color:var(--accent);color:#fff;border-color:var(--accent);font-weight:700}.pagination-ellipsis{color:var(--text-muted);padding:0 .5rem}.section-separator{justify-content:center;align-items:center;gap:1rem;margin:2rem 0;display:flex}@media (width>=768px){.section-separator{margin:2.5rem 0}}.separator-line{background:linear-gradient(to right, transparent, var(--border-accent), transparent);flex:1;max-width:100px;height:1px}.separator-icon{color:var(--accent);opacity:.7;font-size:.875rem}.nav-links{flex-wrap:wrap;justify-content:space-between;gap:1rem;margin-top:3rem;display:flex}.nav-link{color:var(--accent);font-family:var(--font-heading);text-decoration:none;transition:color .2s}.nav-link:hover{text-decoration:underline}.empty-state{text-align:center;padding:3rem 0}.empty-message{color:var(--text-sub);margin-bottom:1rem}.empty-link{color:var(--accent);text-decoration:none}.empty-link:hover{text-decoration:underline}.article-body a,.menu-link,.nav-link,.empty-link{background-image:linear-gradient(currentColor,currentColor);background-position:0 100%;background-repeat:no-repeat;background-size:0% 1.5px;text-decoration:none;transition:background-size .25s,color .2s}.article-body a:hover,.menu-link:hover,.nav-link:hover,.empty-link:hover{background-size:100% 1.5px;text-decoration:none}@media (prefers-reduced-motion:reduce){.article-body a,.menu-link,.nav-link,.empty-link,.article-views svg,.article-reading-time svg,.article-link:after{transition:none}}.article-body h2,.article-body figure,.article-body img:not(figure img){animation-name:mask-reveal-right;animation-duration:1s;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:view();animation-range:entry}.article-body h2{animation-range:entry cover 50%}.article-body figure,.article-body img:not(figure img){animation-range:entry entry 50%}@keyframes mask-reveal-right{0%{clip-path:inset(0 100% 0 0);opacity:0}to{clip-path:inset(0);opacity:1}}@media (prefers-reduced-motion:reduce){.article-body h2,.article-body figure,.article-body img:not(figure img){animation-name:none}}:where(a,button,[role=button],input,textarea,select,summary,[tabindex]):focus-visible{outline:2px solid var(--accent);outline-offset:2px}.section-header{align-items:center;gap:16px;margin-bottom:32px;display:flex}.section-icon{background:var(--accent);color:#fff;width:48px;height:48px;box-shadow:0 4px 12px var(--shadow);border-radius:16px;justify-content:center;align-items:center;font-size:24px;display:flex}.section-title{color:var(--text);font-size:24px;font-weight:900}.section-title-en{color:var(--text-muted);letter-spacing:.1em;text-transform:uppercase;font-size:11px;font-weight:700}[data-cat=技術]{--cat-color:var(--cat-tech)}[data-cat=映画]{--cat-color:var(--cat-movie)}[data-cat=読書]{--cat-color:var(--cat-book)}[data-cat=グルメ]{--cat-color:var(--cat-food)}[data-cat=日常]{--cat-color:var(--cat-daily)}[data-cat=お酒]{--cat-color:var(--cat-sake)}[data-cat=スポーツ]{--cat-color:var(--cat-sports)}[data-cat=ショート]{--cat-color:var(--cat-short)}[data-cat=その他]{--cat-color:var(--cat-other)}.astro-route-announcer{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;top:0;left:0;overflow:hidden}
