/* ===== holin.studio 共用 Y2K 樣式 ===== */

/* 字體 */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600;700&family=Noto+Serif+TC:wght@400;500;600;700&display=swap');

/* Y2K 配色 */
:root{
--bg-base:#FFF4E0;
--bg-grad1:#FFE8C8;
--bg-grad2:#FFD8A8;
--text-main:#3D1C00;
--text-soft:#6B3D10;
--text-muted:#A87D35;
--accent:#FF7A00;
--accent-h:#FF6000;
--accent-light:#FFB84D;
--border-soft:rgba(255,180,80,.3);
--border-hover:rgba(255,122,0,.5);
--card-bg:rgba(255,255,255,.4);
--card-bg-h:rgba(255,255,255,.6);
--glow-shadow:0 0 20px rgba(255,122,0,.12),0 4px 16px rgba(255,140,0,.08);
--shine:linear-gradient(135deg,rgba(255,255,255,.4) 0%,transparent 50%,rgba(255,200,100,.15) 100%);
--radius:16px;
--radius-sm:12px;
--radius-pill:20px;
}

*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%}

body{
font-family:'Noto Serif TC','PingFang TC','Microsoft JhengHei',-apple-system,BlinkMacSystemFont,sans-serif;
background:var(--bg-base);
background-image:linear-gradient(180deg,var(--bg-base) 0%,var(--bg-grad1) 50%,var(--bg-grad2) 100%);
background-attachment:fixed;
color:var(--text-main);
min-height:100vh;
overflow-x:hidden;
}
body::before{
content:'';position:fixed;inset:0;
background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
pointer-events:none;z-index:9999;
}

/* ===== Y2K 星星背景 ===== */
.stars{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.star{position:absolute;color:#FFAA30;opacity:0;animation:twinkle 3s ease-in-out infinite}
.star:nth-child(1){top:8%;left:12%;font-size:14px;animation-delay:0s}
.star:nth-child(2){top:15%;left:80%;font-size:10px;animation-delay:.8s}
.star:nth-child(3){top:30%;left:50%;font-size:12px;animation-delay:1.5s}
.star:nth-child(4){top:55%;left:85%;font-size:16px;animation-delay:.3s}
.star:nth-child(5){top:70%;left:10%;font-size:11px;animation-delay:1.2s}
.star:nth-child(6){top:85%;left:60%;font-size:13px;animation-delay:2s}
.star:nth-child(7){top:25%;left:25%;font-size:9px;animation-delay:.6s;color:#FF8C00}
.star:nth-child(8){top:65%;left:70%;font-size:10px;animation-delay:1.8s;color:#FFD040}
@keyframes twinkle{0%,100%{opacity:0;transform:scale(.5) rotate(0deg)}50%{opacity:.5;transform:scale(1) rotate(180deg)}}

/* 標題旁的 ✦ 裝飾 */
.menu-sub{display:flex;align-items:center;justify-content:center;gap:.5rem}
.menu-sub::before,.menu-sub::after{content:'✦';color:var(--accent-light);font-size:.8em}

/* 返回按鈕 */
.back-btn{
position:fixed;top:1.5rem;left:1.5rem;
color:var(--text-muted);text-decoration:none;
font-size:.75rem;font-weight:600;letter-spacing:.12em;
transition:all .3s ease;cursor:pointer;
background:rgba(255,255,255,.5);backdrop-filter:blur(8px);
border:1px solid var(--border-soft);
padding:.5rem 1rem;border-radius:var(--radius-pill);
font-family:inherit;z-index:100;
}
.back-btn:hover{color:var(--accent);border-color:var(--accent);background:rgba(255,255,255,.7)}

/* 容器 */
.container{max-width:680px;margin:0 auto;padding:6rem 2rem 5rem;position:relative;z-index:1}

/* 頁面標題 */
.page-title{
font-family:'Cormorant Garamond',serif;
font-size:clamp(1.6rem,4vw,2.3rem);font-weight:700;letter-spacing:-0.02em;
margin-bottom:2.5rem;
background:linear-gradient(135deg,#FF7A00,#FFAA30);
-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}

/* 分隔線 */
.divider{width:100%;height:1px;background:var(--border-soft);margin-bottom:2.5rem}

/* 連結卡片 */
.post-card,.platform-link,.link-card{
display:block;text-decoration:none;color:var(--text-main);
background:var(--card-bg);backdrop-filter:blur(4px);
border:2px solid var(--border-soft);
padding:1.5rem 1.8rem;
border-radius:var(--radius);
transition:all .3s cubic-bezier(.4,0,.2,1);
position:relative;overflow:hidden;
}
.post-card::before,.platform-link::before,.link-card::before{
content:'';position:absolute;inset:0;opacity:.55;transition:opacity .3s ease;z-index:0;
background:var(--shine);
}
.post-card>*,.platform-link>*,.link-card>*{position:relative;z-index:1}
.post-card:hover,.platform-link:hover,.link-card:hover{
background:var(--card-bg-h);border-color:var(--accent);
box-shadow:var(--glow-shadow);transform:translateY(-2px);
}
.post-card:hover::before,.platform-link:hover::before,.link-card:hover::before{opacity:.8}

/* 列表 */
.post-list{display:flex;flex-direction:column;gap:.8rem}
.platforms{display:flex;flex-direction:column;gap:.8rem}

/* 標籤 */
.section-title{
font-size:.65rem;font-weight:700;color:var(--accent);
letter-spacing:.25em;text-transform:uppercase;margin-bottom:1rem;
}
.tags{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:2rem}
.tag{
font-size:.78rem;font-weight:500;color:var(--text-main);
background:var(--card-bg);border:1.5px solid var(--border-soft);
padding:.35rem 1rem;border-radius:var(--radius-pill);
transition:all .3s ease;
}
.tag:hover{border-color:var(--accent);background:var(--card-bg-h);box-shadow:var(--glow-shadow)}

/* 標籤雲 */
.label{font-size:.65rem;font-weight:700;color:var(--accent);letter-spacing:.2em;text-transform:uppercase;margin-bottom:1rem}

/* 文章內容 */
.post-content{font-size:1rem;font-weight:400;color:var(--text-soft);line-height:2;letter-spacing:.02em}
.post-content h2{font-family:'Noto Serif TC',sans-serif;font-size:1.1rem;font-weight:700;color:var(--text-main);margin-top:2.5rem;margin-bottom:.8rem}
.post-content p{margin-bottom:1.2rem}

/* 手機版 */
@media(max-width:768px){
.container{padding:5rem 1.3rem 3rem}
.page-title{font-size:1.5rem;margin-bottom:2rem}
.post-card,.platform-link,.link-card{padding:1.3rem 1.4rem;border-radius:var(--radius-sm)}
.post-content{font-size:.95rem;line-height:1.9}
.back-btn{top:1rem;left:1rem;font-size:.7rem;padding:.4rem .8rem}
}