:root{--bg:#f7f8f2;--ink:#1f3929;--muted:#627367;--accent:#2955df;--line:#d8dfd4;--hero:#dce9f1;--lime:#e8fa9d;--peach:#f0d3b8;--lavender:#dde3f9}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--bg);color:var(--ink);font-family:"Noto Sans TC","Microsoft JhengHei",sans-serif;line-height:1.7;-webkit-font-smoothing:antialiased}button,input{font:inherit}button{color:inherit;cursor:pointer}a{color:inherit;text-decoration:none}a,button{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid var(--accent);outline-offset:4px}::selection{background:var(--accent);color:white}h1,h2,h3,p{margin:0}h1,h2,h3{text-wrap:balance}svg{display:block;width:24px;height:24px;flex-shrink:0}.wrap{width:min(1280px,calc(100% - 112px));margin-inline:auto}.mono{font-family:"Space Grotesk",Consolas,monospace;font-size:11px;letter-spacing:.1em}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip{position:fixed;z-index:200;top:12px;left:12px;padding:10px 14px;background:var(--ink);color:white;transform:translateY(-180%)}.skip:focus{transform:none}
.nav{height:100px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:12px;font-size:21px;font-weight:700;letter-spacing:.09em}.brand-mark{display:flex;width:29px;height:29px;color:var(--accent)}.brand-mark svg{width:29px;height:29px}.nav-links{display:flex;align-items:center;gap:34px}.nav-links a{position:relative;padding:10px 0;font-size:14px}.nav-links a:after{content:"";position:absolute;left:0;bottom:4px;width:100%;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .25s}.nav-links a:hover:after,.nav-links a[aria-current=page]:after{transform:scaleX(1)}.nav-contact,.cta-button{display:inline-flex;align-items:center;gap:20px;min-height:44px;padding:8px 19px;border-radius:30px;background:var(--ink);color:#f5f6ec;font-size:13px}.nav-contact svg,.cta-button svg{width:20px;height:20px}.menu-toggle{display:none;width:44px;height:44px;border:1px solid var(--line);background:transparent;align-items:center;justify-content:center}
.archive-hero{position:relative;display:grid;grid-template-columns:minmax(0,1.12fr) minmax(380px,.88fr);min-height:625px;padding:58px 55px 0;border-radius:26px;background:var(--hero);overflow:hidden;isolation:isolate}.archive-copy{position:relative;z-index:2;padding:18px 0 95px}.eyebrow{display:flex;align-items:center;gap:12px;font-family:"Space Grotesk",sans-serif;font-size:11px;letter-spacing:.13em}.eyebrow:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--accent)}.archive-copy h1{margin-top:46px;font-family:"DM Sans","Noto Sans TC",sans-serif;font-size:clamp(62px,7vw,102px);font-weight:500;letter-spacing:-.065em;line-height:.99}.archive-copy h1 span{color:var(--accent);font-family:Georgia,serif;font-style:italic;font-weight:400}.hero-lead{margin-top:34px;font-size:24px;font-weight:500;letter-spacing:.01em}.hero-note{max-width:455px;margin-top:16px;color:#516776;font-size:14px;line-height:1.9}.archive-scene{position:relative;display:grid;place-items:center;min-width:0}.scene-label{position:absolute;top:48px;left:28px;color:#617581}.scene-label:before{content:"";display:inline-block;width:5px;height:5px;margin-right:10px;border-radius:50%;background:var(--accent)}.scene-caption{position:absolute;right:0;bottom:102px;color:#70828a;font-size:8px}.archive-orbit{position:relative;width:min(430px,100%);aspect-ratio:1}.ring{position:absolute;inset:50%;border:1px solid #8fa7b43d;border-radius:50%;transform:translate(-50%,-50%) rotate(-12deg)}.ring-one{width:38%;height:38%}.ring-two{width:63%;height:63%}.ring-three{width:88%;height:88%}.planet-core{position:absolute;left:50%;top:50%;width:103px;height:103px;border-radius:50%;transform:translate(-50%,-50%);background:radial-gradient(circle at 32% 28%,#75aaff 0 8%,#356de0 28%,#174bbd 72%,#103487);box-shadow:inset -15px -12px 24px #0d2e8066,0 14px 35px #2a5ad83d}.planet-core:after{content:"";position:absolute;inset:15% 8%;border-radius:50%;background:repeating-linear-gradient(7deg,transparent 0 11px,#ffffff24 12px 13px);transform:rotate(-12deg)}.moon{position:absolute;border-radius:50%;box-shadow:0 5px 9px #334b5a2b}.moon-one{width:18px;height:18px;left:10%;top:49%;background:linear-gradient(135deg,#fff,#b8cada)}.moon-two{width:22px;height:22px;right:7%;top:23%;background:linear-gradient(135deg,#ffd5a0,#d87b3e)}.moon-three{width:29px;height:29px;right:18%;bottom:12%;background:linear-gradient(135deg,#eafea4,#91bd4c)}.orbit-tag{position:absolute;display:grid;place-items:center;width:38px;height:38px;border-radius:8px;font:600 10px "Space Grotesk",sans-serif;box-shadow:0 8px 17px #23405d24}.tag-code{left:14%;bottom:20%;background:#f4f6ed;color:#607080;transform:rotate(11deg)}.tag-ai{right:24%;top:21%;background:var(--accent);color:white;transform:rotate(12deg)}.archive-orbit{animation:orbit-breathe 7s ease-in-out infinite}.moon-one{animation:moon-float 4.5s ease-in-out infinite}.moon-two{animation:moon-float 5.2s ease-in-out -1s infinite}.moon-three{animation:moon-float 5.8s ease-in-out -2s infinite}.hero-foot{position:absolute;left:55px;right:55px;bottom:0;display:flex;align-items:center;justify-content:space-between;padding:19px 0;border-top:1px solid #b9cbd3;color:#5f747f;font:10px "Space Grotesk",sans-serif;letter-spacing:.09em}.hero-foot b{color:var(--ink);font-size:14px;margin-right:6px}
.archive-section{padding:105px 0 115px}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:40px}.section-index{display:block;margin-bottom:10px;color:var(--accent)}.section-heading h2{font-size:clamp(32px,3.2vw,46px);line-height:1.3;font-weight:500;letter-spacing:-.045em}.section-heading>p{max-width:360px;color:var(--muted);font-size:13px;line-height:1.9}.article-tools{display:flex;align-items:center;justify-content:space-between;gap:28px;margin-top:46px;padding:21px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.search-box{display:flex;align-items:center;gap:12px;width:min(440px,100%);min-height:50px;padding:0 16px;border:1px solid var(--line);border-radius:30px;background:#fff}.search-box svg{width:20px;color:var(--muted)}.search-box input{min-width:0;flex:1;border:0;outline:0;background:transparent;color:var(--ink);font-size:13px}.search-box input::placeholder{color:#89938c}.search-box button{border:0;background:transparent;color:var(--accent);font-size:11px}.filters{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.filter{min-height:44px;padding:8px 17px;border:1px solid var(--line);border-radius:28px;background:transparent;font-size:12px;transition:.2s}.filter:hover,.filter[aria-pressed=true]{border-color:var(--accent);background:var(--accent);color:white}.results-bar{display:flex;justify-content:space-between;align-items:center;padding:26px 0}.results-bar p{color:var(--muted);font-size:12px}.results-bar .mono{color:#839087;font-size:9px}
.articles-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:42px 27px}.article-card{min-width:0}.article-link{display:block;height:100%}.article-visual{position:relative;height:228px;border-radius:17px;overflow:hidden;background:#e0e8d2;color:#607845;isolation:isolate}.article-visual:after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,#fff7,transparent 48%);pointer-events:none}.article-visual[data-kind=web]{background:var(--peach);color:#9c5c35}.article-visual[data-kind=cloud]{background:#dce9f1;color:#42677b}.article-visual[data-kind=ai]{background:var(--lavender);color:#4b61b8}.article-visual[data-kind=other]{background:#e5ebd2;color:#627444}.article-number{position:absolute;z-index:2;top:17px;left:18px;display:grid;place-items:center;width:31px;height:31px;border:1px solid currentColor;border-radius:50%;font:10px "Space Grotesk",sans-serif}.visual-lines{position:absolute;inset:0}.visual-lines i{position:absolute;display:block;border:1px solid currentColor;border-radius:50%;opacity:.52}.visual-lines i:nth-child(1){width:170px;height:170px;right:-5px;top:28px}.visual-lines i:nth-child(2){width:112px;height:112px;right:58px;top:58px}.visual-lines i:nth-child(3){width:17px;height:17px;right:92px;top:106px;background:currentColor;box-shadow:-76px 45px 0 -4px currentColor,70px -58px 0 -5px currentColor}.article-visual[data-kind=web] .visual-lines i{border-radius:45% 55% 12px 60%;transform:rotate(24deg)}.article-visual[data-kind=ai] .visual-lines{transform:rotate(-11deg)}.article-visual[data-kind=ai] .visual-lines i{border-radius:13px}.article-category{display:block;margin-top:21px;color:var(--muted);font:10px "Space Grotesk","Noto Sans TC",sans-serif;letter-spacing:.08em;text-transform:uppercase}.article-card h3{margin-top:10px;font-size:21px;font-weight:500;letter-spacing:-.025em;line-height:1.55}.article-excerpt{margin-top:9px;color:var(--muted);font-size:13px;line-height:1.8;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}.article-tags{display:flex;gap:7px;flex-wrap:wrap;margin-top:15px}.article-tags span{padding:3px 9px;border:1px solid var(--line);border-radius:20px;color:var(--muted);font-size:9px}.article-meta{display:flex;align-items:center;justify-content:space-between;margin-top:20px;color:var(--muted);font-size:11px}.article-meta svg{width:21px;height:21px;color:var(--ink);transition:transform .2s}.article-link:hover .article-meta svg{transform:translate(4px,-4px)}.article-link:hover h3{color:var(--accent)}.article-skeleton{height:440px;border-radius:17px;background:linear-gradient(100deg,#e9ece4 30%,#f6f7f2 48%,#e9ece4 66%);background-size:250% 100%;animation:skeleton 1.35s ease-in-out infinite}.empty-state{grid-column:1/-1;min-height:310px;display:grid;place-items:center;padding:50px;border:1px solid var(--line);border-radius:17px;text-align:center}.empty-state strong{display:block;font-size:23px;font-weight:500}.empty-state p{margin-top:8px;color:var(--muted);font-size:13px}.empty-state button{margin-top:20px;padding:9px 18px;border:1px solid var(--ink);border-radius:25px;background:var(--ink);color:white}.pagination{display:flex;justify-content:center;align-items:center;gap:7px;margin-top:64px}.page-button{display:grid;place-items:center;min-width:44px;height:44px;padding:0 12px;border:1px solid var(--line);border-radius:50%;background:transparent;font:12px "Space Grotesk",sans-serif}.page-button:hover,.page-button[aria-current=page]{border-color:var(--accent);background:var(--accent);color:white}.page-button:disabled{opacity:.35;cursor:default}.page-button:disabled:hover{border-color:var(--line);background:transparent;color:inherit}
.archive-cta{display:flex;align-items:center;justify-content:space-between;gap:40px;margin-bottom:72px;padding:50px;border-radius:24px;background:var(--accent);color:#f3f6e9}.archive-cta .mono{display:block;margin-bottom:11px;color:#d4ddff}.archive-cta h2{font-size:35px;font-weight:500;line-height:1.55;letter-spacing:-.03em}.archive-cta .cta-button{flex-shrink:0;background:#eef4d5;color:var(--ink)}.footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:35px 0 70px;border-top:1px solid var(--line);color:var(--muted);font-size:12px}.footer-links{display:flex;gap:25px}.footer a{display:inline-flex;align-items:center;min-height:44px}
@keyframes orbit-breathe{50%{transform:translateY(-8px) rotate(2deg)}}@keyframes moon-float{50%{transform:translateY(-7px)}}@keyframes skeleton{to{background-position:-150% 0}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}
@media(max-width:1000px){.wrap{width:calc(100% - 64px)}.archive-hero{grid-template-columns:1.1fr .9fr;padding-inline:38px;min-height:575px}.archive-copy h1{font-size:70px}.archive-orbit{width:340px}.hero-foot{left:38px;right:38px}.article-tools{align-items:flex-start;flex-direction:column}.filters{justify-content:flex-start}.articles-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){html{scroll-padding-top:80px}.wrap{width:calc(100% - 40px)}.nav{height:80px}.brand{font-size:18px}.nav-contact{display:none}.menu-toggle{display:flex}.nav-links{display:none;position:absolute;z-index:100;top:70px;left:20px;right:20px;padding:18px;border:1px solid var(--line);background:var(--bg);box-shadow:0 16px 30px #0001;flex-direction:column;align-items:stretch;gap:3px}.nav-links.is-open{display:flex}.nav-links a{padding:12px}.archive-hero{display:block;min-height:805px;padding:28px 22px 0;border-radius:19px}.archive-copy{padding:0}.archive-copy h1{margin-top:28px;font-size:clamp(50px,14vw,70px);line-height:1.05}.hero-lead{margin-top:24px;font-size:20px}.hero-note{font-size:12px}.archive-scene{height:345px;margin-top:9px}.archive-orbit{width:310px}.scene-label{left:7px;top:30px;font-size:8px}.scene-caption{right:0;bottom:23px;font-size:7px}.hero-foot{left:22px;right:22px;padding:14px 0;font-size:8px}.hero-foot span:last-child{display:none}.archive-section{padding:72px 0 78px}.section-heading{align-items:flex-start;flex-direction:column;gap:14px}.section-heading h2{font-size:31px}.section-heading>p{font-size:12px}.article-tools{margin-top:32px;gap:20px}.filters{gap:6px}.filter{padding:7px 14px}.results-bar{padding:21px 0}.articles-grid{grid-template-columns:1fr;gap:40px}.article-visual{height:230px}.pagination{margin-top:48px}.archive-cta{align-items:flex-start;flex-direction:column;padding:34px 26px;margin-bottom:50px}.archive-cta h2{font-size:28px}.footer{align-items:flex-start;flex-direction:column;gap:4px;padding-bottom:55px}}