:root{--pink:#ff4fa3;--line:#4a2d3d}
*{box-sizing:border-box}
body{margin:0;background:#080608;color:#fff7fb;font-family:Arial,"PingFang SC",sans-serif}
button,input{font:inherit}
.login-shell{min-height:100vh;padding:24px;position:relative;background:radial-gradient(circle at 15% 10%,#32101f,transparent 32%),#070507}
.visual{height:calc(100vh - 48px);min-height:650px;border:1px solid #321d29;border-radius:28px;overflow:hidden;position:relative;background:#030308}
.visual img{width:100%;height:100%;object-fit:cover}
.brand{display:flex;align-items:center;gap:10px;letter-spacing:.16em;font-size:12px;font-weight:700}
.visual .brand{position:absolute;z-index:2;top:28px;left:30px}
.brand b{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--pink);color:#160a10}
.visual>strong{position:absolute;left:34px;bottom:32px;font-size:42px}
.panel{position:absolute;inset:0;display:grid;place-items:center;padding:24px}
.card{width:min(510px,90vw);padding:38px;display:grid;gap:12px;border:1px solid #743956;border-radius:22px;background:#110c10ef;box-shadow:0 28px 90px #000d}
.card h1{text-align:center;font-size:48px;margin:0 0 10px}
.row{width:100%;display:grid;grid-template-columns:minmax(0,1fr) 136px;gap:12px;align-items:stretch}
.card input{display:block;width:100%;height:52px;margin:0;padding:0 16px;border:1px solid #57364a;border-radius:12px;background:#0b080a;color:white;outline:0}
.card button{height:52px;margin:0;border:1px solid #743956;border-radius:12px;background:#25131d;color:#ffacd3;padding:0 18px;font-weight:800;white-space:nowrap}
#send{width:136px}
.primary{width:100%;padding:0 16px!important;background:linear-gradient(100deg,#ff348f,#ff79b8)!important;color:#170910!important}
button:disabled{opacity:.6}
#message{margin:0;text-align:center;color:#f5a9cc;font-size:12px;line-height:18px;min-height:18px}
.course{min-height:100vh;background:radial-gradient(circle at 78% -12%,#4b142f,transparent 31%),#090609}
.course header{max-width:1240px;margin:auto;padding:20px 26px;display:flex;justify-content:space-between;border-bottom:1px solid #34212c}
.viewer{display:flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid #432b39;border-radius:99px}
.viewer i{width:7px;height:7px;border-radius:50%;background:var(--pink)}
.viewer button{border:0;background:none;color:#d89ab9}
.content{max-width:1440px;margin:auto;padding:58px 26px}
.eyebrow{color:var(--pink);font-weight:800;letter-spacing:.2em}
.content h1{font-size:clamp(32px,5vw,50px);margin:0}
.muted{color:#bfaeb8}
.player{position:relative;aspect-ratio:16/9;border:1px solid #583147;border-radius:20px;overflow:hidden;background:#050405}
.wm{position:absolute;z-index:20;color:#ff9dcc;opacity:.46;font-weight:800;transform:rotate(-18deg);pointer-events:none}
.w0{top:15%;left:8%}
.w1{top:25%;right:8%}
.w2{bottom:20%;left:16%}
.w3{bottom:12%;right:13%}
aside{margin-top:22px;padding:18px;border-left:3px solid var(--pink);background:#21131a;color:#bba7b3}
.lesson-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:22px;align-items:start;margin-top:34px}
.watch-column{min-width:0}
.playlist{position:sticky;top:20px;padding:16px;border:1px solid #4d2c3d;border-radius:18px;background:#120c10;box-shadow:0 18px 50px #0007}
.playlist-head{display:flex;align-items:center;justify-content:space-between;padding:5px 4px 14px;font-size:18px;font-weight:800}
.playlist-head small{color:#a98c9b;font-size:12px;font-weight:500}
.lesson{width:100%;display:grid;grid-template-columns:38px 1fr;gap:10px;align-items:center;margin:7px 0;padding:13px 12px;border:1px solid #3b2732;border-radius:12px;background:#0c090b;color:#d9c5cf;text-align:left}
.lesson>b{display:grid;place-items:center;width:34px;height:34px;border-radius:9px;background:#26151e;color:#e6a6c5}
.lesson span{display:grid;gap:5px;min-width:0}
.lesson strong{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lesson small{color:#8f7884;font-size:11px}
.lesson.active{border-color:#b34275;background:linear-gradient(100deg,#2d1421,#170e13);box-shadow:inset 3px 0 var(--pink)}
.lesson.active>b{background:var(--pink);color:#1b0911}
.lesson.active small{color:#ff91c5}
.lesson:disabled{opacity:.56;cursor:not-allowed}
@media(max-width:700px){.login-shell{padding:10px}
.visual{height:45vh;min-height:330px}
.visual>strong{font-size:30px;left:20px;bottom:18px}
.panel{position:static;padding:16px 0}
.card{width:100%;padding:26px 22px;gap:14px}
.card h1{display:none}
.row{grid-template-columns:1fr;gap:14px}
.card input,.card button{height:56px;border-radius:12px}
#send{width:100%}
.content{padding:45px 16px}
.viewer{max-width:220px;overflow:hidden}
}
.player{aspect-ratio:auto;display:flex;flex-direction:column}
.video-stage{position:relative;aspect-ratio:2/1;min-height:0;background:#000}
.video-stage>video,.video-stage .tcplayer,.video-stage .tcp-video,.video-stage .tcp-video video,.video-stage .vjs-tech{width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;object-fit:contain!important}
.video-stage .tcp-video,.video-stage .tcplayer{position:absolute!important;inset:0!important;padding:0!important}
.video-stage video{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:contain!important;transform:none!important}
.custom-controls{position:relative;z-index:40;display:flex;align-items:center;gap:10px;min-height:58px;padding:10px 14px;background:#160d13;border-top:1px solid #583147;color:#fff;font-size:13px}
.custom-controls button,.custom-controls select{height:36px;border:1px solid #75405a;border-radius:8px;background:#2a1621;color:#ffd2e7;padding:0 12px;font-weight:700;cursor:pointer}
.custom-controls input[type=range]{accent-color:var(--pink);cursor:pointer}
#progress{flex:1;min-width:120px}
#volume{width:88px}
.player.expanded{position:fixed;z-index:1000;inset:14px;aspect-ratio:auto;margin:0;border-radius:14px;background:#000}
.player.expanded .video-stage{flex:1;aspect-ratio:auto}
.player-open{overflow:hidden}
.player .tcp-control-bar,.player .vjs-control-bar{display:none!important}
@media(max-width:700px){.video-stage{aspect-ratio:16/9}.player.expanded{inset:0;border-radius:0}.player.expanded .video-stage{aspect-ratio:auto}.custom-controls{gap:6px;padding:8px;font-size:11px;flex-wrap:wrap}.custom-controls button,.custom-controls select{height:32px;padding:0 8px}#progress{order:-1;flex-basis:100%;width:100%}.volume-label{display:none}#volume{width:65px}}
@media(max-width:900px){.lesson-grid{grid-template-columns:1fr}.playlist{position:static;order:2}.playlist-head{padding-top:2px}.lesson{grid-template-columns:42px 1fr}.copyright{margin-bottom:0}}

/* PuppyQuant iPad fullscreen v1
   This class is added only after an iPad enters fullscreen. */
.player.ipad-fullscreen,
.player.ipad-fullscreen:fullscreen,
.player.ipad-fullscreen:-webkit-full-screen {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  width: 100dvw !important;
  height: 100vh !important;
  height: 100dvh !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  aspect-ratio: auto !important;
  display: flex !important;
  flex-direction: column !important;
  background: #000 !important;
}

.player.ipad-fullscreen .video-stage {
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  flex: 1 1 auto !important;
  aspect-ratio: auto !important;
  display: grid !important;
  place-items: center !important;
  background: #000 !important;
}

.player.ipad-fullscreen .custom-controls {
  width: 100% !important;
  flex: 0 0 auto !important;
}

.ipad-fullscreen-open {
  overflow: hidden !important;
}

.ipad-rotate-notice {
  position: absolute;
  z-index: 80;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  max-width: calc(100% - 40px);
  padding: 14px 20px;
  border: 1px solid #75405a;
  border-radius: 12px;
  color: #ffd2e7;
  background: rgba(22, 13, 19, .94);
  font-size: 16px;
  font-weight: 700;
  text-align: center;
  pointer-events: none;
}

.ipad-rotate-notice[hidden] {
  display: none !important;
}

