.demo-top{background:rgba(255,255,255,.95);border-bottom:1px solid #e3ebe7}.demo-top .shell{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:15px}.demo-top .brand{display:flex;align-items:center;gap:10px;text-decoration:none}.demo-top .brand-mark{width:45px;height:45px;border-radius:14px;background:#0f6b57;color:#fff;display:grid;place-items:center;font-size:24px}.demo-top .brand-copy b{display:block;color:#17352f;font-size:15px}.demo-top .brand-copy b span{color:#0f6b57}.demo-top .brand-copy small{font-size:9px;color:#80918b}.demo-top .shell>a:last-child{font-size:11px;font-weight:800;color:#0f6b57;text-decoration:none}.demo-page{padding:48px 0 70px}.demo-shell{max-width:980px}.demo-hero{text-align:center;max-width:760px;margin:0 auto 25px}.demo-kicker{font-size:10px;font-weight:900;letter-spacing:.12em;color:#0f6b57}.demo-hero h1{margin:7px 0 12px;font-size:48px;line-height:1.06;letter-spacing:-.05em;color:#17352f}.demo-hero h1 span{color:#0f6b57}.demo-hero p{margin:0 auto;max-width:720px;color:#687d75;font-size:14px;line-height:1.7}.demo-trust{display:flex;justify-content:center;flex-wrap:wrap;gap:7px;margin-top:14px}.demo-trust span{padding:7px 10px;border-radius:999px;background:#edf7f3;color:#4e6f64;font-size:9px;font-weight:750}.demo-message{margin:0 auto 15px;padding:12px 15px;border-radius:15px;background:#fff6d9;color:#705710;font-size:11px;max-width:800px}.demo-role-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.demo-role-card{margin:0;padding:23px;border:1px solid #d9e7e1;border-radius:25px;background:#fff;box-shadow:0 15px 38px rgba(23,53,47,.07);display:flex;flex-direction:column;gap:15px}.demo-role-card.teacher{border-top:4px solid #0f6b57}.demo-role-card.parent{border-top:4px solid #e6b638}.demo-role-top{display:flex;align-items:center;justify-content:space-between}.demo-role-icon{width:48px;height:48px;border-radius:15px;background:#e4f4ed;color:#0f6b57;display:grid;place-items:center;font-weight:900}.parent .demo-role-icon{background:#fff3cf;color:#74570a}.demo-time{padding:6px 9px;border-radius:999px;background:#f1f6f3;color:#667c74;font-size:9px;font-weight:850;letter-spacing:.06em}.demo-role-card small{font-size:9px;font-weight:900;letter-spacing:.1em;color:#789087}.demo-role-card h2{margin:3px 0 6px;color:#17352f;font-size:25px}.demo-role-card p{margin:0;color:#6b7e77;font-size:11px;line-height:1.65;min-height:54px}.demo-role-card ul{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:8px}.demo-role-card li{font-size:10px;color:#526d64;font-weight:650}.demo-role-card li:before{content:"✓";color:#0f6b57;margin-right:7px;font-weight:900}.demo-role-card button{border:0;min-height:52px;border-radius:15px;background:#0f6b57;color:#fff;font-family:inherit;font-size:12px;font-weight:850;cursor:pointer;display:flex;align-items:center;justify-content:space-between;padding:0 16px}.parent button{background:#765c16}.demo-after{text-align:center;padding-top:3px;color:#788a84;font-size:9.5px}.demo-after b{color:#0f6b57}.demo-footnote{text-align:center;margin:18px 0 0;color:#87958f;font-size:9.5px}@media(max-width:720px){.demo-page{padding:32px 0 55px}.demo-hero h1{font-size:36px}.demo-role-grid{grid-template-columns:1fr}.demo-role-card p{min-height:0}.demo-top .brand-copy small{display:none}}
/* v2.9.5 — one-device demo state */
.demo-message.active-device{background:#edf8f3;color:#315e51}.demo-message.active-device strong{color:#0f6b57;font-size:13px}
.demo-device-locked{max-width:760px;margin:0 auto;padding:22px;border:1px solid #d8e6e0;border-radius:24px;background:#fff;box-shadow:0 15px 38px rgba(23,53,47,.07);display:grid;grid-template-columns:54px minmax(0,1fr) auto;align-items:center;gap:15px}
.demo-lock-icon{width:54px;height:54px;border-radius:17px;background:#e6f4ee;color:#0f6b57;display:grid;place-items:center;font-size:22px;font-weight:900}.demo-device-locked small{font-size:8px;font-weight:900;letter-spacing:.1em;color:#7a8d86}.demo-device-locked h2{margin:3px 0 5px;font-size:19px;color:#17352f}.demo-device-locked p{margin:0;font-size:10.5px;line-height:1.6;color:#70847d}.demo-device-locked a{min-height:46px;padding:0 14px;border-radius:13px;background:#0f6b57;color:#fff;display:flex;align-items:center;text-decoration:none;font-size:10px;font-weight:850;white-space:nowrap}
@media(max-width:680px){.demo-device-locked{grid-template-columns:48px 1fr}.demo-lock-icon{width:48px;height:48px}.demo-device-locked a{grid-column:1/-1;justify-content:center}}