.film{isolation:isolate;border-radius:2rem;padding:clamp(.75rem,3.2%,2.5rem);position:relative;overflow:hidden}.film-bleed{padding:clamp(1.25rem,5%,3.5rem) 0 0 clamp(1.25rem,5%,3.5rem)}.film-viewport{aspect-ratio:var(--ar);position:relative;container-type:inline-size}.film-bleed .film-viewport{border-top-left-radius:1.4rem;overflow:hidden}.film-stage{transform-origin:0 0;color:var(--color-ink-900);-webkit-font-smoothing:antialiased;font-size:14px;line-height:1.35;transition:opacity .45s;position:absolute;top:0;left:0}.film.is-fading .film-stage{opacity:0}.film-cursor{z-index:40;pointer-events:none;filter:drop-shadow(0 2px 3px #0b12204d);transform:translate(var(--cx,0px), var(--cy,0px));transition:transform .75s cubic-bezier(.65,0,.25,1),opacity .3s;position:absolute;top:0;left:0}.film-stage:after{content:"";z-index:39;width:34px;height:34px;transform:translate(var(--cx,0px), var(--cy,0px)) scale(0);opacity:0;pointer-events:none;background:#3d7cf059;border-radius:999px;margin:-14px 0 0 -12px;position:absolute;top:0;left:0}.film.is-click .film-stage:after{animation:.52s cubic-bezier(.16,1,.3,1) film-ripple}.film.is-click .film-cursor{transform:translate(var(--cx,0px), var(--cy,0px)) scale(.86);transition-duration:.12s}@keyframes film-ripple{0%{opacity:1;transform:translate(var(--cx,0px), var(--cy,0px)) scale(.3)}to{opacity:0;transform:translate(var(--cx,0px), var(--cy,0px)) scale(1.6)}}.film.no-cursor .film-cursor,.film.no-cursor .film-stage:after{opacity:0}.film .is-pressed{transition:transform .12s;transform:scale(.95)}.film .bump{animation:.38s cubic-bezier(.16,1,.3,1) film-bump}@keyframes film-bump{40%{transform:translateY(-2px)scale(1.04)}}.film.is-resetting *,.film.is-resetting :after{transition:none!important;animation:none!important}.film.is-paused *{animation-play-state:paused!important}.film-toggle{z-index:50;width:2.25rem;height:2.25rem;color:var(--color-ink-950);cursor:pointer;background:#ffffffd9;border-radius:999px;place-items:center;transition:background-color .15s,transform .15s;display:grid;position:absolute;bottom:.75rem;right:.75rem;box-shadow:0 2px 8px #0b122026}.film-toggle:hover{background:#fff}.film-toggle:active{transform:scale(.94)}.film-toggle svg{fill:currentColor;width:.95rem;height:.95rem}.film-toggle .film-icon-play,.film-toggle[aria-pressed=true] .film-icon-pause{display:none}.film-toggle[aria-pressed=true] .film-icon-play{display:block}.m-window{background:#fff;border-radius:22px;grid-template-columns:196px 1fr;display:grid;position:absolute;inset:0;overflow:hidden;box-shadow:0 1px 2px #0b12200f,0 24px 48px -16px #0b122047}.film[data-compact] .m-window{grid-template-columns:1fr}.film[data-compact] .m-side{display:none}.m-side{border-right:1px solid var(--color-ink-100);flex-direction:column;gap:4px;padding:18px 12px;display:flex}.m-brand{letter-spacing:-.01em;align-items:center;gap:10px;padding:2px 8px 16px;font-weight:600;display:flex}.m-brand small{color:var(--color-ink-500);font-size:11px;font-weight:400;display:block}.m-logo{color:#fff;background:linear-gradient(135deg,#3d7cf0,#7ed3a6);border-radius:9px;place-items:center;width:30px;height:30px;font-size:12px;font-weight:700;display:grid}.m-nav{color:var(--color-ink-700);white-space:nowrap;border-radius:11px;align-items:center;gap:10px;max-height:40px;padding:8px 10px;transition:background-color .3s,color .3s,opacity .4s,max-height .5s cubic-bezier(.16,1,.3,1),padding .5s cubic-bezier(.16,1,.3,1);display:flex}.m-nav svg{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;width:16px;height:16px}.m-nav.on{background:var(--color-ink-950);color:#fff}.m-badge{color:#fff;background:#f0a33a;border-radius:999px;place-items:center;min-width:18px;height:18px;margin-left:auto;padding:0 5px;font-size:10px;font-weight:700;display:grid}.m-user{background:var(--color-ink-50);border-radius:14px;align-items:center;gap:9px;margin-top:auto;padding:10px;font-size:12px;font-weight:600;display:flex}.m-user small{color:var(--color-ink-500);font-weight:400;display:block}.m-avatar{background:var(--color-sky-500);color:#fff;border-radius:999px;flex-shrink:0;place-items:center;width:28px;height:28px;font-size:11px;font-weight:700;display:grid}.m-main{background:#f5f6f8;min-width:0;padding:22px 26px;position:relative;overflow:hidden}.m-kicker{font-family:var(--font-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--color-ink-500);font-size:10.5px}.m-title{letter-spacing:-.035em;color:var(--color-ink-950);margin-top:2px;font-size:34px;font-weight:600;line-height:1.05}.m-card{background:#fff;border-radius:18px;padding:16px 18px;box-shadow:0 1px 2px #0b12200a}.m-chip{color:var(--color-ink-700);white-space:nowrap;background:#fff;border-radius:999px;align-items:center;gap:6px;padding:6px 12px;font-size:12.5px;font-weight:500;transition:background-color .3s,color .3s;display:inline-flex}.m-chip.on{background:var(--color-ink-950);color:#fff}.m-dot{background:var(--color-ok-500);border-radius:999px;width:7px;height:7px}.m-btn{background:var(--color-ink-950);color:#fff;white-space:nowrap;border-radius:999px;align-items:center;gap:7px;padding:9px 16px;font-size:13px;font-weight:600;transition:transform .12s;display:inline-flex}.m-btn.ghost{color:var(--color-ink-900);box-shadow:inset 0 0 0 1px var(--color-ink-200);background:#fff}.m-btn svg{fill:none;stroke:currentColor;stroke-width:2.2px;stroke-linecap:round;stroke-linejoin:round;width:14px;height:14px}.m-table{border-collapse:collapse;width:100%;font-size:13px}.m-table th{text-align:left;font-family:var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--color-ink-500);padding:0 12px 8px;font-size:10px;font-weight:500}.m-table td{border-top:1px solid var(--color-ink-100);white-space:nowrap;padding:9px 12px}.m-table .r{text-align:right}.m-toast{z-index:30;background:var(--color-ink-950);color:#fff;opacity:0;border-radius:14px;align-items:center;gap:10px;padding:11px 16px 11px 12px;font-size:13px;font-weight:500;transition:opacity .4s,transform .5s cubic-bezier(.16,1,.3,1);display:flex;position:absolute;transform:translateY(14px)scale(.97);box-shadow:0 16px 32px -12px #0b122073}.m-toast .m-check{background:var(--color-ok-500)}.m-check{background:var(--color-ok-500);color:#fff;border-radius:999px;flex-shrink:0;place-items:center;width:20px;height:20px;display:grid}.m-check svg{fill:none;stroke:currentColor;stroke-width:3px;stroke-linecap:round;stroke-linejoin:round;width:12px;height:12px}.m-pill-ok{background:var(--color-ok-50);color:var(--color-ok-700);border-radius:999px;align-items:center;gap:6px;padding:3px 10px;font-size:12px;font-weight:600;display:inline-flex}.m-pill-bad{background:var(--color-brand-500);color:#fff;font-family:var(--font-sans);border-radius:999px;align-items:center;padding:2px 8px;font-size:10.5px;font-weight:600;display:inline-flex}.m-num{font-variant-numeric:tabular-nums}
