:root{--font-body:"Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;--font-heading:"Trebuchet MS", "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;--font-mono:"Cascadia Mono", "Consolas", "SFMono-Regular", "Menlo", monospace;--ink:#1f2933;--muted:#52606d;--line:#1f293324;font-family:var(--font-body);color:var(--ink);text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#edf0eb;line-height:1.45}*{box-sizing:border-box}body{background:radial-gradient(circle at 8% 14%,#d46a1f2e,#0000 26%),radial-gradient(circle at 82% 16%,#0d7b7633,#0000 28%),linear-gradient(#eef2ea 0%,#f8f9f6 50%,#eef0ea 100%);min-height:100vh;margin:0}#app{width:min(1100px,100% - 2.2rem);margin:1.2rem auto 2.4rem}.use-case-shell{gap:1rem;display:grid}.site-footer{justify-content:flex-start;display:flex}.site-footer p{margin:0}.footer-stack{gap:.4rem;display:grid}.footer-nav{flex-wrap:wrap;gap:.85rem;display:flex}.footer-nav a{color:#0b5f5b;font-size:.92rem;font-weight:700;text-decoration:none}.footer-nav a:hover{text-decoration:underline}.use-case-header{border:1px solid var(--line);background:#fffffff2;border-radius:16px;padding:1rem 1.1rem;box-shadow:0 10px 24px #1f293314}.breadcrumb{color:#52606d;flex-wrap:wrap;align-items:center;gap:.38rem;font-size:.84rem;font-weight:700;display:flex}.breadcrumb a{color:#0b5f5b;text-decoration:none}.breadcrumb a:hover{text-decoration:underline}.footer-link{color:#0b5f5b;font-size:.92rem;font-weight:700;text-decoration:none}.footer-link:hover{text-decoration:underline}.use-case-header h1{font-family:var(--font-heading);margin:.45rem 0 0;font-size:clamp(1.5rem,2.8vw,2.2rem)}.use-case-header p{color:var(--muted);margin:.56rem 0 0}.helper-row{flex-wrap:wrap;gap:.5rem;margin-top:.78rem;display:flex}.chip{color:#2c3d4a;background:#fff;border:1px solid #1f293333;border-radius:999px;padding:.28rem .62rem;font-size:.78rem;font-weight:700}button.chip{cursor:pointer;font-family:inherit}.collection-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.82rem;display:grid}.collection-list{gap:.82rem;display:grid}.collection-card{border:1px solid var(--line);background:#fffffff5;border-radius:14px;gap:.58rem;padding:.82rem;display:grid;box-shadow:0 8px 22px #1f29330f}.collection-card h2{font-size:1.02rem;font-family:var(--font-heading);margin:0}.collection-card p{color:#4f5d6a;margin:0;font-size:.84rem}.palette-card{border:1px solid var(--line);background:#fffffff5;border-radius:14px;gap:.6rem;padding:.82rem;display:grid;box-shadow:0 8px 22px #1f29330f}.palette-card h2{font-size:1rem;font-family:var(--font-heading);margin:0}.palette-card p{color:#4f5d6a;margin:0;font-size:.84rem}.palette-strip{grid-template-columns:repeat(5,minmax(0,1fr));gap:.34rem;display:grid}.palette-tone{background:var(--tone);border:1px solid #1f293324;border-radius:10px;min-height:58px;position:relative}.palette-tone code{color:#fff;background:#0f1720b3;border-radius:999px;padding:.1rem .35rem;font-size:.66rem;position:absolute;bottom:.32rem;left:.32rem}.palette-actions{justify-content:space-between;align-items:center;gap:.6rem;display:flex}.palette-id{color:#4f5d6a;font-size:.76rem;font-weight:700}.open-btn{color:#1f2933;white-space:nowrap;background:#fff;border:1px solid #1f293333;border-radius:999px;padding:.36rem .78rem;font-size:.8rem;font-weight:700;text-decoration:none}.open-btn:hover{border-color:#1f293373}.use-case-footer{border:1px solid var(--line);background:#fffffff0;border-radius:14px;padding:.9rem}.use-case-footer h2{font-size:1.02rem;font-family:var(--font-heading);margin:0}.use-case-footer p{color:#4f5d6a;margin:.5rem 0 0;font-size:.88rem}.related-collections{margin-top:.75rem}.related-collections h2{font-size:.96rem;font-family:var(--font-heading);margin:0}.related-link-row{flex-wrap:wrap;gap:.45rem;margin-top:.5rem;display:flex}.related-link{color:#1f2933;background:#fff;border:1px solid #1f293333;border-radius:999px;padding:.32rem .72rem;font-size:.78rem;font-weight:700;text-decoration:none}.related-link:hover{border-color:#1f293373}@media (width<=900px){.collection-grid{grid-template-columns:1fr}}
