.demo-hero{max-width:980px;margin:0 auto 26px;text-align:center}.demo-hero h1{font-size:clamp(36px,5vw,62px);letter-spacing:-.045em;color:var(--ciwz-navy);font-weight:900;margin:12px 0}.demo-hero p{font-size:17px;color:#526075;max-width:850px;margin:0 auto}.demo-progress{display:flex;gap:8px;justify-content:center;margin-top:20px}.demo-progress span{width:40px;height:5px;border-radius:9px;background:#dce4ef}.demo-progress span.active{background:var(--ciwz-red)}.demo-shell{display:grid;grid-template-columns:220px minmax(0,1fr);gap:18px;align-items:start}.demo-rail{position:sticky;top:94px;border:1px solid var(--ciwz-border);border-radius:22px;background:#fff;padding:10px;box-shadow:var(--ciwz-shadow-sm)}.demo-rail button{width:100%;display:flex;gap:11px;align-items:center;border:0;background:transparent;border-radius:13px;padding:13px 10px;text-align:left;color:#64748b;font-weight:800}.demo-rail button span{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:#eef2f7;color:#334155;font-size:11px}.demo-rail button.active{background:#f3f7ff;color:var(--ciwz-navy)}.demo-rail button.active span{background:var(--ciwz-navy);color:white}.demo-stage{min-width:0}.demo-scene{display:none;border:1px solid var(--ciwz-border);background:#fff;border-radius:28px;box-shadow:var(--ciwz-shadow);padding:28px;overflow:hidden}.demo-scene.active{display:block;animation:demoIn .25s ease}@keyframes demoIn{from{opacity:.3;transform:translateY(4px)}to{opacity:1;transform:none}}.demo-scene-head,.demo-exam-top{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;margin-bottom:22px}.demo-scene-head small,.demo-exam-top small{font-weight:900;letter-spacing:.08em;color:#748399}.demo-scene-head h2,.demo-exam-top h2{margin:4px 0 0;color:var(--ciwz-navy);font-size:clamp(24px,3vw,36px);font-weight:900;letter-spacing:-.03em}.demo-status-pill{white-space:nowrap;border:1px solid #d6e2ef;background:#f8fafc;border-radius:999px;padding:7px 10px;font-size:11px;font-weight:900;color:#53647b}.demo-status-pill.ok{background:#edf9f1;border-color:#cbead5;color:#16733a}.demo-status-pill.danger{background:#fff0f1;border-color:#ffd0d6;color:#9e1730}.demo-rec-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#e11d48;margin-right:5px;box-shadow:0 0 0 4px rgba(225,29,72,.12)}.demo-device-grid,.demo-proctor-layout,.demo-learning-layout,.demo-exam-layout,.demo-result{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr);gap:22px}.demo-camera-box{position:relative;min-height:420px;border-radius:22px;background:linear-gradient(145deg,#081426,#142d50);overflow:hidden;display:grid;place-items:center}.demo-camera-box video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}.demo-camera-placeholder{position:relative;z-index:2;color:#dbe8f8;text-align:center;display:grid;gap:8px;justify-items:center}.demo-camera-placeholder small{max-width:280px;color:#9fb0c7}.demo-person-icon{width:130px;height:160px;position:relative}.demo-person-icon:before{content:"";position:absolute;top:0;left:35px;width:60px;height:60px;border-radius:50%;background:#dbe8f8}.demo-person-icon:after{content:"";position:absolute;bottom:0;left:5px;width:120px;height:88px;border-radius:62px 62px 14px 14px;background:#dbe8f8}.demo-person-icon.small{transform:scale(.55);transform-origin:center}.demo-person-icon.small:before,.demo-person-icon.small:after{background:#adc1d9}.demo-face-guide{position:absolute;width:220px;height:285px;border:3px dashed rgba(92,220,149,.85);border-radius:50%;inset:50% auto auto 50%;transform:translate(-50%,-50%);z-index:3;pointer-events:none}.demo-device-panel{border:1px solid #e1e8f0;border-radius:20px;padding:18px;background:#fbfcfe}.device-row{display:grid;grid-template-columns:48px 1fr 12px;gap:12px;align-items:center;padding:13px 0;border-bottom:1px solid #e7edf4}.device-row:last-of-type{border-bottom:0}.device-icon{width:48px;height:48px;border-radius:14px;background:#eaf2ff;display:grid;place-items:center;font-size:11px;font-weight:900;color:#1d4ed8}.device-row strong,.device-row small{display:block}.device-row small{color:#718096;margin-top:3px}.device-row i{width:10px;height:10px;border-radius:50%;background:#cbd5e1}.device-row.ok i{background:#22c55e}.demo-meter{padding:18px 0}.demo-meter>span{font-weight:800;font-size:12px;color:#526075}.demo-meter>div{height:10px;border-radius:99px;background:#e8edf4;overflow:hidden;margin:8px 0}.demo-meter b{display:block;width:2%;height:100%;background:linear-gradient(90deg,#22c55e,#f59e0b,#ef4444);transition:width .1s}.demo-meter small{color:#6b7788}.demo-privacy-note{font-size:11px;color:#77859a;margin:10px 0 0}.demo-actions{display:flex;align-items:center;justify-content:space-between;gap:10px;border-top:1px solid #edf1f5;margin-top:24px;padding-top:18px}.demo-lesson{border:1px solid #e3eaf2;border-radius:20px;padding:20px}.demo-lesson-visual{height:180px;border-radius:16px;background:#0b1930;display:grid;place-items:center;overflow:hidden;margin-bottom:18px}.demo-lesson-visual img{width:100%;height:100%;object-fit:cover}.demo-lesson h3{font-weight:900;color:var(--ciwz-navy)}.demo-lesson p{text-align:justify;color:#526075}.demo-lesson-points{display:flex;gap:8px;flex-wrap:wrap}.demo-lesson-points span{display:inline-flex;align-items:center;gap:5px;background:#eef5ff;border:1px solid #d8e7fb;border-radius:99px;padding:7px 9px;font-size:12px;font-weight:800;color:#28476f}.demo-assistant{border:1px solid #dae5f2;border-radius:20px;padding:16px;background:linear-gradient(180deg,#f8fbff,#fff)}.assistant-head{display:flex;gap:10px;align-items:center}.assistant-orb{width:42px;height:42px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff 0 11%,#60a5fa 12% 30%,#0f2b51 31% 100%);box-shadow:0 0 0 5px rgba(59,130,246,.1)}.assistant-head strong,.assistant-head small{display:block}.assistant-head small{color:#748399}.assistant-chat{height:290px;overflow:auto;padding:15px 0;display:flex;flex-direction:column;gap:10px}.assistant-chat div{max-width:92%;padding:10px 12px;border-radius:13px;line-height:1.45}.assistant-chat .bot{background:#eef5ff;color:#183b67;align-self:flex-start}.assistant-chat .user{background:#0b1930;color:white;align-self:flex-end}.assistant-compose{display:grid;grid-template-columns:1fr 42px;gap:8px}.assistant-compose input{border:1px solid #dce5ef;border-radius:12px;padding:10px 12px}.assistant-compose button{border:0;border-radius:12px;background:var(--ciwz-red);color:white;font-size:20px}.assistant-prompts{display:flex;gap:6px;margin-top:8px}.assistant-prompts button{border:1px solid #dce5ef;background:white;border-radius:99px;padding:6px 8px;font-size:11px;font-weight:800;color:#42536a}.demo-proctor-visual{position:relative;min-height:430px;border-radius:22px;overflow:hidden;background:#081426}.demo-proctor-visual img{width:100%;height:100%;object-fit:cover}.proctor-overlay{position:absolute;left:16px;right:16px;bottom:16px;display:flex;gap:8px;flex-wrap:wrap}.proctor-overlay span{background:rgba(3,10,22,.76);color:#fff;border:1px solid rgba(255,255,255,.15);border-radius:99px;padding:7px 9px;font-size:11px;font-weight:900}.proctor-overlay span.ok{background:rgba(13,99,54,.82)}.demo-proctor-copy h3{color:var(--ciwz-navy);font-weight:900}.demo-proctor-copy ul{padding-left:20px;color:#526075}.demo-proctor-copy li{margin-bottom:11px}.demo-security-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.demo-security-grid div{border:1px solid #e2e8f0;border-radius:13px;padding:10px;background:#fafcff}.demo-security-grid b,.demo-security-grid span{display:block}.demo-security-grid b{color:var(--ciwz-red);font-size:12px}.demo-security-grid span{font-weight:800;color:#334155;margin-top:3px}.demo-timer{font:900 24px/1 monospace;color:#fff;background:#0b1930;padding:13px 15px;border-radius:13px}.demo-question-area{display:grid;gap:14px}.demo-q{border:1px solid #e1e8f0;border-radius:18px;padding:18px}.demo-q h3{font-size:17px;color:#0f2748;margin:0 0 12px}.demo-q label{display:flex;gap:10px;align-items:flex-start;padding:10px;border:1px solid #e5ebf2;border-radius:12px;margin-top:7px;cursor:pointer}.demo-q label:has(input:checked){background:#eef5ff;border-color:#9dc0f5}.demo-live-proctor{border:1px solid #dbe5ef;border-radius:20px;padding:14px;background:#f8fbff}.demo-live-head{display:flex;align-items:center;gap:6px}.demo-live-camera{height:220px;background:#0b1930;border-radius:16px;margin:12px 0;display:grid;place-items:center;position:relative;overflow:hidden}.demo-live-status{display:grid;gap:7px}.demo-live-status span{font-size:12px;font-weight:800;color:#3f526a}.demo-live-status i{display:inline-block;width:8px;height:8px;border-radius:50%;background:#22c55e;margin-right:6px}.demo-live-proctor p{font-size:12px;color:#69788b;margin-top:10px}.demo-block-dots{display:flex;gap:5px}.demo-block-dots span{width:28px;height:5px;border-radius:99px;background:#dbe3ed}.demo-block-dots span.active{background:var(--ciwz-red)}.demo-result{align-items:center}.demo-result-copy h2{font-size:clamp(28px,4vw,46px);letter-spacing:-.04em;color:var(--ciwz-navy);font-weight:900;margin-top:12px}.demo-result-copy p{text-align:justify;color:#526075}.demo-price-card{display:grid;grid-template-columns:1fr auto;gap:10px 18px;border:1px solid #dfe7ef;border-radius:16px;padding:14px;margin:16px 0}.demo-price-card strong{text-align:right;color:#0f713d}.demo-certificate{position:relative;border:8px double #d8b35e;background:#fffdf7;padding:30px;text-align:center;box-shadow:0 20px 55px rgba(46,39,18,.18);min-height:490px;overflow:hidden}.demo-certificate:after{content:"";position:absolute;inset:18px;border:1px solid #e9d7a5;pointer-events:none}.demo-certificate img{height:54px;max-width:180px;object-fit:contain}.demo-certificate small{display:block;letter-spacing:.12em;font-weight:800;color:#7a6b48;margin-top:20px}.demo-certificate h3{font:700 28px Georgia,serif;color:#2b3340;margin:18px 0 6px}.demo-certificate p{color:#667085}.cert-name{font:italic 30px Georgia,serif;color:#9b172a;margin:30px 0}.cert-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.cert-grid div{border-top:1px solid #d8c89c;padding-top:10px}.cert-grid span,.cert-grid strong{display:block}.fake-qr{width:74px;height:74px;margin:22px auto 0;background:conic-gradient(#111 0 25%,#fff 0 50%,#111 0 75%,#fff 0);background-size:14px 14px;border:6px solid #fff;box-shadow:0 0 0 1px #111}.cert-demo{color:#a7192f!important}.cert-ribbon{position:absolute;right:-40px;top:18px;transform:rotate(45deg);background:#a7192f;color:white;padding:7px 48px;font-weight:900;letter-spacing:.1em}.demo-legal-note{text-align:center;max-width:960px;margin-left:auto;margin-right:auto}.demo-legal-note p{text-align:justify}.demo-legal-note .ciwz-actions{justify-content:center}
@media(max-width:980px){.demo-shell{grid-template-columns:1fr}.demo-rail{position:static;display:flex;overflow:auto}.demo-rail button{min-width:170px}.demo-device-grid,.demo-proctor-layout,.demo-learning-layout,.demo-exam-layout,.demo-result{grid-template-columns:1fr}.demo-live-proctor{order:-1}.demo-camera-box{min-height:360px}}
@media(max-width:640px){.demo-hero,.demo-scene{text-align:center}.demo-hero p,.demo-scene p,.demo-proctor-copy li{text-align:justify}.demo-scene{padding:18px}.demo-scene-head,.demo-exam-top{align-items:center;flex-direction:column}.demo-device-panel,.demo-proctor-copy,.demo-live-proctor{text-align:center}.device-row{text-align:left}.demo-actions{justify-content:center;flex-wrap:nowrap}.demo-actions .ciwz-btn{flex:1 1 0;min-width:0;padding:9px 7px;font-size:12px}.demo-security-grid{grid-template-columns:1fr 1fr}.demo-camera-box{min-height:300px}.assistant-prompts{justify-content:center}.demo-price-card{text-align:left}.demo-certificate{padding:26px 18px;min-height:450px}.demo-certificate h3{font-size:23px}.cert-name{font-size:26px}}