/*
Theme Name: SQuimi 小宇宙
Description: A custom block theme scaffolded by Studio Code.
Requires at least: 6.7
Tested up to: 6.9
Requires PHP: 7.2
Version: 0.1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: squimi-universe
Tags: full-site-editing, block-patterns, block-styles, wide-blocks, accessibility-ready, style-variations
*/

/* WordPress inserts a margin-block-start equal to the block gap (24px unless
   theme.json sets styles.spacing.blockGap) between the template's top-level
   sections (header part, main, footer part) — a gap that exists even when no
   markup asks for it. Zero it so sections butt edge-to-edge and own their
   vertical rhythm via padding; this does not affect block gaps inside nested
   layouts. */
.wp-site-blocks > * + * {
	margin-block-start: 0;
}

/* With that gap gone, main carries its own vertical padding so templates this
   theme does not author (WooCommerce shop, product, cart…) still clear the
   header and footer. */
.wp-site-blocks main {
	padding-block: var(--wp--preset--spacing--lg) var(--wp--preset--spacing--lg);
}
.wp-site-blocks main.is-flush {
	padding-block: 0;
}

/* --------------------------------------------- *
 * Dreamy iridescent sky-ocean background
 * --------------------------------------------- */
body {
	background:
		radial-gradient(1100px 720px at 10% -8%, rgba(245, 188, 216, 0.45), transparent 62%),
		radial-gradient(1000px 700px at 100% -4%, rgba(191, 224, 245, 0.5), transparent 60%),
		radial-gradient(900px 680px at -4% 100%, rgba(198, 236, 223, 0.45), transparent 58%),
		radial-gradient(1200px 800px at 100% 100%, rgba(183, 141, 212, 0.25), transparent 60%),
		linear-gradient(180deg, #eef3fc 0%, #f3ecfb 55%, #eaf4fb 100%);
	background-attachment: fixed;
}

/* --------------------------------------------- *
 * Glass panels
 * --------------------------------------------- */
.glass-card {
	background: rgba(255, 255, 255, 0.55);
	border: 1px solid rgba(255, 255, 255, 0.72);
	border-radius: var(--wp--custom--rounded--lg, 26px);
	box-shadow:
		0 20px 48px -24px rgba(155, 120, 190, 0.5),
		inset 0 1px 0 rgba(255, 255, 255, 0.85);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
}

/* Creamy near-opaque backing for reading areas */
.post-article,
.page-article,
.post-card {
	background: rgba(255, 252, 248, 0.94);
}
.post-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 30px 56px -26px rgba(155, 120, 190, 0.6);
}
.post-card {
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.post-card .wp-block-post-featured-image img {
	width: 100%;
	border-radius: var(--wp--custom--rounded--md, 18px);
	display: block;
}
.post-card h2.wp-block-post-title {
	margin-top: 0;
	margin-bottom: 0;
}
.post-card h2.wp-block-post-title a:hover {
	color: var(--wp--preset--color--primary);
}
.post-card .wp-block-post-excerpt {
	color: #6b6683;
	margin-top: 0.4rem;
	margin-bottom: 0.6rem;
}
.post-card .wp-block-post-excerpt .wp-block-post-excerpt__excerpt {
	margin: 0;
}
.wp-block-read-more {
	display: inline-flex;
	align-items: center;
	color: var(--wp--preset--color--primary);
	font-weight: 600;
	font-size: 0.92rem;
	letter-spacing: 0.03em;
}
.wp-block-read-more:hover {
	color: #7a4ea8;
}

/* --------------------------------------------- *
 * Banner (header hero)
 * --------------------------------------------- */
.site-banner .wp-block-cover {
	border-radius: 0;
}
.is-banner-cover {
	display: flex;
	align-items: flex-end;
}
.site-banner-copy {
	text-align: center;
	max-width: var(--wp--style--global--content-size, 1400px);
	padding-left: var(--wp--style--root--padding-left);
	padding-right: var(--wp--style--root--padding-right);
}
.site-banner-copy .banner-title {
	margin: 0 auto;
	color: var(--wp--preset--color--text);
	text-shadow: 0 2px 24px rgba(255, 255, 255, 0.9);
}
.site-banner-copy .banner-tagline {
	color: #57536e;
	margin: 0.5rem auto 0;
	max-width: 34em;
	text-shadow: 0 1px 14px rgba(255, 255, 255, 0.95);
}

/* --------------------------------------------- *
 * Nav bar — distributed edge to edge
 * --------------------------------------------- */
.site-nav {
	background: rgba(255, 255, 255, 0.5);
	border-top: 1px solid rgba(255, 255, 255, 0.7);
	border-bottom: 1px solid rgba(255, 255, 255, 0.7);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	box-shadow: 0 10px 30px -22px rgba(120, 90, 160, 0.55);
}
.site-nav .nav-links {
	width: 100%;
}
.site-nav .nav-links .nav-link {
	flex: 1 1 auto;
	margin: 0;
}
.site-nav .nav-link a {
	display: block;
	text-align: center;
	padding: 0.8rem 1.1rem;
	font-weight: 500;
	letter-spacing: 0.08em;
	color: var(--wp--preset--color--text);
	text-decoration: none;
	border-radius: 999px;
	transition: background 0.25s ease, color 0.25s ease;
}
.site-nav .nav-link a:hover {
	background: linear-gradient(135deg, rgba(245, 188, 216, 0.55), rgba(191, 224, 245, 0.55));
	color: #6b3f9a;
}
.nav-sub {
	display: block;
	font-size: 0.62rem;
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: #9a7fb8;
	margin-top: 0.1rem;
}

/* --------------------------------------------- *
 * Sidebar
 * --------------------------------------------- */
.col-sidebar {
	position: sticky;
	top: 1.25rem;
	align-self: flex-start;
}
.sidebar {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--md);
}
.sidebar .glass-card {
	width: 100%;
	max-width: none;
	margin-left: 0;
	margin-right: 0;
}
.sidebar .wp-block-search,
.sidebar .wp-block-search__inside-form {
	width: 100%;
}
.sidebar .wp-block-search__input {
	min-width: 0;
}
.intro-card {
	text-align: center;
	margin-top: 6px !important;
}
.avatar-wrap {
	margin: 0 auto;
}
.avatar-wrap img {
	width: 96px;
	height: 96px;
	border-radius: 50%;
	object-fit: cover;
	border: 3px solid rgba(255, 255, 255, 0.9);
	box-shadow: 0 12px 30px -12px rgba(155, 120, 190, 0.55);
}
.intro-card h3 {
	margin: 0.4rem 0 0;
}
.intro-line {
	color: #6b6683;
}
.digugu-card {
	text-align: center;
	padding-top: 16px !important;
	padding-bottom: 16px !important;
	gap: 6px !important;
}
.digugu-icon {
	margin: 0 auto;
}
.digugu-icon img {
	width: 46px;
	height: 46px;
	border-radius: 50%;
	object-fit: cover;
	display: block;
	margin: 0 auto;
	box-shadow: 0 10px 26px -12px rgba(155, 120, 190, 0.6);
	transition: transform 0.22s ease, box-shadow 0.22s ease;
}
.digugu-card a.digugu-icon-link:hover img,
.digugu-icon:hover img {
	transform: translateY(-3px) scale(1.04);
	box-shadow: 0 16px 34px -12px rgba(155, 120, 190, 0.7);
}
.digugu-heading {
	margin: 0.1rem 0 0;
}
.digugu-heading a {
	color: var(--wp--preset--color--text);
	text-decoration: none;
}
.digugu-heading a:hover {
	color: #6b3f9a;
}
.digugu-line {
	color: #8a84a3;
	margin: 0 0 0;
	line-height: 1.5;
}
.post-datetime {
	margin: 0;
	line-height: 1.6;
}
.post-date-cn {
	white-space: nowrap;
}
.post-date-kr {
	display: block;
	font-size: 0.82em;
	opacity: 0.8;
	margin-top: 0.1rem;
}

