/*
Theme Name: Minaoka Minimal
Description: Small, display-only theme for minaoka.net. Comments policy lives in the Minaoka Comments MU-plugin.
Version: 0.2.0
Requires at least: 5.8
Requires PHP: 7.4
Text Domain: minaoka-minimal
*/

:root{font:15px/1.55 system-ui,-apple-system,"Hiragino Kaku Gothic ProN",Meiryo,sans-serif;color:#222;background:#fff}
*{box-sizing:border-box}
body{margin:0}
a{color:#17548b;text-decoration:none}
a:hover,a:focus-visible{text-decoration:underline}
img{max-width:100%;height:auto}
button,input{font:inherit}
.screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.skip-link{position:absolute;left:-9999px;background:#fff;padding:8px}
.skip-link:focus{left:8px;z-index:10}

.site-header{border-bottom:1px solid #ddd;background:#f7f7f7}
.site-header-inner,.site-nav-inner,.site-main,.site-footer-inner{width:min(100% - 24px,1200px);margin-inline:auto}
.site-header-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0}
.site-title{margin:0;font-size:23px;font-weight:700;letter-spacing:.02em}
.site-title a{color:#222}
.header-description{margin:2px 0 0;color:#666;font-size:12px}
.site-search{display:flex}
.site-search input{width:clamp(160px,30vw,320px);min-height:36px;border:1px solid #aaa;padding:4px 9px}
.site-search button{min-height:36px;border:1px solid #555;background:#333;color:#fff;padding:0 14px;cursor:pointer}

.site-nav{border-top:1px solid #ddd;background:#fff}
.site-nav-inner ul{display:flex;flex-wrap:wrap;gap:14px;list-style:none;margin:0;padding:0}
.site-nav a{display:block;padding:11px 2px;font-size:14px}

.site-main{padding:20px 0 36px}
.content-section{margin-bottom:28px}
.section-title,.archive-title{font-size:19px;margin:0 0 12px;border-bottom:1px solid #bbb;padding-bottom:5px}
.archive-description{color:#666;font-size:13px;margin:-6px 0 12px}
.no-posts{color:#666}

.feature-grid,.post-list,.comment-list,.image-comment-list{list-style:none;margin:0;padding:0}
.feature-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.feature-item{min-width:0}
.feature-thumb{display:block;aspect-ratio:4/3;background:#eee;overflow:hidden}
.feature-thumb img{width:100%;height:100%;object-fit:cover}
.feature-title{font-size:15px;line-height:1.4;margin:5px 0 0;overflow-wrap:anywhere}
.empty-thumb{display:block;width:100%;height:100%;background:#eee}
.entry-meta{color:#666;font-size:12px;margin:3px 0}

.post-list{border-top:1px solid #ddd}
.post-list-item{display:grid;grid-template-columns:72px minmax(0,1fr);align-items:center;gap:10px;min-height:70px;border-bottom:1px solid #ddd;padding:7px 0}
.list-thumb{display:block;width:72px;height:54px;background:#eee}
.list-thumb img{width:100%;height:100%;object-fit:cover}
.list-title{font-size:15px;margin:0;overflow-wrap:anywhere}

.single-post,.page-content,.comments-area{max-width:900px;margin-inline:auto}
.post-title{font-size:clamp(23px,4vw,31px);line-height:1.35;margin:0 0 6px;overflow-wrap:anywhere}
.post-content{font-size:16px;overflow-wrap:anywhere}
.post-content figure{margin:18px 0}
.post-content img{display:block;max-width:100%;height:auto;margin-inline:auto}
.post-navigation,.pagination{display:flex;justify-content:space-between;gap:12px;margin-top:24px}

.comments-area{border-top:1px solid #ddd;margin-top:28px;padding-top:15px}
.comment-list li,.image-comment-list li{border-bottom:1px solid #eee;padding:5px 0}
.comment-time{color:#777;font-size:12px;margin-right:7px}
.comment-form{margin:8px 0 18px}
.comment-controls{display:flex;gap:5px}
.comment-controls input{flex:1;min-width:0;min-height:40px;border:1px solid #aaa;padding:6px 9px}
.comment-submit{width:44px;min-height:40px;border:1px solid #555;background:#333;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center}
.image-comments{max-width:900px;margin:5px auto 16px}
.image-comment-list{font-size:14px;margin:0 0 6px}
.image-comments .comment-form{margin:0}
.minaoka-honeypot{position:absolute;left:-9999px}

.site-footer{border-top:1px solid #ddd}
.site-footer-inner{padding:16px 0;color:#666;font-size:12px}

@media(max-width:760px){
	.site-header-inner{display:block;padding:10px 0}
	.site-search{margin-top:8px}
	.site-search input{flex:1;width:auto}
	.site-nav-inner ul{gap:8px}
	.feature-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
	.post-content{font-size:15px}
}
