.magic-mirror-page{background:linear-gradient(180deg,#fff 0%,#fbf7ff 48%,#f1fbff 100%)}
.mirror-section{padding-top:30px}.mirror-private-pill{background:#ebfff7;border:2px solid #bfead8;color:#24664e;font-weight:900;border-radius:999px;padding:8px 14px}
.mirror-title-row{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center;margin:20px 0}.mirror-title-row h1{margin:.35rem 0 .5rem}.mirror-title-row p{max-width:720px;font-weight:700;color:var(--ink-soft);font-size:1.08rem}.mirror-title-row img{width:120px;max-height:130px;object-fit:contain}
.mirror-parent-gate{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:start;background:linear-gradient(135deg,#fff8d8,#fff);border:3px solid #f2d775;border-radius:28px;padding:22px;margin:22px auto;width:min(980px,100%);box-shadow:0 12px 30px rgba(89,68,125,.10)}
.mirror-gate-icon{font-size:3rem}.mirror-gate-copy h2{margin:5px 0 9px}.mirror-gate-copy p{line-height:1.55}.mirror-gate-note{font-size:.94rem;color:var(--ink-soft)}
.mirror-math-row{display:flex;align-items:end;gap:10px;flex-wrap:wrap;background:#fff;border-radius:18px;padding:12px;margin-top:14px}.mirror-math-row label{font-weight:900;min-width:210px}.mirror-math-row input{width:110px;min-height:48px;border:2px solid #d7caef;border-radius:14px;font-size:1.25rem;font-weight:900;text-align:center;padding:8px}.mirror-gate-message{font-weight:800;margin-top:10px;color:#755a26}.mirror-camera-approval{margin-top:12px;padding:12px;border-radius:16px;background:#eafff7}.mirror-camera-approval p{margin:0 0 10px;font-weight:800}.mirror-camera-start{min-width:260px}.is-hidden{display:none!important}
.mirror-app{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(310px,.8fr);gap:22px;align-items:start}.mirror-app.is-locked{opacity:.62}.mirror-stage-shell{min-width:0}.mirror-stage{position:relative;width:100%;aspect-ratio:4/3;overflow:hidden;border-radius:30px;background:linear-gradient(135deg,#7f65db,#43cde3);box-shadow:0 18px 45px rgba(45,32,95,.18);border:7px solid #fff}.mirror-stage video{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.mirror-stage canvas{display:block;width:100%;height:100%;background:#efeaff}.mirror-camera-placeholder{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;color:#fff;background:radial-gradient(circle at 50% 35%,#9d89ec,#5f51a8);font-weight:900}.mirror-camera-placeholder span{font-size:5rem}.mirror-camera-placeholder strong{font-size:1.5rem}.mirror-camera-placeholder small{font-size:1rem}.mirror-live-badge{position:absolute;top:14px;left:14px;background:rgba(18,39,47,.80);color:#fff;border-radius:999px;padding:7px 10px;font-weight:900;font-size:.78rem;letter-spacing:.02em}.mirror-off-button{position:absolute;right:14px;bottom:14px;min-height:48px;border:0;border-radius:16px;background:#fff;color:#9e1e38;font-weight:1000;padding:11px 15px;box-shadow:0 8px 24px rgba(40,20,70,.25);cursor:pointer}.mirror-stage-status{margin:10px 3px 0;background:#fff;border:2px solid #e8e1f6;border-radius:16px;padding:10px 12px;font-weight:800;color:var(--purple-dark)}.mirror-no-save{margin:8px 3px 0;text-align:center;font-weight:900;color:#3e7c67;font-size:.9rem}
.mirror-controls{display:grid;gap:15px;min-width:0}.mirror-control-section{background:#fff;border:2px solid #eee8fa;border-radius:24px;padding:14px;box-shadow:0 10px 24px rgba(72,62,127,.07)}.mirror-control-heading{display:flex;align-items:baseline;justify-content:space-between;gap:8px;flex-wrap:wrap;margin-bottom:9px}.mirror-control-heading h2{font-size:1.1rem;margin:0}.mirror-control-heading p{margin:0;color:var(--ink-soft);font-weight:700;font-size:.85rem}.mirror-option-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.mirror-option{min-height:76px;border:2px solid #e8e2f4;border-radius:16px;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;cursor:pointer;padding:7px;color:var(--purple-dark);font:inherit;font-weight:900}.mirror-option span{font-size:1.65rem;line-height:1}.mirror-option img{width:38px;height:38px;object-fit:contain}.mirror-option small{font-size:.72rem;font-weight:900;line-height:1.05}.mirror-option.selected{border-color:#8b6fe5;background:#f1edff;box-shadow:0 0 0 2px rgba(139,111,229,.12)}.mirror-option:focus-visible{outline:3px solid #53cae9;outline-offset:2px}
.mirror-parent-info{margin:26px auto 0;background:#effbf7;border:2px solid #cdeadd;border-radius:24px;padding:20px;width:min(980px,100%)}.mirror-parent-info h2{margin-top:0}.mirror-parent-info p{line-height:1.6}
@media(max-width:900px){.mirror-app{grid-template-columns:1fr}.mirror-controls{grid-template-columns:1fr 1fr}.mirror-control-section{min-width:0}.mirror-option-row{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:680px){.mirror-section{padding-top:18px}.mirror-private-pill{font-size:.78rem}.mirror-title-row{grid-template-columns:1fr}.mirror-title-row img{display:none}.mirror-parent-gate{grid-template-columns:1fr;padding:16px}.mirror-gate-icon{display:none}.mirror-math-row{align-items:stretch}.mirror-math-row label{width:100%}.mirror-math-row input{flex:1;width:auto}.mirror-camera-start{width:100%;min-width:0}.mirror-app{gap:14px}.mirror-stage{border-radius:22px;border-width:4px}.mirror-controls{grid-template-columns:1fr}.mirror-control-section{padding:12px}.mirror-option{min-height:70px}.mirror-off-button{right:8px;bottom:8px}.mirror-live-badge{top:8px;left:8px}.mirror-parent-info{padding:16px}}