:root{--bg: #f2f7f5;--bg-soft: #ebf3ef;--surface: rgba(255, 255, 255, .84);--surface-solid: #ffffff;--line: rgba(9, 62, 55, .14);--ink: #102927;--muted: #4f6765;--primary: #0a8a77;--primary-strong: #067764;--accent: #f28b30;--danger: #c0483a;--shadow: 0 22px 48px rgba(15, 64, 59, .12);--radius-lg: 24px;--radius-md: 16px;--radius-sm: 12px}*,*:before,*:after{box-sizing:border-box}html,body,#app{margin:0;min-height:100%}body{color:var(--ink);font-family:Manrope,Noto Sans SC,PingFang SC,sans-serif;background:radial-gradient(circle at 18% 18%,#d8f4e8,#d8f4e800 55%),radial-gradient(circle at 80% 8%,#ffe7d3,#ffe7d300 50%),linear-gradient(150deg,var(--bg) 0%,var(--bg-soft) 100%)}a{color:inherit}.app-shell{position:relative;min-height:100vh;overflow:hidden}.scroll-progress{position:fixed;top:0;left:0;z-index:120;height:3px;width:0;background:linear-gradient(90deg,#0a8a77,#2db6a1 55%,#f3a34e);box-shadow:0 1px 7px #09806d6b;transition:width .12s linear}.ambient{position:fixed;pointer-events:none;z-index:0;border-radius:50%;filter:blur(14px);opacity:.35}.ambient-a{width:360px;height:360px;top:-120px;right:-80px;background:radial-gradient(circle,#28c7a3,#28c7a300 70%);animation:float 11s ease-in-out infinite}.ambient-b{width:280px;height:280px;bottom:14%;left:-80px;background:radial-gradient(circle,#f7a55b,#f7a55b00 70%);animation:float 15s ease-in-out infinite reverse}.ambient-c{width:240px;height:240px;top:42%;right:16%;background:radial-gradient(circle,#8ad0ff,#8ad0ff00 72%);animation:float 13s ease-in-out infinite}.topbar{position:fixed;top:0;left:0;right:0;z-index:60;overflow:visible;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#f7fcf9e6;border-bottom:1px solid var(--line);box-shadow:0 8px 20px #0e3b3614}.topbar-inner{max-width:1160px;margin:0 auto;min-height:72px;padding:.7rem 1.2rem;display:flex;align-items:center;justify-content:space-between;gap:1rem}.brand{display:inline-flex;align-items:center;gap:.7rem;text-decoration:none;font-weight:800;letter-spacing:.02em}.brand-logo{width:34px;height:34px;object-fit:cover;border-radius:8px;border:1px solid rgba(11,31,47,.18);background:#0b111d;padding:2px}.brand-text{font-size:1rem}.desktop-nav{display:flex;align-items:center;gap:.35rem}.nav-link{text-decoration:none;font-size:.92rem;color:var(--muted);padding:.5rem .9rem;border-radius:999px;transition:all .22s ease}.nav-link:hover{color:var(--ink);background:#09726214}.nav-link.is-active{color:var(--surface-solid);background:linear-gradient(120deg,var(--primary) 0%,#1ea58f 100%)}.header-actions{display:flex;align-items:center;gap:.65rem}.quick-action{display:inline-flex;align-items:center;gap:.42rem;font-size:.86rem;text-decoration:none;font-weight:700;color:var(--primary-strong);border:1px solid rgba(6,119,100,.2);background:#06776414;border-radius:999px;padding:.48rem .82rem;cursor:pointer}.quick-action:hover{background:#06776424}.quick-palette span{font-size:.74rem;color:#386e67;font-weight:800;letter-spacing:.02em}.menu-button{border:1px solid var(--line);background:var(--surface-solid);width:42px;height:42px;border-radius:14px;display:none;align-items:center;justify-content:center;flex-direction:column;gap:4px;cursor:pointer}.menu-button span{width:17px;height:2px;background:var(--ink);border-radius:999px}.mobile-nav{position:absolute;top:calc(100% + 1px);left:0;right:0;margin:0;padding:.7rem .9rem .95rem;border-bottom:1px solid var(--line);background:#f8fcfaf7;box-shadow:0 14px 30px #0e3d3724;display:none;grid-template-columns:1fr;gap:.5rem}.mobile-link{text-decoration:none;padding:.75rem .95rem;border-radius:var(--radius-sm);border:1px solid var(--line);background:var(--surface);font-weight:600}.mobile-link.is-active{border-color:#06776459;background:#0677641a}.shell-main{position:relative;z-index:2;max-width:1160px;margin:0 auto;padding:calc(72px + 1.25rem) 1.2rem 3rem}.site-footer{position:relative;z-index:2;border-top:1px solid var(--line);text-align:center;font-size:.88rem;color:var(--muted);padding:1.2rem}.page{display:grid;gap:1rem}.page-intro{border:1px solid var(--line);background:linear-gradient(140deg,#fffffff0,#f0f8f5e0);border-radius:var(--radius-lg);padding:1.8rem 1.6rem;box-shadow:var(--shadow)}.intro-lead{margin-bottom:.95rem}.intro-body{min-width:0}.page-intro.is-side{display:grid;grid-template-columns:auto 1fr;align-items:center;column-gap:1.2rem}.page-intro.is-side .intro-lead{margin:0}.page-intro-eyebrow{margin:0;color:var(--primary-strong);font-size:.78rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase}.page-title{margin:.65rem 0 .45rem;font-size:clamp(1.6rem,3.6vw,2.6rem);line-height:1.14}.page-subtitle{margin:0;max-width:760px;color:var(--muted);font-size:1rem;line-height:1.6}.intro-extra{margin-top:1rem}.hero-actions{margin-top:1.15rem;display:flex;flex-wrap:wrap;gap:.7rem}.btn{text-decoration:none;border-radius:999px;font-weight:700;font-size:.92rem;padding:.66rem 1.08rem;transition:transform .2s ease,box-shadow .2s ease}.btn:hover{transform:translateY(-1px)}.btn-primary{color:var(--surface-solid);background:linear-gradient(120deg,var(--primary) 0%,#16a089 100%);box-shadow:0 10px 22px #08826c40}.btn-secondary{color:var(--primary-strong);background:#0677641a;border:1px solid rgba(6,119,100,.26)}.pill-list{margin:.95rem 0 0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:.55rem}.pill{padding:.32rem .72rem;border-radius:999px;font-size:.82rem;color:#925616;background:#f28b3029;border:1px solid rgba(242,139,48,.25)}.card-panel{border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--surface);box-shadow:var(--shadow);padding:1.25rem}.panel-head h2{margin:0;font-size:1.15rem}.panel-head p{margin:.4rem 0 1rem;color:var(--muted)}.stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.85rem}.stat-card{border-radius:var(--radius-md);background:var(--surface-solid);border:1px solid var(--line);padding:1rem}.stat-label{margin:0;color:var(--muted);font-size:.87rem}.stat-value{display:block;margin-top:.4rem;font-size:1.65rem;color:var(--primary-strong)}.stat-note{margin:.45rem 0 0;color:var(--muted);font-size:.8rem}.feature-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.9rem}.feature-card{text-decoration:none;border:1px solid var(--line);border-radius:var(--radius-md);background:linear-gradient(145deg,#fffffff2,#f5fcf9e6);padding:1.05rem;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}.feature-card:hover{transform:translateY(-2px);box-shadow:0 14px 30px #08494224;border-color:#087a6b47}.feature-title{margin:0;font-size:1.03rem}.feature-text{margin:.52rem 0 0;color:var(--muted);line-height:1.55;font-size:.92rem}.feature-link{display:inline-block;margin-top:.72rem;color:var(--primary-strong);font-weight:700;font-size:.86rem}.toolbar{display:grid;gap:.68rem;margin-bottom:.95rem}.toolbar-sticky{position:sticky;top:calc(72px + .65rem);z-index:30;border:1px solid var(--line);border-radius:var(--radius-sm);padding:.72rem;background:#fcfffef2;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.toolbar-row{display:flex;flex-wrap:wrap;gap:.62rem;align-items:center}.input,.select{border:1px solid var(--line);border-radius:12px;background:var(--surface-solid);color:var(--ink);font-size:.93rem;padding:.58rem .78rem;min-height:40px}.input{flex:1;min-width:220px}.select{min-width:168px}.input:focus,.select:focus{outline:2px solid rgba(10,138,119,.25);border-color:#0a8a7773}.ghost-btn{border:1px solid var(--line);background:var(--surface-solid);color:var(--ink);border-radius:11px;font-size:.86rem;min-height:38px;padding:.44rem .72rem;cursor:pointer}.ghost-btn:hover{border-color:#0a8a7773;color:var(--primary-strong)}.result-meta{margin-left:auto;font-size:.86rem;color:var(--muted)}.segment{display:inline-flex;padding:4px;border-radius:12px;border:1px solid var(--line);background:var(--surface-solid)}.segment-btn{border:none;border-radius:9px;background:transparent;color:var(--muted);font-size:.82rem;font-weight:700;padding:.42rem .62rem;cursor:pointer}.segment-btn.is-active{background:#0a8a7721;color:var(--primary-strong)}.status-message,.error-message{border:1px dashed var(--line);background:var(--surface-solid);border-radius:var(--radius-sm);padding:1rem;text-align:center;color:var(--muted)}.error-message{border-color:#c0483a59;color:var(--danger)}.section-list{display:grid;gap:.7rem}.data-section{border:1px solid var(--line);border-radius:var(--radius-md);background:var(--surface-solid)}.section-head{width:100%;border:none;border-bottom:1px solid var(--line);background:transparent;display:flex;justify-content:space-between;align-items:center;text-align:left;padding:.76rem .9rem;cursor:pointer}.section-title{font-size:.93rem;font-weight:700}.section-count{font-size:.78rem;color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:.16rem .56rem}.command-items,.shortcut-groups{display:grid;gap:.58rem;padding:.72rem}.shortcut-group{display:grid;gap:.5rem}.shortcut-group h3{margin:.35rem 0 0;font-size:.92rem;color:var(--muted)}.command-card{border:1px solid var(--line);border-radius:var(--radius-sm);background:linear-gradient(140deg,#fff,#f8fcfa);padding:.72rem}.command-head{display:flex;justify-content:space-between;align-items:flex-start;gap:.55rem}.command-code{word-break:break-word;font-size:.86rem;line-height:1.56;color:#064c44;font-family:SFMono-Regular,Consolas,Menlo,Monaco,monospace}.copy-btn{border:1px solid rgba(10,138,119,.35);color:var(--primary-strong);background:#0a8a7717;border-radius:10px;min-height:32px;font-size:.78rem;font-weight:700;padding:.28rem .58rem;cursor:pointer;white-space:nowrap}.copy-btn:hover{background:#0a8a7726}.command-desc{margin:.52rem 0 0;color:var(--muted);font-size:.84rem;line-height:1.5}mark{background:#f28b3042;border-radius:4px;padding:0 2px}.site-sections{display:grid;gap:1rem}.site-group{display:grid;gap:.65rem}.site-group-head{display:flex;align-items:baseline;justify-content:space-between}.site-group-head h2{margin:0;font-size:1rem}.site-group-head span{color:var(--muted);font-size:.83rem}.site-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.65rem}.site-card{text-decoration:none;border:1px solid var(--line);border-radius:var(--radius-sm);background:#fff;padding:.75rem}.site-card h3{margin:0;font-size:.93rem;color:#0f6d62}.site-card p{margin:.45rem 0 0;color:var(--muted);font-size:.8rem;word-break:break-all}.site-card:hover{border-color:#0a8a775c;box-shadow:0 10px 20px #0c564c1a}.note-grid{display:grid;gap:.8rem}.note-card{border:1px solid var(--line);border-radius:var(--radius-md);background:var(--surface-solid);padding:.9rem}.note-head{display:flex;justify-content:space-between;gap:.75rem;align-items:flex-start}.note-head h2{margin:0;font-size:1rem}.note-summary{margin:.5rem 0 0;color:var(--muted);font-size:.88rem}.tag-list{margin-top:.62rem;display:flex;flex-wrap:wrap;gap:.46rem}.tag{font-size:.76rem;padding:.22rem .52rem;border-radius:999px;background:#0a8a771c;border:1px solid rgba(10,138,119,.24);color:var(--primary-strong)}.note-items{margin:.72rem 0 0;padding-left:1.1rem;display:grid;gap:.42rem;color:#24403e;font-size:.88rem}.section-title-lg{margin:0 0 .9rem;font-size:1.08rem}.plain-text{margin:.3rem 0;color:var(--muted);line-height:1.58}.plain-text a{color:var(--primary-strong);font-weight:700}.plain-list{margin:0;padding-left:1.15rem;display:grid;gap:.5rem;color:var(--muted)}.channel-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem}.channel-card{border:1px solid var(--line);border-radius:var(--radius-md);padding:.72rem;text-align:center;background:var(--surface-solid)}.channel-card img{width:100%;max-width:120px;height:auto;border-radius:10px}.channel-card p{margin:.5rem 0 0;font-size:.84rem;color:var(--muted)}.reveal-in{animation:rise-in .55s ease both}.slide-down-enter-active,.slide-down-leave-active{transition:all .2s ease}.slide-down-enter-from,.slide-down-leave-to{opacity:0;transform:translateY(-6px)}.fade-enter-active,.fade-leave-active{transition:opacity .18s ease}.fade-enter-from,.fade-leave-to{opacity:0}.back-top{position:fixed;right:1.1rem;bottom:1.1rem;z-index:90;width:42px;height:42px;border:1px solid rgba(7,114,98,.3);border-radius:12px;background:#fffffff0;color:var(--primary-strong);font-size:1.2rem;font-weight:800;cursor:pointer;box-shadow:0 10px 20px #0c423c29}.back-top:hover{transform:translateY(-2px)}.palette-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:140;display:grid;place-items:start center;padding:5.2rem 1rem 1rem;background:#0912187a;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.palette-panel{width:min(940px,100%);max-height:calc(100vh - 7rem);display:grid;grid-template-rows:auto 1fr;border:1px solid rgba(231,240,237,.38);border-radius:var(--radius-lg);background:#fafffdf7;box-shadow:0 22px 44px #071e1c59;overflow:hidden}.palette-head{display:flex;gap:.6rem;padding:.85rem;border-bottom:1px solid var(--line);background:#f6fefaf2}.palette-input{flex:1;border:1px solid rgba(7,113,97,.22);border-radius:12px;min-height:42px;padding:.56rem .82rem;font-size:.94rem;background:#fff}.palette-input:focus{outline:2px solid rgba(10,138,119,.24);border-color:#0a8a7773}.palette-hints{padding:.45rem .9rem .55rem;border-bottom:1px solid var(--line);background:#f3faf7e6;color:var(--muted);font-size:.76rem;letter-spacing:.03em}.palette-body{overflow:auto;padding:.72rem;display:grid;gap:.72rem}.palette-group{border:1px solid var(--line);border-radius:14px;background:#fff;padding:.55rem;display:grid;gap:.42rem}.palette-group h3{margin:.16rem .26rem;font-size:.8rem;color:var(--muted);letter-spacing:.08em;text-transform:uppercase}.palette-item{text-align:left;border:1px solid transparent;border-radius:11px;background:#f8fcfa;padding:.58rem .66rem;cursor:pointer;display:grid;gap:.2rem}.palette-item strong{font-size:.88rem;color:#083630}.palette-item span{font-size:.77rem;color:var(--muted)}.palette-item:hover{border-color:#0a8a7757;background:#0a8a7712}.palette-item.is-active{border-color:#0a8a7773;background:#0a8a771f;box-shadow:inset 0 0 0 1px #0a8a7733}@keyframes rise-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-16px)}}@media(max-width:1024px){.stat-grid,.site-grid,.channel-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:860px){.desktop-nav,.quick-action{display:none}.menu-button{display:inline-flex}.mobile-nav{display:grid}.brand-logo{width:30px;height:30px}.brand-text{font-size:.94rem}}@media(max-width:720px){.shell-main{padding:calc(70px + .95rem) .9rem 2.3rem}.topbar-inner{min-height:68px;padding:.62rem .9rem}.page-intro,.card-panel{padding:1rem;border-radius:18px}.feature-grid,.stat-grid,.site-grid,.channel-grid{grid-template-columns:1fr}.toolbar-row{align-items:stretch}.toolbar-sticky{top:calc(68px + .55rem);padding:.62rem}.result-meta{margin-left:0}.palette-overlay{padding:4.7rem .6rem .8rem}.palette-panel{max-height:calc(100vh - 5.4rem)}.back-top{right:.78rem;bottom:.84rem}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}