2 lines
32 KiB
CSS
2 lines
32 KiB
CSS
|
|
@import"https://fonts.googleapis.com/css2?family=Russo+One&display=swap";:root{color-scheme:light;font-family:Russo One,Avenir Next,Segoe UI,sans-serif;line-height:1.5;font-weight:400;color:#102542;background:radial-gradient(circle at top,rgba(240,199,135,.34),transparent 28%),linear-gradient(180deg,#f7f3e9,#f2ebe0 48%,#e8eef2);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--surface: rgba(255, 255, 255, .78);--surface-strong: rgba(255, 255, 255, .92);--ink: #102542;--muted: #4f647d;--accent: #de6b48;--accent-soft: #f2cc8f;--outline: rgba(16, 37, 66, .12);--shadow: 0 24px 80px rgba(36, 40, 74, .16);--radius-xl: 32px;--radius-lg: 24px;--radius-md: 18px}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}body{min-height:100vh;color:var(--ink)}button,input,textarea,select{font:inherit}button{cursor:pointer}.app-shell{display:grid;gap:1.25rem;min-height:100vh;padding:max(1rem,env(safe-area-inset-top)) max(1rem,env(safe-area-inset-right)) max(1rem,env(safe-area-inset-bottom)) max(1rem,env(safe-area-inset-left))}.app-shell--player-only{display:block;min-height:100vh;padding:0}.app-panel{background:var(--surface);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border:1px solid var(--outline);border-radius:var(--radius-xl);box-shadow:var(--shadow);padding:1.25rem}.app-panel--player-only{display:grid;padding:0;border:0;border-radius:0;box-shadow:none;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;min-height:100vh}.app-panel--fallback{margin:1rem;border-radius:0}.app-panel--player{display:grid;gap:1.25rem}.app-header{display:grid;gap:1rem}.app-header h1{margin:.25rem 0 .5rem;font-size:clamp(1.8rem,3vw,3rem);line-height:1.04}.app-header p{margin:0;max-width:70ch;color:var(--muted)}.app-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem;margin:0}.app-stats div{border-radius:var(--radius-md);padding:.9rem 1rem;background:var(--surface-strong)}.app-stats dt{font-size:.75rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.app-stats dd{margin:.35rem 0 0;font-size:1.5rem;font-weight:700}.eyebrow{margin:0;font-size:.72rem;text-transform:uppercase;letter-spacing:.14em;color:var(--accent)}.lecture-player{display:grid;place-items:center;container-type:size;gap:0;--stage-width-ratio: 16;--stage-height-ratio: 9;--player-font-size: clamp(10px, 1.45cqi, 18px);--square-header-size: 300%;--header-gap: 1rem;--stage-gap: 0rem;--video-size: 30.5%;width:100%;height:100%;min-width:0;min-height:0;padding:0;border:0;border-radius:0;background:#6c6c6c;box-shadow:none;overflow:hidden}.lecture-player__stage{position:relative;container-type:inline-size;width:min(calc(100cqw - 16px),calc((100cqh - 16px) * var(--stage-width-ratio) / var(--stage-height-ratio)));aspect-ratio:var(--stage-width-ratio) / var(--stage-height-ratio);max-width:100%;max-height:100%;min-height:0}.lecture-player__stage-frame{position:relative;width:100%;height:100%;min-height:0;overflow:hidden;background:#000;font-size:var(--player-font-size)}.lecture-player__slide-shell{position:absolute;top:var(--stage-gap);right:var(--stage-gap);bottom:var(--stage-gap);left:calc(var(--video-size) + (var(--stage-gap) * 2));min-height:0;overflow:hidden;margin:1%}.lecture-player__fullscreen-layer{position:absolute;top:0;right:0;bottom:0;left:0;z-index:5;overflow:hidden}.lecture-player__square-header{position:absolute;z-index:4;left:var(--stage-gap);top:var(--header-gap);width:var(--video-size);padding:0 .3rem;color:#ffbd16;font-family:Russo One,Avenir Next,Segoe UI,sans-serif;font-size:var(--square-header-size);line-height:1.1;letter-spacing:.04em;text-align:center;text-transform:uppercase;text-wrap:balance;text-shadow:0 3px 14px rgba(0,0,0,.52)}.lecture-player__gesture-layer{position:relative;height:100%;overflow:hidden;touch-action:none}.lecture-player__empty{display:grid;place-items:center;width:100%;height:100%;min-height:0;padding:clamp(1.5rem,4vw,3rem);border-radius:0;border:0;background:#ffbd16;text-align:center;color:#111;overf
|