*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}a{color:inherit;text-decoration:none}img{max-width:100%;height:auto;display:block}.article-index{width:var(--widXL);margin:0 auto;padding-block:clamp(1.5rem,4vw,2.5rem);@media(max-width:720px){width:min(100% - 16px,1400px)}@media(max-width:480px){width:100%;padding-inline:0}}.article-detail{width:var(--widM);margin:0 auto;padding-top:40px;position:relative;.markdown-content{position:relative}.article-toc-container{margin-bottom:1.5rem}.article-toc-inner{background:var(--secondback);border:1px solid var(--border, #e9ecef);border-radius:var(--radius-xl);overflow:hidden;padding:0;&[open]>.toc-toggle .toc-toggle-icon{transform:rotate(90deg)}}.toc-toggle{display:flex;align-items:center;gap:6px;padding:10px 14px;cursor:pointer;user-select:none;list-style:none;font-size:.7rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted, #6c757d);transition:color .15s;&:hover{color:var(--text-main, #343a40)}&::-webkit-details-marker,&::marker{display:none;content:""}}.toc-toggle-icon{display:flex;align-items:center;justify-content:center;width:16px;height:16px;flex-shrink:0;transition:transform .2s ease;color:inherit}.toc-toggle-label{color:inherit}.toc-nav{padding:0 6px 8px;scrollbar-width:thin;scrollbar-color:rgba(0,0,0,.15) transparent;&::-webkit-scrollbar{width:6px}&::-webkit-scrollbar-track{background:transparent}&::-webkit-scrollbar-thumb{background:#00000026;border-radius:3px;&:hover{background:#00000047}}}.toc{margin:0;padding:0;list-style:none}.toc-item{margin:0}.tocLink{display:block;padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-md);color:var(--text-main);background:none;text-decoration:none;transition:background .12s,color .12s,opacity .12s;line-height:1.45;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;&:hover{background:#0000001a;color:var(--color-accent)}&.isCurrent{color:var(--color-accent);background:rgba(var(--color-accent-rgb, 11, 95, 255),.1);font-weight:700}&.isAfter{color:var(--text-main, #0a0e11);opacity:.55}&.isBefore{color:var(--text-muted, #6c757d);opacity:.55}}.toc-level-2 .tocLink{font-size:.82rem;font-weight:600}.toc-level-3{padding-left:18px;.tocLink{font-size:.78rem;font-weight:500;color:var(--text-muted, #6c757d);&.isCurrent{font-weight:600}&.isAfter{color:var(--text-muted, #6c757d);opacity:.45}}}@media(min-width:1200px){.article-toc-container{position:absolute;top:0;left:calc(100% + 32px);width:240px;height:100%;margin-bottom:0}.article-toc-inner{position:sticky;top:90px;max-height:calc(100vh - 110px);border:none;padding:0 var(--space-sm)}.toc-nav{max-height:calc(100vh - 160px);overflow-y:auto;padding:0}.toc-toggle{padding:15px 10px}}}.article-hero{display:block;position:relative;height:50vh;min-height:340px;max-height:600px;overflow:hidden;margin-bottom:clamp(1.5rem,3vw,2.5rem);cursor:pointer;text-decoration:none;color:var(--text-main);&[hidden]{display:none}&:hover{.article-hero__img{transform:scale(1.03)}}}.article-hero__media{position:absolute;inset:0}.article-hero__img{width:100%;height:100%;object-fit:cover;object-position:center 35%;transition:transform .6s cubic-bezier(.2,1,.3,1)}.article-hero__placeholder{width:100%;height:100%;background:var(--bg-surface)}.article-hero__overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(33,37,41,.8) 0%,transparent 60%);pointer-events:none;backdrop-filter:blur(20px);mask-image:linear-gradient(to top,#000 15%,#0000 50%);mask-composite:intersect;@media(min-width:767px){mask-image:radial-gradient(at 100% 70%,#000 20%,#0000 70%)}}.article-hero__content{position:absolute;bottom:0;right:0;left:0;width:100%;margin:0 auto;padding:32px clamp(24px,4vw,40px);display:grid;gap:var(--space-sm);align-content:end;text-align:left;@media(min-width:767px){width:min(100% - 24px,500px);height:100%;align-content:center;padding:0;right:max(20px,(100vw - 1400px)/2);left:auto}}.article-hero__category{display:inline-flex;align-items:center;width:fit-content;padding:4px 10px;border-radius:var(--radius-max);background:#fff3;outline:1px solid rgba(255,255,255,.3);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);font-size:.75rem;font-weight:700;letter-spacing:.05em;color:var(--white)}.article-hero__title{font-size:clamp(1.4rem,3.5vw,2.2rem);font-weight:800;line-height:1.25;color:var(--white);text-shadow:0 2px 12px rgba(0,0,0,.3)}.article-hero__summary{font-size:clamp(.82rem,1.5vw,.95rem);line-height:1.6;color:#ffffffd9;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.article-hero__footer{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-md);margin-top:var(--space-xs)}.article-hero__meta{display:flex;align-items:center;gap:var(--space-sm);flex-wrap:wrap;font-size:.8rem;color:#ffffffb3;.date-relative{color:#ffffffb3}}.article-hero__tags{display:flex;gap:6px}.article-hero__tag{font-size:.75rem;color:#fff9}.article-hero__readmore{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;border-radius:var(--radius-max);background:#ffffff26;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:var(--white);font-size:.9rem;font-weight:700;transition:all .3s ease;flex-shrink:0;.material-symbols-outlined{font-size:1.2rem;transition:transform .3s ease}}.article-hero:hover .article-hero__readmore{background:#ffffff40;.material-symbols-outlined{transform:translate(4px)}}@media(max-width:480px){.article-hero{height:45vh;min-height:280px}.article-hero__content{padding:20px 16px}.article-hero__summary{display:none}.article-hero__readmore{padding:6px 12px;font-size:.8rem;.material-symbols-outlined{font-size:1rem}}}.article-toolbar{margin-bottom:clamp(1.25rem,3vw,2rem);@media(max-width:480px){padding-inline:12px}}.article-searchBar{display:flex;align-items:center;background:var(--bg-surface);border-radius:var(--radius-max);box-shadow:var(--shadow-md);overflow:hidden;transition:box-shadow var(--transition-fast);width:min(300px,100%);margin:0 0 0 auto;transition:.2s;&:focus-within{box-shadow:0 0 0 2px rgba(var(--color-theme-rgb),.5),var(--shadow-md)}@media(max-width:480px){width:100%}}.article-searchBar__icon{display:flex;align-items:center;justify-content:center;padding-left:16px;color:var(--text-muted);font-size:22px;pointer-events:none;flex-shrink:0}.article-searchBar__input{flex:1;min-width:0;min-height:48px;padding:0 12px;border:none;outline:none;background:transparent;color:var(--text-main);font:inherit;font-size:.95rem;&::placeholder{color:var(--text-muted);opacity:.6}&::-webkit-search-cancel-button{-webkit-appearance:none}}.article-searchBar__sep{width:1px;height:24px;background:#0000001a;flex-shrink:0}.article-searchBar__filter{display:flex;align-items:center;justify-content:center;width:44px;height:44px;margin:2px;cursor:pointer;color:var(--text-muted);transition:color var(--transition-fast),background var(--transition-fast);flex-shrink:0;border-radius:var(--radius-max);user-select:none;.material-symbols-outlined{font-size:22px}&:hover{color:var(--color-theme);background:rgba(var(--color-theme-rgb),.06)}}.article-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:24px 16px;@media(max-width:720px){grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px 12px}@media(max-width:480px){grid-template-columns:1fr;gap:30px 0}}@media(max-width:400px){.article-list{grid-template-columns:1fr;gap:20px 0}}.article-card{padding:2px;border-radius:var(--radius-lg);outline:0px solid #0000;outline-offset:-1px;height:fit-content;z-index:1;transition:.2s;cursor:pointer;&:hover{transform:scale(1.05);z-index:2;outline:10px solid var(--secondback);background:var(--secondback);filter:drop-shadow(5px 5px 10px #0004);.article-card__thumb img{transform:scale(1.04)}}@media(max-width:480px){padding:0;border-radius:0;&:hover{transform:scale(1);z-index:2;outline:0px solid var(--secondback);background:var(--secondback);filter:drop-shadow(0px 0px 0px #0000)}}}.article-card__thumb{display:block;position:relative;aspect-ratio:16 / 9;overflow:hidden;border-radius:var(--radius-lg);transition:.2s all;img{width:100%;height:100%;object-fit:cover;transition:transform .4s cubic-bezier(.2,1,.3,1)}@media(max-width:480px){border-radius:0}&.no-thumb{display:flex;align-items:center;justify-content:center;&:after{content:attr(data-category);font-size:.85rem;font-weight:700;color:#ffffffd9;letter-spacing:.06em;text-transform:uppercase}}&.no-thumb[data-category-hue="0"]{background:linear-gradient(135deg,#85a3e0,#66c)}&.no-thumb[data-category-hue="1"]{background:linear-gradient(135deg,#6ca,#46b9b9)}&.no-thumb[data-category-hue="2"]{background:linear-gradient(135deg,#e4a667,#d15e47)}&.no-thumb[data-category-hue="3"]{background:linear-gradient(135deg,#b579d2,#c059c0)}&.no-thumb[data-category-hue="4"]{background:linear-gradient(135deg,#dbc557,#c69739)}}.article-card__body{transition:.2s all;@media(max-width:480px){padding:0 12px}}.article-card__meta{display:flex;justify-content:space-between;align-items:center;gap:var(--space-sm);font-size:.8rem;color:var(--text-muted);line-height:1.4;margin-top:6px}.article-card__category{display:inline-flex;align-items:center;color:var(--color-theme);font-size:.72rem;font-weight:700;letter-spacing:.03em;white-space:nowrap}.article-card h2{margin:0;font-size:.95rem;font-weight:700;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;a{color:inherit;&:hover{text-decoration:none}}}.article-card__tags{display:flex;flex-wrap:wrap;gap:4px;margin:0}.article-card__tag{font-size:.72rem;color:var(--text-muted);white-space:nowrap;&:before{content:"#";opacity:.5}}.article-empty{margin:2rem 0;padding:1.5rem;border-radius:var(--radius-md);background:rgba(var(--color-theme-rgb),.04);color:var(--text-muted);text-align:center;font-size:.95rem}.article-modalToggle{display:none}.article-modalLayer{position:fixed;inset:0;z-index:999;pointer-events:none}.article-modalBackdrop{position:absolute;inset:0;background:#0000;backdrop-filter:blur(0px);-webkit-backdrop-filter:blur(0px);cursor:pointer;transition:background .25s ease,backdrop-filter .25s ease,-webkit-backdrop-filter .25s ease}.article-modalCenter{width:100%;height:100%;display:flex;align-items:center;justify-content:center;padding:20px}.article-modalPanel{position:relative;z-index:1;width:min(100% - 24px,480px);max-height:90svh;overflow:auto;padding:28px;border-radius:var(--radius-lg);background:#fffffff5;box-shadow:var(--shadow-md);opacity:0;transform:scale(.96) translateY(8px);transition:opacity .25s ease,transform .3s cubic-bezier(.2,1,.3,1)}.article-modalTitle{margin:0 0 24px;color:var(--text-main);font-size:1.15rem;font-weight:800}.article-modalCloseIcon{position:absolute;top:24px;right:24px;cursor:pointer;color:var(--text-muted);transition:color .2s;&:hover{color:var(--text-main)}}.article-modalGrid{display:grid;gap:var(--space-md)}.article-modalRow{display:grid;gap:6px}.article-fieldLabel{color:var(--text-main);font-size:.85rem;font-weight:700}.article-modalCustomDate{display:flex;align-items:center;gap:var(--space-sm);margin-top:var(--space-xs);padding:12px 16px;border-radius:var(--radius-md);background:var(--bg-body);border:1px solid var(--border);flex-wrap:wrap;&[hidden]{display:none!important}}.article-dateLabel{display:flex;flex-direction:column;gap:4px;font-size:.8rem;font-weight:700;color:var(--text-muted)}.article-dateSep{color:var(--text-muted);font-weight:700;margin-top:var(--space-md)}.article-dateInput{min-height:38px;padding:0 12px;border-radius:var(--radius-md);border:1px solid var(--border);font-family:inherit;font-size:.9rem;color:var(--text-main);background:#fff;outline:none;&:focus-visible{border-color:rgba(var(--color-theme-rgb),.5);box-shadow:0 0 0 2px rgba(var(--color-theme-rgb),.18)}}.article-chipGrid{display:flex;flex-wrap:wrap;gap:6px}.article-chip{position:relative;cursor:pointer;input{position:absolute;inset:0;opacity:0;pointer-events:none}.chip-content{display:inline-flex;align-items:center;gap:4px;min-height:36px;padding:0 16px;border-radius:var(--radius-max);background:var(--bg-body);color:var(--text-main);font-size:.85rem;font-weight:600;border:1px solid var(--border);transition:all var(--transition-fast);user-select:none}.check-icon{font-size:1.1rem;margin-left:-4px;display:none}input:checked+.chip-content{background:rgba(var(--color-theme-rgb),.1);color:var(--color-theme);border-color:rgba(var(--color-theme-rgb),.3);.check-icon{display:inline-block}}input:focus-visible+.chip-content{box-shadow:0 0 0 2px rgba(var(--color-theme-rgb),.18)}}.article-modalActions{display:flex;justify-content:space-between;align-items:center;gap:var(--space-sm);margin-top:var(--space-lg);border-top:1px solid var(--border);padding-top:var(--space-md)}.article-actionButton,.article-closeButton{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 20px;border-radius:var(--radius-max);border:none;outline:none;font:inherit;font-size:.88rem;font-weight:700;cursor:pointer;transition:all var(--transition-fast);user-select:none}.article-actionButton{background:var(--color-theme);color:var(--text-main);&:hover{filter:brightness(1.1)}&:focus-visible{box-shadow:0 0 0 3px rgba(var(--color-theme-rgb),.25)}}.article-closeButton{background:var(--bg-body);color:var(--text-main);&:hover{background:#e8ecf3}&:focus-visible{box-shadow:0 0 0 3px #00000014}}body:has(.article-modalToggle:checked){overflow:hidden}.article-modalToggle:checked~.article-modalLayer{pointer-events:auto}.article-modalToggle:checked~.article-modalLayer .article-modalBackdrop{background:#000a1e33;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.article-modalToggle:checked~.article-modalLayer .article-modalPanel{opacity:1;transform:scale(1) translateY(0)}.article-detailHeader{display:flex;flex-direction:column;gap:var(--space-sm);margin-bottom:var(--space-md);.article-meta-top{display:flex;align-items:center;gap:var(--space-sm)}.article-category{color:var(--color-theme);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);letter-spacing:.05em}.article-date{display:flex;flex-wrap:wrap;gap:var(--space-sm);margin:0;font-size:var(--font-size-sm);color:var(--text-muted)}h1{margin:0;line-height:var(--line-height-tight);font-size:2.5rem;font-weight:var(--font-weight-bold)}.article-summary{margin:0;color:var(--text-muted);line-height:var(--line-height-relaxed);font-size:var(--font-size-lg)}.article-tags{display:flex;flex-wrap:wrap;gap:var(--space-sm);padding:0;list-style:none;margin-top:var(--space-sm);li{display:inline-flex}.article-tag{color:var(--text-muted);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);transition:color var(--transition-fast);&:hover{color:var(--color-theme)}}}}.article-page-header h1{margin:0;line-height:1.1}.article-eyebrow{margin:0;color:var(--color-theme);font-size:.875rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.article-lead,.article-summary-detail{margin:0;color:var(--text-muted);line-height:1.8}.article-cardMeta{display:flex;flex-wrap:wrap;gap:.5rem;margin:0;font-size:.9rem;color:var(--text-muted)}.article-detailThumb{width:100%;aspect-ratio:16 / 9;border-radius:var(--radius-xl);overflow:hidden;margin-bottom:2.5rem;box-shadow:var(--shadow-md);img{width:100%;height:100%;object-fit:cover;display:block}}::view-transition-image-pair(root){isolation:auto}::view-transition-old(root),::view-transition-new(root){animation-duration:.35s}::view-transition-group(*){animation-timing-function:cubic-bezier(.8,0,.4,1.1);animation-duration:.5s}::view-transition-group(root){animation-timing-function:ease-in-out;animation-duration:.35s}[style*="view-transition-name: article-thumb"]{will-change:transform,width,height}[style*="view-transition-name: article-title"]{will-change:transform,opacity}[style*="view-transition-name: article-category"],[style*="view-transition-name: article-date"]{will-change:transform,opacity;display:inline-block;contain:layout;width:max-content}.dynamic-date{display:inline-grid}.date-relative,.date-exact{grid-area:1 / 1;transition:opacity .4s ease,filter .4s ease}.date-exact{opacity:0;filter:blur(4px);pointer-events:none}.date-relative{opacity:1;filter:blur(0);color:var(--text-muted)}.article-hero:hover .date-exact,.article-card:hover .date-exact,.dynamic-date:hover .date-exact{opacity:1;filter:blur(0)}.article-hero:hover .date-relative,.article-card:hover .date-relative,.dynamic-date:hover .date-relative{opacity:0;filter:blur(4px)}
