/* roulang page: index */
:root{--paper:#f5f0ea;--ink:#3d2935;--muted:#75666c;--apricot:#ce7b50;--rose:#b97782;--sage:#8e9b85;--line:#d9c9c4;--cream:#fffaf5}
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;color:var(--ink);background:var(--paper);font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC",sans-serif;line-height:1.7;overflow-x:hidden}
    body.menu-open{overflow:hidden}
    body:before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.4;background-image:radial-gradient(rgba(61,41,53,.09) .65px,transparent .7px),linear-gradient(90deg,transparent 0,transparent 49.8%,rgba(61,41,53,.025) 50%,transparent 50.2%);background-size:8px 8px,120px 120px}
    a{text-decoration:none;color:inherit}
    button,input,select{font:inherit}
    button{cursor:pointer}
    :focus-visible{outline:3px solid var(--apricot);outline-offset:3px}
    .page-shell{max-width:1240px;margin:0 auto;padding:0 24px}
    .nav-shell{position:sticky;top:0;z-index:50;border-bottom:1px solid rgba(61,41,53,.12);background:rgba(245,240,234,.94);backdrop-filter:blur(12px)}
    .brand-mark{width:32px;height:32px;border:1px solid rgba(61,41,53,.52);border-radius:10px 16px 10px 10px;display:grid;place-items:center;color:var(--apricot);font-weight:800;font-size:12px;box-shadow:inset 0 0 0 4px rgba(206,123,80,.08)}
    .timeline:before{content:"";position:absolute;left:10px;right:10px;top:50%;height:1px;background:#d7c5bf;z-index:-1}
    .chip{border:1px solid var(--line);border-radius:999px;padding:4px 10px;font-size:12px;line-height:1.2;background:var(--paper);white-space:nowrap;transition:.2s ease}
    .chip:hover,.chip.active{border-color:var(--apricot);background:var(--apricot);color:#fffaf5}
    .clip-card{position:relative;overflow:hidden}
    .clip-card:after{content:"";position:absolute;right:0;top:0;width:30px;height:30px;border-left:1px solid rgba(61,41,53,.18);border-bottom:1px solid rgba(61,41,53,.18);border-radius:0 0 0 15px;background:rgba(245,240,234,.55)}
    .archive-cover{background:linear-gradient(135deg,rgba(206,123,80,.22),rgba(185,119,130,.12) 48%,rgba(142,155,133,.24)),repeating-linear-gradient(90deg,transparent 0,transparent 18px,rgba(61,41,53,.055) 19px,transparent 20px);position:relative;overflow:hidden}
    .archive-cover:after{content:"";position:absolute;width:130px;height:130px;border:1px solid rgba(61,41,53,.24);border-radius:50%;right:-34px;bottom:-54px;box-shadow:0 0 0 13px rgba(255,250,245,.3),0 0 0 26px rgba(61,41,53,.06)}
    .archive-card{border:1px solid rgba(61,41,53,.16);background:rgba(255,250,245,.76);box-shadow:0 10px 24px rgba(61,41,53,.06);transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
    .archive-card:hover{transform:translateY(-4px);border-color:var(--apricot);box-shadow:0 18px 32px rgba(61,41,53,.12)}
    .archive-card:hover .cover-zoom{transform:scale(1.04)}
    .cover-zoom{transition:transform .35s ease}
    .stamp{border:1px solid currentColor;border-radius:999px;padding:3px 9px;letter-spacing:.08em;font-size:11px;font-weight:700;white-space:nowrap}
    .section-line{height:1px;background:linear-gradient(90deg,transparent,rgba(61,41,53,.22),transparent)}
    .faq-answer{display:none}
    .faq-item.open .faq-answer{display:block}
    .faq-item.open .faq-plus{transform:rotate(45deg)}
    .faq-plus{transition:transform .2s ease}
    .mobile-panel{transform:translateX(100%);transition:transform .28s ease}
    .mobile-panel.open{transform:translateX(0)}
    .veil{opacity:0;visibility:hidden;transition:.25s ease}
    .veil.show{opacity:1;visibility:visible}
    .disabled-btn:disabled{opacity:.48;cursor:not-allowed;transform:none}
    .progress-line{background:linear-gradient(90deg,var(--sage) 0 36%,var(--apricot) 36% 72%,#cabfc0 72%)}
    @media (prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}.archive-card:hover{transform:none}}
    @media(max-width:767px){.page-shell{padding:0 18px}.timeline{overflow-x:auto;padding-bottom:4px}.timeline:before{display:none}.mobile-panel{width:min(86vw,360px)}}

/* roulang page: category1 */
:root{--paper:#f5f0ea;--ink:#3d2935;--muted:#75666c;--apricot:#ce7b50;--rose:#b97782;--sage:#8e9b85;--line:#d9c9c4;--cream:#fffaf5}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--paper);font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC",sans-serif;line-height:1.7;overflow-x:hidden}body.menu-open{overflow:hidden}body:before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.4;background-image:radial-gradient(rgba(61,41,53,.09) .65px,transparent .7px),linear-gradient(90deg,transparent 0,transparent 49.8%,rgba(61,41,53,.025) 50%,transparent 50.2%);background-size:8px 8px,120px 120px}a{text-decoration:none;color:inherit}button,input,select{font:inherit}button{cursor:pointer}.page-shell{width:min(100% - 48px,1200px);margin:auto}.nav-shell{position:sticky;top:0;z-index:50;border-bottom:1px solid rgba(61,41,53,.12);background:rgba(245,240,234,.94);backdrop-filter:blur(12px)}.brand-mark{width:32px;height:32px;border:1px solid rgba(61,41,53,.52);border-radius:10px 16px 10px 10px;display:grid;place-items:center;color:var(--apricot);font-weight:800;font-size:12px;box-shadow:inset 0 0 0 4px rgba(206,123,80,.08)}.chip{border:1px solid var(--line);border-radius:999px;padding:4px 10px;font-size:12px;line-height:1.2;background:var(--paper);white-space:nowrap;transition:.2s ease}.chip:hover,.chip.active{border-color:var(--apricot);background:var(--apricot);color:#fffaf5}.clip-card{position:relative;overflow:hidden}.clip-card:after{content:"";position:absolute;right:0;top:0;width:30px;height:30px;border-left:1px solid rgba(61,41,53,.18);border-bottom:1px solid rgba(61,41,53,.18);border-radius:0 0 0 15px;background:rgba(245,240,234,.55)}.archive-card{border:1px solid rgba(61,41,53,.16);background:rgba(255,250,245,.76);box-shadow:0 10px 24px rgba(61,41,53,.06);transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}.archive-card:hover{transform:translateY(-4px);border-color:var(--apricot);box-shadow:0 18px 32px rgba(61,41,53,.12)}.archive-card:hover .cover-zoom{transform:scale(1.04)}.section-line{height:1px;background:linear-gradient(90deg,transparent,rgba(61,41,53,.22),transparent)}.faq-answer{display:none}.faq-item.open .faq-answer{display:block}.faq-item.open .faq-plus{transform:rotate(45deg)}.faq-plus{transition:transform .2s ease}.mobile-panel{transform:translateX(100%);transition:transform .28s ease}.mobile-panel.open{transform:translateX(0)}.disabled-btn:disabled{opacity:.48;cursor:not-allowed;transform:none}.catalog-cover{background:linear-gradient(145deg,rgba(206,123,80,.22),rgba(185,119,130,.08)),repeating-linear-gradient(90deg,transparent 0 14px,rgba(61,41,53,.06) 14px 15px)}.filter-button{border:1px solid rgba(61,41,53,.18);border-radius:999px;padding:8px 13px;font-size:13px;font-weight:600;transition:.2s}.filter-button:hover,.filter-button.active{background:var(--ink);border-color:var(--ink);color:var(--cream)}.catalog-item.hidden{display:none}.catalog-item{min-height:100%}.status-dot{width:8px;height:8px;border-radius:50%;display:inline-block;background:var(--sage)}.status-dot.orange{background:var(--apricot)}.status-dot.rose{background:var(--rose)}.cover-art{height:126px;background-color:#eee3dc;background-image:linear-gradient(135deg,transparent 45%,rgba(61,41,53,.11) 45% 48%,transparent 48%),radial-gradient(circle at 78% 30%,rgba(206,123,80,.42) 0 13px,transparent 14px),linear-gradient(90deg,rgba(61,41,53,.08) 1px,transparent 1px);background-size:auto,auto,18px 18px;transition:transform .25s ease}.mobile-panel{width:min(86vw,360px)}:focus-visible{outline:3px solid rgba(206,123,80,.75);outline-offset:3px}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}.archive-card:hover{transform:none}}@media(max-width:767px){.page-shell{width:min(100% - 36px,1200px)}.timeline{overflow-x:auto;padding-bottom:4px}.timeline:before{display:none}.mobile-panel{width:min(86vw,360px)}}@media(max-width:520px){.filter-row{overflow-x:auto;padding-bottom:6px;scroll-snap-type:x proximity}.filter-button{white-space:nowrap;scroll-snap-align:start}}

/* roulang page: category2 */
:root{--paper:#f5f0ea;--ink:#3d2935;--muted:#75666c;--apricot:#ce7b50;--rose:#b97782;--sage:#8e9b85;--line:#d9c9c4;--cream:#fffaf5}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);background:var(--paper);font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC",sans-serif;line-height:1.7;overflow-x:hidden}
body.menu-open{overflow:hidden}
body:before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.4;background-image:radial-gradient(rgba(61,41,53,.09) .65px,transparent .7px),linear-gradient(90deg,transparent 0,transparent 49.8%,rgba(61,41,53,.025) 50%,transparent 50.2%);background-size:8px 8px,120px 120px}
a{text-decoration:none;color:inherit}
button,input,select{font:inherit}
button{cursor:pointer}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid rgba(206,123,80,.72);outline-offset:3px}
.nav-shell{position:sticky;top:0;z-index:50;border-bottom:1px solid rgba(61,41,53,.12);background:rgba(245,240,234,.94);backdrop-filter:blur(12px)}
.page-shell{width:min(100% - 48px,1220px);margin:0 auto}
.brand-mark{width:32px;height:32px;border:1px solid rgba(61,41,53,.52);border-radius:10px 16px 10px 10px;display:grid;place-items:center;color:var(--apricot);font-weight:800;font-size:12px;box-shadow:inset 0 0 0 4px rgba(206,123,80,.08)}
.chip{border:1px solid var(--line);border-radius:999px;padding:4px 10px;font-size:12px;line-height:1.2;background:var(--paper);white-space:nowrap;transition:.2s ease}
.chip:hover,.chip.active{border-color:var(--apricot);background:var(--apricot);color:#fffaf5}
.chip-replay{background:#e8e2dc;border-color:#d5cbc3}
.clip-card{position:relative;overflow:hidden}
.clip-card:after{content:"";position:absolute;right:0;top:0;width:30px;height:30px;border-left:1px solid rgba(61,41,53,.18);border-bottom:1px solid rgba(61,41,53,.18);border-radius:0 0 0 15px;background:rgba(245,240,234,.55)}
.archive-card{border:1px solid rgba(61,41,53,.16);background:rgba(255,250,245,.76);box-shadow:0 10px 24px rgba(61,41,53,.06);transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
.archive-card:hover{transform:translateY(-4px);border-color:var(--apricot);box-shadow:0 18px 32px rgba(61,41,53,.12)}
.archive-card:hover .cover-zoom{transform:scale(1.04)}
.section-line{height:1px;background:linear-gradient(90deg,transparent,rgba(61,41,53,.22),transparent)}
.faq-answer{display:none}
.faq-item.open .faq-answer{display:block}
.faq-item.open .faq-plus{transform:rotate(45deg)}
.faq-plus{transition:transform .2s ease}
.mobile-panel{transform:translateX(100%);transition:transform .28s ease}
.mobile-panel.open{transform:translateX(0)}
.disabled-btn:disabled{opacity:.48;cursor:not-allowed;transform:none}
.timeline-wall{position:relative}
.timeline-wall:before{content:"";position:absolute;left:146px;top:28px;bottom:30px;width:1px;background:linear-gradient(var(--line),rgba(217,201,196,.2))}
.stage-marker{position:relative}
.stage-marker:after{content:"";position:absolute;right:-18px;top:24px;width:11px;height:11px;border:3px solid var(--paper);border-radius:50%;background:var(--sage);box-shadow:0 0 0 1px rgba(61,41,53,.22)}
.stage-active:after{background:var(--apricot)}
.stage-replay:after{background:var(--rose)}
.envelope{background:linear-gradient(135deg,rgba(206,123,80,.2),rgba(185,119,130,.14));position:relative}
.envelope:before{content:"";position:absolute;inset:17% 12%;border:1px solid rgba(61,41,53,.24);border-radius:14px 22px 14px 14px;background:repeating-linear-gradient(135deg,rgba(255,250,245,.66) 0 8px,rgba(61,41,53,.035) 8px 10px)}
.envelope:after{content:"";position:absolute;right:14%;top:15%;width:44px;height:44px;border:1px solid rgba(61,41,53,.32);border-radius:50%;background:var(--paper);box-shadow:inset 0 0 0 7px rgba(206,123,80,.12)}
.update-row{transition:background .2s ease,border-color .2s ease}
.update-row:hover{background:rgba(206,123,80,.07);border-color:rgba(206,123,80,.55)}
.form-note{min-height:24px}
.mobile-panel{width:min(86vw,360px)}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}.archive-card:hover{transform:none}}
@media(max-width:767px){.page-shell{width:min(100% - 36px,1220px)}.timeline{overflow-x:auto;padding-bottom:4px}.timeline-wall:before{left:16px}.stage-marker{padding-left:38px}.stage-marker:after{left:11px;right:auto}.mobile-panel{width:min(86vw,360px)}}