*{box-sizing:border-box}body{margin:0;background:#f4f7f4;color:#1d332b;font:15px/1.5 Inter,Segoe UI,Arial,sans-serif}.demo-header{height:70px;padding:0 clamp(18px,6vw,82px);display:flex;justify-content:space-between;align-items:center;background:#fff;border-bottom:1px solid #e4eae5}.demo-brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:inherit}.demo-brand>span:last-child{display:grid;line-height:1.1}.demo-brand b{font-size:16px}.demo-brand small{font-size:10px;color:#789087;margin-top:4px}.demo-mark{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;background:#174f3a;color:#fff;font-size:13px;font-weight:800}.demo-open{display:inline-flex;gap:12px;align-items:center;border-radius:6px;background:#174f3a;color:#fff;text-decoration:none;padding:11px 16px;font-size:12px;font-weight:650}.demo-intro{max-width:980px;margin:65px auto 30px;padding:0 22px}.eyebrow{font-size:10px;letter-spacing:1.7px;color:#3b8662;font-weight:750}.demo-intro h1{font-size:clamp(38px,6vw,66px);line-height:1.03;letter-spacing:-2.5px;margin:14px 0 17px}.demo-intro h1 em{font-style:normal;color:#438461}.demo-intro>p:last-child{max-width:590px;color:#64776e;font-size:16px}.demo-player{max-width:1000px;margin:0 auto;padding:0 18px}.demo-window{overflow:hidden;border:1px solid #d7e0da;background:#fff;border-radius:12px;box-shadow:0 22px 55px #19412e16}.window-bar{height:34px;display:flex;gap:5px;align-items:center;padding:0 12px;background:#f4f6f5;border-bottom:1px solid #e5e9e6}.window-dot{width:8px;height:8px;border-radius:50%;background:#cad3cd}.window-title{flex:1;text-align:center;font-size:9px;color:#74827a}.window-user{font-size:9px;font-weight:700;border-radius:50%;background:#e0ebe2;color:#285840;width:21px;height:21px;display:grid;place-items:center}.app-top{height:43px;background:#176344;color:white;display:flex;align-items:center;justify-content:space-between;padding:0 16px;font-size:10px}.app-top b{font-size:15px;font-weight:500}.app-top b span{font-weight:300}.saved{color:#e5f1e9}.saved i{display:inline-block;width:6px;height:6px;background:#98d5ae;border-radius:50%;margin-right:5px}.ribbon{height:39px;display:flex;align-items:center;gap:17px;border-bottom:1px solid #e1e5e2;padding:0 15px;color:#62736a;font-size:9px}.ribbon-tab{height:100%;padding-top:13px}.ribbon-tab:last-of-type{border-bottom:2px solid #3f8a63;color:#236643}.ribbon-action{padding:5px 8px;background:#f1f6f2;border-radius:3px;color:#3a674f}.scene{height:340px;padding:16px 18px;background:#fbfcfb;overflow:hidden}.mock-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.mock-heading h3{font-size:13px;margin:0}.mock-heading small{color:#829189;font-size:9px}.mock-chip{font-size:8px;color:#2b714a;background:#eaf4ed;border-radius:20px;padding:4px 8px}.mock-table{border:1px solid #e2e9e4;background:#fff;border-radius:6px;overflow:hidden}.mock-row{display:grid;grid-template-columns:minmax(145px,1.5fr) 90px 88px 80px minmax(130px,2fr);align-items:center;min-height:35px;border-bottom:1px solid #edf1ee;padding:0 9px;gap:9px;font-size:9px;color:#50625a}.mock-row:last-child{border-bottom:0}.mock-row.head{min-height:28px;background:#f5f8f5;color:#8a9890;font-size:8px}.mock-task{font-weight:650;color:#283e32}.mock-muted{color:#87958c}.mock-track{height:12px;position:relative;border-radius:3px;background:repeating-linear-gradient(90deg,#f2f5f2 0,#f2f5f2 1px,transparent 1px,transparent 21px)}.mock-bar{position:absolute;height:8px;top:2px;left:var(--start);width:var(--length);border-radius:3px;background:#63957c}.mock-bar.red{background:#cf746d}.mock-bar.blue{background:#6689ad}.mock-progress{height:5px;border-radius:9px;background:#e6ece7;overflow:hidden}.mock-progress i{display:block;height:100%;background:#4f956b}.mock-note{font-size:9px;color:#849189;margin-top:10px}.scene-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:14px}.mock-card{border:1px solid #e2e9e4;background:#fff;border-radius:7px;padding:12px}.mock-card h4{font-size:10px;margin:0 0 10px}.mock-list{display:grid;gap:8px}.mock-person{display:flex;align-items:center;gap:8px;font-size:9px;color:#43584c}.mock-avatar{width:24px;height:24px;border-radius:50%;background:#e4efe7;display:grid;place-items:center;color:#32704c;font-size:8px;font-weight:700}.mock-role{margin-left:auto;color:#829189;font-size:8px}.mock-stat{display:flex;justify-content:space-between;border-bottom:1px solid #eef1ef;padding:6px 0;font-size:9px}.mock-stat b{font-size:10px;color:#28583e}.mock-card p{font-size:9px;color:#76867d;margin:7px 0 0}.mock-tag{display:inline-block;background:#fff4e8;color:#8d6838;border-radius:3px;padding:3px 6px;font-size:8px}.finance-layout{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:12px}.finance-kpi{border:1px solid #e0e8e1;background:#fff;border-radius:6px;padding:9px}.finance-kpi small{display:block;font-size:8px;color:#839087}.finance-kpi b{font-size:15px;color:#255f40}.finance-line{display:grid;grid-template-columns:1.25fr .7fr .7fr .7fr 1fr;align-items:center;gap:9px;padding:9px 10px;border-bottom:1px solid #edf1ee;font-size:9px}.finance-line:first-child{color:#87958c;font-size:8px;background:#f5f8f5}.finance-publish{font-size:8px;color:#32734e;background:#eaf4ed;border-radius:20px;padding:3px 7px}.mock-request{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;padding:11px 0;border-bottom:1px solid #ecf0ed}.mock-request strong{font-size:10px}.mock-request small{display:block;color:#809087;font-size:8px}.mock-request button{border:0;border-radius:4px;background:#eaf4ed;color:#2d704a;padding:6px 8px;font-size:8px}.history-item{display:grid;grid-template-columns:24px 1fr auto;gap:9px;align-items:center;border-bottom:1px solid #edf1ee;padding:9px 2px}.history-icon{width:22px;height:22px;border-radius:50%;background:#e9f2eb;color:#36744e;display:grid;place-items:center;font-size:9px}.history-item b{display:block;font-size:9px}.history-item small{font-size:8px;color:#86938b}.history-item time{font-size:8px;color:#87938d}.demo-caption{display:grid;grid-template-columns:75px 1fr 38px;gap:12px;align-items:start;padding:18px 4px 12px}.demo-caption>small{font-size:9px;color:#648172;letter-spacing:.6px;padding-top:5px}.demo-caption h2{font-size:15px;margin:0 0 3px}.demo-caption p{font-size:11px;line-height:1.5;color:#718077;margin:0}.sound-toggle,.demo-controls button{border:1px solid #dbe4de;background:white;color:#345b43;border-radius:5px;min-height:32px;cursor:pointer}.sound-toggle{font-size:12px}.demo-controls{display:flex;align-items:center;gap:8px;padding:6px 4px}.demo-controls button{min-width:34px}.play-button{background:#174f3a!important;color:#fff!important;border-color:#174f3a!important;padding:0 12px}.chapter-track{display:flex;gap:5px;flex:1}.chapter-dot{height:4px;flex:1;border:0!important;min-width:0!important;min-height:5px!important;padding:0;border-radius:4px!important;background:#dce5df!important;overflow:hidden}.chapter-dot.active{background:#419263!important}.time-label{font-size:9px;color:#7d8b83;margin-left:3px}.progress-track{height:3px;background:#e5ebe6;margin:6px 4px 0}.progress-track span{display:block;width:0;height:100%;background:#368457;transition:width .2s linear}.demo-chapters{max-width:964px;margin:43px auto 60px;padding:0 18px;display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#dfe7e1;border:1px solid #dfe7e1;border-radius:8px;overflow:hidden}.demo-chapters>div{display:grid;grid-template-columns:28px 1fr;gap:3px 9px;background:#fff;padding:14px}.demo-chapters span{grid-row:span 2;font-size:10px;font-weight:700;color:#55906b}.demo-chapters b{font-size:10px}.demo-chapters small{font-size:9px;color:#7c8981}.demo-end{max-width:964px;margin:0 auto 60px;padding:28px;display:flex;align-items:center;justify-content:space-between;gap:20px;background:#eaf2ec;border:1px solid #dae7dc;border-radius:8px}.demo-end h2{margin:5px 0;font-size:20px}.demo-end p:last-child{margin:0;color:#687a6f;font-size:11px;max-width:540px}footer{display:flex;justify-content:space-between;padding:20px clamp(18px,6vw,82px);background:#fff;border-top:1px solid #e3eae5;color:#819087;font-size:9px}@media(max-width:650px){.demo-intro{margin-top:42px}.demo-window{border-radius:8px}.scene{height:320px;padding:12px 8px}.ribbon{gap:8px;padding:0 8px;font-size:8px}.mock-row{grid-template-columns:minmax(110px,1.5fr) 60px 65px 60px minmax(95px,1.5fr);gap:4px;padding:0 5px;font-size:8px}.mock-row.head{font-size:7px}.scene-grid{grid-template-columns:1fr 1fr;gap:6px}.mock-card{padding:8px}.finance-layout{grid-template-columns:repeat(2,1fr);gap:5px}.finance-line{grid-template-columns:1fr .6fr .6fr .6fr;gap:4px;padding:7px 5px;font-size:8px}.finance-line span:last-child{display:none}.demo-chapters{grid-template-columns:repeat(2,1fr);margin:32px 12px 44px}.demo-end{margin:0 12px 44px;padding:20px;align-items:flex-start;flex-direction:column}.demo-caption{grid-template-columns:50px 1fr 35px;gap:8px}.demo-controls{gap:4px}.demo-controls button{min-width:29px}.time-label{font-size:8px}footer{gap:8px;flex-direction:column}}