/* 創宇工藝 · Elite Minimal theme — 純排版、單色、細線條、無陰影。
   用法：config.php 設 'theme'=>'elite'（未覆寫的模板自動沿用 default）。 */
:root{--bg:#fafaf7;--surface:#fff;--text:#111;--muted:#6f6f68;--bd:#e4e4de;--ink:#111;--on-ink:#fafaf7;--gold:#a8864a;
 --serif:"Noto Serif TC","Source Han Serif TC","Songti TC","PMingLiU",Georgia,serif;--sans:system-ui,-apple-system,"Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif}
@media(prefers-color-scheme:dark){:root{--bg:#0d0d0c;--surface:#131312;--text:#ecece6;--muted:#8c8c84;--bd:#262624;--ink:#ecece6;--on-ink:#0d0d0c;--gold:#c9a96a}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.85 var(--sans);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none;transition:color .2s,border-color .2s}a:hover{color:var(--gold)}
img{max-width:100%;height:auto}.wrap{max-width:1040px;margin:auto;padding:0 28px}.muted{color:var(--muted)}
h1,h2,h3,h4{font-family:var(--serif);font-weight:600;letter-spacing:.02em;line-height:1.35}
/* header */
.site-header{background:var(--bg);border-bottom:1px solid var(--bd);position:sticky;top:0;z-index:50}
.bar{display:flex;align-items:center;gap:36px;min-height:72px}
.brand{font-family:var(--serif);font-weight:700;font-size:1.1rem;letter-spacing:.18em;display:flex;align-items:center;gap:10px}
.logo{width:10px;height:10px;background:var(--gold);font-size:0;display:inline-block}
.nav ul{list-style:none;margin:0;padding:0;display:flex;gap:6px}.nav li{position:relative}
.nav a{display:block;padding:6px 12px;font-size:.88rem;letter-spacing:.1em;color:var(--muted)}.nav a:hover{color:var(--text)}
.has-sub>a:after{content:"+";margin-left:6px;font-size:.8em;opacity:.5}
.nav li>ul{display:none;position:absolute;left:0;top:100%;min-width:180px;flex-direction:column;gap:0;background:var(--surface);border:1px solid var(--bd);padding:8px 0}
.nav li:hover>ul,.nav li:focus-within>ul{display:flex}.nav li>ul ul{left:100%;top:-9px}.nav li>ul a{padding:7px 18px}
.search{margin-left:auto;display:flex;border-bottom:1px solid var(--bd)}.search:focus-within{border-color:var(--text)}
.search input{width:130px;padding:6px 2px;border:0;background:none;color:var(--text);font:inherit;font-size:.88rem;outline:0}
.search button{border:0;background:none;color:var(--muted);cursor:pointer;font-size:1.1rem;padding:0 4px}
.burger{display:none;margin-left:auto;background:none;border:1px solid var(--bd);color:var(--text);padding:4px 11px;font-size:1.05rem}
/* layout */
main.wrap{padding-top:64px;padding-bottom:96px;min-height:70vh}
.page-head{margin-bottom:44px;padding-bottom:22px;border-bottom:1px solid var(--bd)}.page-head h1{margin:0;font-size:2rem}
.sec-head{display:flex;justify-content:space-between;align-items:baseline;margin:80px 0 8px;padding-bottom:14px;border-bottom:1px solid var(--text)}
.sec-head h2{margin:0;font-size:1.05rem;letter-spacing:.2em}.sec-head a{font-size:.82rem;letter-spacing:.1em;color:var(--muted)}
/* hero */
.hero{padding:56px 0 24px;text-align:left}.hero-in{max-width:760px}
.pill{display:inline-block;font-size:.75rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);padding-bottom:6px;border-bottom:1px solid var(--gold)}
.hero h1{font-size:clamp(2.2rem,6.2vw,4rem);font-weight:700;line-height:1.2;margin:28px 0 20px;letter-spacing:.01em}
.hero p{max-width:520px;color:var(--muted);font-size:1.05rem;margin:0 0 36px}
.cta{display:flex;gap:14px;flex-wrap:wrap;align-items:stretch}
.btn{display:inline-flex;align-items:center;padding:12px 30px;background:var(--ink);color:var(--on-ink);border:1px solid var(--ink);font:inherit;font-size:.88rem;letter-spacing:.14em;cursor:pointer;border-radius:0}
.btn:hover{background:transparent;color:var(--text)}.btn.ghost{background:transparent;color:var(--text)}.btn.ghost:hover{background:var(--ink);color:var(--on-ink)}
.ip{display:flex;flex-direction:column;align-items:flex-start;padding:6px 22px;border:1px solid var(--bd);background:var(--surface);color:var(--text);font:inherit;cursor:pointer;text-align:left}
.ip:hover{border-color:var(--gold)}.ip small{font-size:.65rem;letter-spacing:.25em;color:var(--muted)}.ip b{font-family:ui-monospace,Menlo,monospace;font-weight:500}
.ip[data-c]:not([data-c=""]):after{content:attr(data-c);font-size:.7rem;color:var(--gold)}
.feats{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));margin-top:72px;border-top:1px solid var(--bd)}
.feats>div{padding:30px 28px 10px 0}.feats b{display:none}.feats h4{margin:0 0 6px;font-size:1rem;letter-spacing:.12em}.feats p{margin:0;color:var(--muted);font-size:.9rem}
/* article list */
.grid{display:grid;grid-template-columns:1fr}
.post-card{display:grid;grid-template-columns:150px 1fr;gap:28px;padding:32px 0;border-bottom:1px solid var(--bd)}
.thumb{display:none}.pc-body{display:contents}
.meta{grid-column:1;grid-row:1;display:flex;flex-direction:column;gap:6px;font-size:.78rem;letter-spacing:.1em;color:var(--muted)}
.pc-body h3{grid-column:2;margin:0 0 6px;font-size:1.35rem}.pc-body p{grid-column:2;margin:0;color:var(--muted);font-size:.95rem}
.pc-body h3 a:hover{color:var(--gold)}
.badge{color:var(--gold)!important;text-transform:uppercase;letter-spacing:.2em;font-size:.72rem}
.pager{display:flex;gap:4px;justify-content:center;margin-top:48px}.pager a{padding:4px 13px;color:var(--muted);border:1px solid transparent}.pager a.on,.pager a:hover{color:var(--text);border-color:var(--text)}
/* single / page */
.card{background:none;border:0;padding:0;margin-bottom:28px}.card ul{padding-left:1.2em}
.entry{max-width:720px;margin:0 auto;padding:0}.entry h1{font-size:clamp(1.9rem,4.5vw,2.6rem);margin:22px 0 40px;line-height:1.3}
.entry .meta{flex-direction:row;gap:18px}.content{font-size:1.05rem;line-height:2}.content p{margin:0 0 1.6em}
.content a{border-bottom:1px solid var(--gold)}.content h2,.content h3{margin:2em 0 .6em}
.content blockquote{margin:2em 0;padding:0 0 0 24px;border-left:2px solid var(--gold);color:var(--muted);font-family:var(--serif)}
.content pre{background:var(--surface);border:1px solid var(--bd);padding:16px;overflow:auto;font-size:.88rem}
.site-footer{border-top:1px solid var(--bd);padding:36px 0;text-align:center;color:var(--muted);font-size:.78rem;letter-spacing:.14em}
@media(max-width:820px){.wrap{padding:0 20px}.bar{flex-wrap:wrap;gap:12px;min-height:60px}.burger{display:block}
.search{order:5;width:100%;margin-bottom:12px}.search input{flex:1}.nav{display:none;order:4;width:100%}.nav-open .nav{display:block}
.nav ul{flex-direction:column}.nav li>ul{display:flex;position:static;border:0;padding:0 0 0 16px}.nav a{padding:9px 0}
main.wrap{padding-top:40px}.post-card{grid-template-columns:1fr;gap:6px}.meta,.pc-body h3,.pc-body p{grid-column:1}.meta{flex-direction:row;gap:14px}}
/* admin（沿用同一套 token） */
.adm-bar{background:var(--surface);border-bottom:1px solid var(--bd)}.adm-bar .wrap{display:flex;gap:2px;flex-wrap:wrap;align-items:center;padding-top:10px;padding-bottom:10px}
.adm-bar a{padding:5px 14px;font-size:.88rem;letter-spacing:.08em}.adm-bar a:hover,.adm-bar a.on{background:var(--ink);color:var(--on-ink)}
.adm main.wrap{padding-top:36px}.adm .card{background:var(--surface);border:1px solid var(--bd);padding:24px}
.adm table{width:100%;border-collapse:collapse}.adm td,.adm th{padding:12px 8px;border-bottom:1px solid var(--bd);text-align:left;vertical-align:middle}
.adm label{display:block;margin:16px 0 4px;font-size:.78rem;letter-spacing:.1em;color:var(--muted)}
.adm input,.adm select,.adm textarea{width:100%;padding:9px 12px;border:1px solid var(--bd);border-radius:0;background:var(--bg);color:var(--text);font:inherit}
.adm input:focus,.adm select:focus,.adm textarea:focus{outline:0;border-color:var(--text)}
.adm textarea{min-height:280px;font-family:ui-monospace,Menlo,monospace;font-size:.88rem}.adm form.inl{display:inline}
.btn.sm{padding:4px 14px;font-size:.78rem}.btn.red{background:#9b2c2c;border-color:#9b2c2c;color:#fff}.btn.red:hover{background:transparent;color:#9b2c2c}.btn.gray{background:var(--muted);border-color:var(--muted)}
.err{color:#9b2c2c}.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:16px}.stats .card{text-align:center;margin:0}.stats b{font:600 2.2rem var(--serif);display:block}

/* ===== 色彩層：流動漸層點綴（想關掉就刪除此段，或把 --c1~--c3 改成同色） ===== */
:root{--c1:#6366f1;--c2:#06b6d4;--c3:#ec4899;--grad:linear-gradient(120deg,var(--c1),var(--c2),var(--c3),var(--c1))}
@media(prefers-color-scheme:dark){:root{--c1:#818cf8;--c2:#22d3ee;--c3:#f472b6}}
@keyframes flow{to{background-position:300% 50%}}
@keyframes drift{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(46px,-34px) scale(1.18)}}
::selection{background:var(--c1);color:#fff}
.site-header{border-image:linear-gradient(90deg,transparent,var(--c1),var(--c2),var(--c3),transparent) 1}
.logo{background:var(--grad);background-size:300% 100%;animation:flow 6s linear infinite}
/* hero：極光光暈 + 流動標題 */
.hero{position:relative;isolation:isolate}
.hero:before,.hero:after{content:"";position:absolute;z-index:-1;border-radius:50%;filter:blur(90px);pointer-events:none}
.hero:before{width:420px;height:420px;background:var(--c1);top:-60px;right:6%;opacity:.3;animation:drift 14s ease-in-out infinite}
.hero:after{width:340px;height:340px;background:var(--c3);bottom:-80px;right:30%;opacity:.2;animation:drift 18s ease-in-out infinite reverse}
.hero h1,.pc-body h3 a:hover,.badge{background:var(--grad);background-size:300% 100%;-webkit-background-clip:text;background-clip:text}
.hero h1{-webkit-text-fill-color:transparent;color:transparent;animation:flow 12s linear infinite}
.pc-body h3 a:hover,.badge{-webkit-text-fill-color:transparent;animation:flow 8s linear infinite}
.pill{color:var(--c2);border-image:linear-gradient(90deg,var(--c1),var(--c3)) 1}
/* 按鈕 */
.btn{background:var(--grad);background-size:300% 100%;border-color:transparent;color:#fff;animation:flow 8s linear infinite}
.btn:hover{background:var(--grad);background-size:300% 100%;color:#fff;filter:brightness(1.12)}
.btn.ghost{background:transparent;color:var(--text);border:1px solid;border-image:var(--grad) 1;animation:none}
.btn.ghost:hover{background:var(--grad);background-size:300% 100%;color:#fff;animation:flow 6s linear infinite}
.ip{border:1px solid transparent;background:linear-gradient(var(--surface),var(--surface)) padding-box,var(--grad) border-box;background-size:auto,300% 100%;animation:flow 8s linear infinite}
.ip:hover{border-color:transparent}
/* 區塊與卡片 */
.sec-head{border-bottom:1px solid;border-image:var(--grad) 1}
.feats{counter-reset:f;border-top:1px solid;border-image:var(--grad) 1}
.feats>div:before{counter-increment:f;content:"0" counter(f);display:block;margin-bottom:10px;font:600 .8rem ui-monospace,Menlo,monospace;letter-spacing:.2em;background:var(--grad);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:flow 8s linear infinite}
.post-card{position:relative}
.post-card:after{content:"";position:absolute;left:0;bottom:-1px;height:1px;width:0;background:var(--grad);transition:width .6s ease}
.post-card:hover:after{width:100%}
.pager a.on,.pager a:hover{border-color:var(--c2)}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}

/* ===== 列表版面：左側圖文卡片、右側文字列；側邊欄 ===== */
.split{display:grid;grid-template-columns:minmax(0,1fr);gap:0 48px}
.split.two{grid-template-columns:minmax(0,1fr) 270px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:0 36px;align-content:start}
.post-card{display:flex;flex-direction:column;padding:26px 0 32px;border-top:1px solid var(--bd);border-bottom:0}
.thumb{display:block;aspect-ratio:16/10;overflow:hidden;margin-bottom:18px;background:var(--surface)}
.thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s}
.post-card:hover .thumb img{transform:scale(1.04)}
.pc-body{display:block}.meta{flex-direction:row;gap:14px;margin-bottom:8px}.pc-body h3{margin:0 0 8px}
.g-txt{align-self:start}
.side-title{margin:0;padding-top:6px;font:600 .72rem var(--sans);letter-spacing:.25em;color:var(--muted)}
.g-txt .post-card{padding:18px 0 20px}.g-txt .meta{gap:10px;margin-bottom:6px}
.g-txt h3{font-size:1.02rem;line-height:1.5;margin:0 0 4px}
.g-txt p{font-size:.86rem;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.split:not(.two) .g-txt .post-card{display:grid;grid-template-columns:150px 1fr;gap:4px 28px;padding:22px 0;align-items:start}
.split:not(.two) .g-txt .pc-body{display:contents}
.split:not(.two) .g-txt .meta{grid-column:1;grid-row:1 / span 2;flex-direction:column;gap:2px;margin:0}
.split:not(.two) .g-txt h3{grid-column:2;grid-row:1;font-size:1.2rem;margin:0}
.split:not(.two) .g-txt p{grid-column:2;grid-row:2;font-size:.92rem;-webkit-line-clamp:3}
@media(max-width:900px){.split.two{grid-template-columns:1fr}.g-txt{margin-top:24px}}
@media(max-width:620px){.split:not(.two) .g-txt .post-card{grid-template-columns:1fr}.split:not(.two) .g-txt .meta,.split:not(.two) .g-txt h3,.split:not(.two) .g-txt p{grid-column:1;grid-row:auto}.split:not(.two) .g-txt .meta{flex-direction:row;gap:12px}}
/* 側邊欄 */
.layout{display:grid;grid-template-columns:minmax(0,1fr);gap:56px}
.layout.with-side{grid-template-columns:minmax(0,1fr) 280px}
.has-side .wrap{max-width:1200px}
.sidebar{align-self:start;position:sticky;top:96px;padding-left:28px;border-left:1px solid var(--bd);font-size:.92rem;line-height:1.8}
.sidebar h1,.sidebar h2,.sidebar h3,.sidebar h4{font-size:.78rem;letter-spacing:.22em;color:var(--muted);margin:0 0 10px}
.sidebar img{max-width:100%;height:auto}.sidebar p{margin:0 0 1em}.sidebar ul{padding-left:1.1em;margin:0 0 1em}
@media(max-width:900px){.layout.with-side{grid-template-columns:1fr}.sidebar{position:static;border-left:0;padding:28px 0 0;border-top:1px solid var(--bd)}}
.entry .cover{width:100%;aspect-ratio:21/9;object-fit:cover;margin:0 0 40px;display:block}
.content img{max-width:100%;height:auto;margin:1.6em auto;display:block}
