:root{font-family:Inter,"Microsoft YaHei",sans-serif;color:#102a50;background:#edf2f7;font-synthesis:none}*{box-sizing:border-box}body{margin:0}a{color:#176cdf;text-decoration:none}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #ffbd6b;outline-offset:3px}header{height:80px;display:flex;align-items:center;justify-content:space-between;padding:0 32px;background:white;border-bottom:1px solid #e0e8f1;position:sticky;top:0;z-index:3}.brand{display:flex;align-items:center;gap:12px;color:#102a50;font-size:21px;font-weight:800}.brandmark{display:grid;place-items:center;background:#1678ff;color:white;width:42px;height:42px;border-radius:14px;font-size:22px}.brand small{display:block;font-size:10px;letter-spacing:1.3px;color:#7c8ba1;margin-top:3px}.top-actions{display:flex;align-items:center;gap:24px;font-size:12px}.edition{background:#eaf3ff;color:#3579cb;padding:9px 13px;border-radius:20px}.workspace{display:grid;grid-template-columns:232px minmax(440px,1fr) 270px;min-height:calc(100vh - 80px)}aside{background:#fff}.themes{padding:30px 24px;border-right:1px solid #dfe7f0;position:sticky;top:80px;height:calc(100vh - 80px);overflow:auto}.eyebrow{font-size:9px;color:#8c9cb1;letter-spacing:1.3px;font-weight:700}.themes h1{font-size:28px;line-height:1.5;margin:14px 0}.themes p{font-size:12px;line-height:1.9;color:#7e8ea4}nav{margin-top:24px;display:grid;gap:5px}nav button{border:0;background:transparent;padding:11px 12px;border-radius:11px;text-align:left;color:#556e8d;font-size:13px;display:flex;justify-content:space-between}nav button span{font-size:10px;opacity:.6}nav button.active{background:#e9f2ff;color:#1267da;font-weight:700}.scope{border-top:1px solid #e5ecf4;padding-top:20px;margin-top:24px;font-size:11px;color:#8394a9;line-height:1.9}.prototype-link{font-size:11px;display:block;margin-top:16px}main{padding:28px 32px;min-width:0}.collection{display:flex;align-items:center;justify-content:space-between;gap:14px}.collection h2{margin:8px 0 0;font-size:24px}.views{display:flex;padding:3px;background:#e0e7f0;border-radius:10px;flex-shrink:0}.views button{border:0;background:transparent;padding:8px 10px;color:#75859c;border-radius:8px;font-size:11px}.views .active{background:white;color:#176cdf;box-shadow:0 1px 4px #284b7810}#tabs{display:flex;flex-wrap:wrap;gap:6px;margin:24px 0}#tabs button{padding:8px 11px;border:1px solid #d7e2ef;background:transparent;border-radius:8px;color:#66809f;font-size:11px}#tabs button.active{background:#102a50;border-color:#102a50;color:#fff}#stage{display:flex;justify-content:center;align-items:flex-start;gap:24px;padding:4px 0 24px}.phone-figure{margin:0;position:relative;width:390px;max-width:100%}.phone-figure img{width:100%;display:block;box-shadow:0 16px 44px #223d5a17;border-radius:23px}.phone-figure figcaption{font-size:11px;color:#7589a3;margin:15px 0;text-align:center}.page-controls{display:flex;justify-content:space-between;margin-top:14px}.page-controls button{border:1px solid #d7e2ef;background:#fff;color:#557291;border-radius:10px;padding:10px 15px;font-size:12px}.page-controls button:disabled{opacity:.3;cursor:default}.inspector{padding:31px 23px;border-left:1px solid #dfe7f0;position:sticky;top:80px;height:calc(100vh - 80px);overflow:auto}.inspector h3{font-size:19px;line-height:1.6;margin:17px 0 7px}.screen-id{font:11px monospace;color:#8398af}.divider{height:1px;background:#e5edf5;margin:24px 0}.inspector h4{font-size:12px;margin:22px 0 8px}.inspector p{font-size:12px;color:#7388a0;line-height:1.9;margin:0}.exports{display:grid;gap:9px;margin-top:28px}.exports a{border:1px solid #dbe8f7;border-radius:9px;padding:11px;font-size:11px}.note{margin-top:24px;background:#f6f8fb;border-radius:10px;padding:13px;font-size:11px;line-height:1.8;color:#8a9ab0}#stage.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(175px,1fr));gap:24px}.thumb{background:transparent;border:0;padding:0;text-align:left;color:#314d6f}.thumb img{width:100%;border-radius:13px;box-shadow:0 5px 16px #153b5d12}.thumb strong{display:block;font-size:12px;font-weight:500;margin-top:10px;line-height:1.7}.flow-wrap{width:100%;overflow:auto;padding-bottom:12px}.flow-wrap img{height:660px;width:auto;max-width:none}.flow-note{font-size:12px;color:#6c819e;margin:15px 0}.empty{padding:30px;background:white;border-radius:18px;color:#7187a0;font-size:13px}@media(min-width:1550px){#stage{padding-top:10px}.phone-figure{width:390px}}@media(max-width:1150px){.workspace{grid-template-columns:180px minmax(390px,1fr)}.themes{padding:25px 16px}.inspector{grid-column:2;position:static;height:auto;border:0}.collection{align-items:flex-start;flex-direction:column}main{padding:24px}.top-actions .edition{display:none}}@media(max-width:700px){header{height:70px;padding:0 16px}.brand{font-size:18px}.top-actions{gap:10px;font-size:10px}.top-actions a:first-of-type{display:none}.workspace{display:block}.themes{position:static;height:auto;padding:20px 16px;border:0}.themes h1,.themes p,.themes>.eyebrow,.scope,.prototype-link{display:none}nav{display:flex;overflow:auto;margin:0;gap:4px}nav button{flex-shrink:0}nav button span{display:none}main{padding:8px 16px 24px}.collection{flex-direction:row;align-items:center}.collection h2{font-size:19px}.collection>.eyebrow{display:none}.views button{padding:7px;font-size:10px}#tabs{margin:19px 0}.inspector{padding:24px}.flow-wrap img{height:550px}}