/* 文章內頁：分類按鈕與日期對齊 */
.post-article .post-meta {
	align-items: center;
}
.post-article .post-meta .post-datetime {
	display: inline-block;
	margin: 0;
	line-height: 1.5;
}
.post-article .post-meta .cat-pills a {
	display: inline-block;
	background: linear-gradient(135deg, rgba(245, 188, 216, 0.55), rgba(191, 224, 245, 0.55));
	border: 1px solid rgba(245, 188, 216, 0.7);
	color: #6b3f9a;
	padding: 0.14rem 0.75rem;
	border-radius: 999px;
	font-size: 0.8rem;
	font-weight: 500;
	text-decoration: none;
	margin-right: 0.4rem;
	line-height: 1.4;
	transition: background 0.2s ease, color 0.2s ease;
}
.post-article .post-meta .cat-pills a:hover {
	background: linear-gradient(135deg, #b78dd4, #8f6bb8);
	color: #fff;
}
.post-article .post-meta .tag-links {
	color: #9a7fb8;
}
.post-article .post-meta .tag-links a {
	color: #9a7fb8;
	text-decoration: none;
}
.post-article .post-meta .tag-links a:hover {
	color: #6b3f9a;
	text-decoration: underline;
}
.side-heading {
	font-size: 1.05rem;
	letter-spacing: 0.04em;
	margin: 0 0 0.6rem;
	padding-bottom: 0.5rem;
	border-bottom: 2px solid rgba(245, 188, 216, 0.6);
}
.sidebar .wp-block-search__button {
	background: linear-gradient(135deg, var(--wp--preset--color--primary), #cf9be8);
	color: #fff;
	border: none;
	border-radius: 999px;
}
.sidebar .wp-block-search__input {
	border: 1px solid rgba(200, 185, 220, 0.6);
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.7);
}
.sidebar .wp-block-categories {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
}
.sidebar .wp-block-categories li a {
	display: inline-flex;
	align-items: baseline;
	color: var(--wp--preset--color--text);
	padding: 0.25rem 0.5rem;
	border-radius: 999px;
}
.sidebar .wp-block-categories li a:hover {
	background: rgba(245, 188, 216, 0.35);
	color: #6b3f9a;
}
.side-links {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}
.side-links a {
	display: inline-block;
	padding: 0.45rem 0.85rem;
	border-radius: 999px;
	background: rgba(191, 224, 245, 0.35);
	color: var(--wp--preset--color--text);
	font-weight: 500;
	transition: background 0.25s ease;
}
.side-links a:hover {
	background: rgba(245, 188, 216, 0.45);
	color: #6b3f9a;
}

/* --------------------------------------------- *
 * Reading areas
 * --------------------------------------------- */
.blog-section-title {
	font-size: clamp(1.4rem, 2.6vw, 2rem);
	margin: 0 0 1.25rem;
	color: #57536e;
}
.post-article h1.wp-block-post-title {
	margin-top: 0;
}
.post-article .wp-block-post-content {
	line-height: 1.95;
	font-size: 1.08rem;
	color: #45435a;
}
.post-article .wp-block-post-content > h2,
.post-article .wp-block-post-content > h3 {
	margin-top: 1.5em;
}
.post-article .wp-block-post-content img,
.page-article .wp-block-post-content img {
	border-radius: var(--wp--custom--rounded--md, 18px);
}

/* --------------------------------------------- *
 * Pagination
 * --------------------------------------------- */
.wp-block-query-pagination {
	gap: 0.5rem;
}
.wp-block-query-pagination a, .wp-block-query-pagination > .wp-block-query-pagination-numbers .page-numbers {
	border-radius: 999px;
	padding: 0.4rem 0.9rem;
}
.wp-block-query-pagination .page-numbers.current {
	background: var(--wp--preset--color--primary);
	color: #fff;
}

/* --------------------------------------------- *
 * Footer
 * --------------------------------------------- */
.site-footer {
	border-top: 1px solid rgba(255, 255, 255, 0.8);
	text-align: center;
	color: #6b6683;
	background: rgba(255, 255, 255, 0.35);
}

/* --------------------------------------------- *
 * Buttons
 * --------------------------------------------- */
.wp-block-button__link {
	transition: transform 0.2s ease, box-shadow 0.2s ease;
	box-shadow: 0 10px 24px -14px rgba(155, 120, 190, 0.8);
}
.wp-block-button__link:hover {
	transform: translateY(-2px);
}

/* --------------------------------------------- *
 * Responsive — mobile single column, articles first
 * --------------------------------------------- */
@media (max-width: 860px) {
	.main-cols {
		flex-direction: column;
	}
	.col-main {
		order: 1;
		width: 100%;
		max-width: 100%;
		flex-basis: auto;
		padding-left: 0;
		padding-right: 0;
	}
	.col-sidebar {
		order: 2;
		position: static;
		width: 100%;
		max-width: 100%;
		flex-basis: auto;
	}
	.site-nav .nav-link a {
		padding: 0.7rem 0.6rem;
	}
	.site-banner-copy .banner-title {
		font-size: clamp(1.9rem, 9vw, 2.6rem);
	}
}

/* --------------------------------------------- *
 * Motion — respect reduced-motion
 * --------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.001s !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.001s !important;
		scroll-behavior: auto !important;
	}
	.post-card {
		transform: none !important;
	}
}

/* Small social entry beside the centered profile avatar. */
.intro-card .profile-social-row { grid-template-columns: minmax(0,1fr) 102px minmax(0,1fr); width:100%; gap:0; align-items:center; }
.profile-social-row .avatar-wrap { margin:0; }
.profile-social-row .social-entry { margin:0; justify-self:center; width:60px; }
.social-entry a { display:block; border-radius:0; overflow:visible; }
.social-entry img { display:block; width:60px; height:auto; object-fit:contain; transform:none; }
.social-entry a:focus-visible { outline:2px solid var(--wp--preset--color--primary); outline-offset:3px; }
.social-links { align-items:stretch; gap:14px; }
.social-links .wp-block-button { width:100%; }
.social-links .wp-block-button__link { display:block; white-space:normal; overflow-wrap:anywhere; text-align:left; }

/* Complete original social images with rounded rectangular frames. */
.social-original { width:100%; margin-block:16px 32px; }
.social-original a { display:block; padding:12px; border:2px solid var(--wp--preset--color--primary); border-radius:18px; background:var(--wp--preset--color--surface, #fff); box-sizing:border-box; }
.social-original img { display:block; position:static; width:100%; max-width:100%; height:auto; object-fit:contain; transform:none; border-radius:6px; }
.social-original a:focus-visible { outline:3px solid var(--wp--preset--color--primary); outline-offset:4px; }
.social-original-line { max-width:340px; }
.social-card-title { overflow-wrap:anywhere; font-size:clamp(1.05rem,2vw,1.35rem); }
@media (max-width:600px) { .social-original a { padding:6px; border-radius:14px; } }
/* Social page alignment and owner-specified individual frame colours. */
.page-id-52 .wp-block-post-title,
.page-id-52 .entry-content h2 { text-align:center; }
.social-original-personal a { border-color:#c9bde9; }
.social-original-dog a { border-color:#95d9e7; }
.social-original-fan a { border-color:#ece500; }
.social-original-work a { border-color:#ffa4ca; }
.social-original-threads a { border-color:#b7e51c; }
.social-original-line a { border-color:#d3a1de; }

/* Keep the linked banner title in its original heading style. */
.banner-title a { color:inherit; text-decoration:none; }
.banner-title a:focus-visible { outline:2px solid currentColor; outline-offset:5px; }

.writing-years-card { padding:var(--wp--preset--spacing--md); }
.writing-year-links { margin-block:0; padding-inline-start:1.2em; }

/* ===== 滴咕：Threads 風格即時心情發布 ===== */
#digugu-app { width:100%; max-width:680px; margin-inline:auto; }
.dd-compose { display:flex; flex-direction:column; gap:10px; padding:18px; border:1px solid var(--wp--preset--color--sky,#dceaf8); border-radius:20px; background:var(--wp--preset--color--surface,#fff); box-shadow:0 8px 30px rgba(120,120,180,.12); }
.dd-compose-top { display:flex; align-items:flex-start; gap:12px; }
.dd-compose-top img { border-radius:50%; flex:none; }
.dd-compose-top textarea { flex:1; min-height:56px; resize:vertical; border:0; outline:none; font:inherit; color:var(--wp--preset--color--text,#4a485f); background:transparent; line-height:1.6; }
.dd-compose-bar { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; border-top:1px solid rgba(183,141,212,.25); padding-top:10px; }
.dd-photo { font-size:.9rem; color:var(--wp--preset--color--primary,#b78dd4); cursor:pointer; }
.dd-photo input { display:none; }
.dd-filename { flex:1; min-width:120px; font-size:.8rem; color:var(--wp--preset--color--text,#4a485f); opacity:.7; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
#dd-send { font:inherit; border:0; border-radius:999px; padding:8px 22px; font-weight:600; color:#fff; background:linear-gradient(135deg,var(--wp--preset--color--primary,#b78dd4),var(--wp--preset--color--accent,#f5bcd8)); cursor:pointer; transition:opacity .15s ease; }
#dd-send:hover { opacity:.88; }
#dd-send:focus-visible { outline:2px solid var(--wp--preset--color--primary); outline-offset:3px; }
.dd-err { margin:0; font-size:.85rem; color:#d46a6a; }
.dd-thread-row { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.dd-thread-row input { flex:1; min-width:200px; border:1px solid rgba(183,141,212,.5); border-radius:999px; padding:8px 14px; font:inherit; font-size:.9rem; color:var(--wp--preset--color--text,#4a485f); background:rgba(255,255,255,.7); outline:none; }
.dd-thread-row input:focus { border-color:var(--wp--preset--color--primary,#b78dd4); }
.dd-thread-row button { font:inherit; border:1px solid var(--wp--preset--color--primary,#b78dd4); background:rgba(255,255,255,.5); color:var(--wp--preset--color--primary,#b78dd4); border-radius:999px; padding:8px 16px; cursor:pointer; font-weight:600; }
.dd-thread-row button:hover { background:var(--wp--preset--color--primary,#b78dd4); color:#fff; }
.dd-login-note { padding:16px; text-align:center; color:var(--wp--preset--color--text,#4a485f); opacity:.75; border:1px dashed var(--wp--preset--color--primary,#b78dd4); border-radius:18px; }
.dd-tabs { display:flex; gap:8px; margin:22px 0 8px; flex-wrap:wrap; }
.dd-tab { font:inherit; border:1px solid rgba(183,141,212,.5); background:rgba(255,255,255,.6); color:var(--wp--preset--color--text,#4a485f); border-radius:999px; padding:6px 16px; cursor:pointer; font-weight:500; transition:all .15s ease; }
.dd-tab:hover { border-color:var(--wp--preset--color--primary,#b78dd4); }
.dd-tab.active { color:#fff; background:linear-gradient(135deg,var(--wp--preset--color--primary,#b78dd4),var(--wp--preset--color--accent,#f5bcd8)); border-color:transparent; }
.dd-feed { display:flex; flex-direction:column; gap:14px; margin-top:14px; }
#dd-feed .digugu-card { padding:16px 18px; border-radius:20px; background:var(--wp--preset--color--surface,#fff); border:1px solid rgba(190,200,240,.5); box-shadow:0 6px 22px rgba(120,120,180,.08); }
#dd-feed .digugu-card.kind-threads { border-left:4px solid var(--wp--preset--color--primary,#b78dd4); }
.dd-head { display:flex; align-items:center; gap:10px; }
.dd-head img { border-radius:50%; }
.dd-av { display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px; border-radius:50%; background:linear-gradient(135deg,var(--wp--preset--color--primary,#b78dd4),var(--wp--preset--color--accent,#f5bcd8)); color:#fff; font-weight:700; }
.dd-meta { display:flex; flex-direction:column; line-height:1.25; }
.dd-name { font-weight:600; font-family:var(--wp--preset--font-family--heading,serif); }
.dd-date { font-size:.78rem; opacity:.6; }
.dd-body { margin-top:10px; line-height:1.75; word-break:break-word; }
.dd-body p { margin:0 0 .6em; }
.dd-body iframe, .dd-body .twitter-tweet, .dd-body blockquote { max-width:100%; }
.dd-img { margin-top:12px; }
.dd-img img { display:block; width:100%; max-width:100%; height:auto; border-radius:16px; }
.dd-orig { display:inline-block; margin-top:12px; font-weight:600; color:var(--wp--preset--color--primary,#b78dd4); text-decoration:none; }
.dd-orig:hover { text-decoration:underline; }
.dd-source { font-size:.75rem; opacity:.6; }
.dd-thread-card { background:rgba(248,249,255,.6); border:1px solid rgba(183,141,212,.2); border-radius:18px; padding:14px 16px; margin-top:2px; }
.dd-more-wrap { text-align:center; margin-top:20px; }
.dd-more { font:inherit; border:1px solid var(--wp--preset--color--primary,#b78dd4); background:rgba(255,255,255,.5); color:var(--wp--preset--color--primary,#b78dd4); border-radius:999px; padding:8px 22px; cursor:pointer; font-weight:600; }
.dd-more:hover { background:var(--wp--preset--color--primary,#b78dd4); color:#fff; }
.dd-title, .page-id-47 .wp-block-post-title { text-align:center; }
.dd-title { font-family:var(--wp--preset--font-family--heading,serif); font-size:clamp(1.9rem,4vw,2.6rem); line-height:1.15; margin:0; }
.dd-intro { text-align:center; }
.dd-head-wrap { position:relative; min-height:64px; padding-top:6px; margin-top:-36px; }
.dd-girl { position:absolute; left:calc(50% - 186px); top:-22px; transform:none; width:108px; height:144px; margin:0; }
.dd-girl img { width:100%; height:100%; object-fit:contain; }
