:root{--ink:#163f38;--deep:#0a302d;--green:#0c715e;--gold:#dfa840;--paper:#fbf8ed;--muted:#6b7f79;--line:rgba(28,76,65,.16);font-family:"LXGW WenKai","Microsoft YaHei",serif;color:var(--ink)}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at 84% 2%,rgba(255,216,115,.52),transparent 22%),radial-gradient(circle at 9% 15%,rgba(174,224,216,.6),transparent 28%),linear-gradient(135deg,#e7f2ec,#cedfd8 45%,#dce9df);}.room-shell{width:min(1180px,calc(100vw - 32px));margin:0 auto;padding:25px 0 42px}.room-topbar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:18px;margin-bottom:20px}.room-brand,.return-link{color:var(--ink);text-decoration:none;font-weight:800}.room-brand{display:flex;align-items:center;gap:10px}.room-brand span{display:grid;place-items:center;width:39px;height:39px;border-radius:12px;background:#f3bc43;color:#173630;font-size:22px}.return-link{justify-self:end;border:1px solid var(--line);border-radius:999px;padding:9px 14px;background:rgba(255,255,255,.5)}.room-title{text-align:center}.room-title small,.card-heading small,.scene-copy p{letter-spacing:.14em;color:#a5731d;font-family:ui-monospace,monospace;font-size:11px;font-weight:800}.room-title h1{margin:3px 0 0;font-size:25px}.room-scene{position:relative;min-height:265px;overflow:hidden;border:1px solid rgba(255,225,146,.56);border-radius:30px;background:radial-gradient(circle at 76% 22%,rgba(254,218,112,.72),transparent 7%),linear-gradient(125deg,#164d45,#0d3935 55%,#1e554a);box-shadow:0 24px 55px rgba(10,53,47,.22);color:#f6fbf3}.scene-window{position:absolute;right:7%;top:0;width:30%;height:76%;border:11px solid rgba(194,155,71,.45);border-top:0;background:linear-gradient(180deg,#74a8b8,#274c5c 58%,#183c41);box-shadow:inset 0 0 45px rgba(6,31,35,.36)}.scene-window::before,.scene-window::after{content:"";position:absolute;background:rgba(205,168,90,.55)}.scene-window::before{top:0;bottom:0;left:50%;width:4px}.scene-window::after{left:0;right:0;top:44%;height:4px}.moon{position:absolute;right:14%;top:16%;width:45px;height:45px;border-radius:50%;background:#fff0b5;box-shadow:0 0 30px #fff3bd}.window-note{position:absolute;left:50%;bottom:9%;width:150px;transform:translateX(-50%);color:rgba(250,252,239,.83);font-size:12px;line-height:1.55;text-align:center}.scene-lamp{position:absolute;right:35%;top:0;width:88px;height:168px}.scene-lamp i{position:absolute;left:42px;top:0;width:3px;height:78px;background:#c79643}.scene-lamp b{position:absolute;top:68px;left:11px;width:66px;height:48px;border-radius:50% 50% 38% 38%;background:linear-gradient(135deg,#edf0cf,#9d9d77);box-shadow:0 26px 48px rgba(255,215,122,.48)}.scene-shelf{position:absolute;right:0;bottom:0;width:53%;height:56px;padding:14px 40px;background:linear-gradient(180deg,#775336,#4d3427);display:flex;gap:11px;align-items:end}.scene-shelf span{padding:7px 6px 4px;background:#d4a14a;color:#fff7dd;font-size:12px;transform:rotate(-2deg)}.scene-shelf span:nth-child(2){background:#7a9f7d;height:37px;transform:rotate(3deg)}.scene-shelf span:nth-child(3){background:#b4614f;height:33px}.scene-shelf span:nth-child(4){background:#576e8f;height:39px}.scene-copy{position:absolute;z-index:2;left:clamp(26px,5vw,70px);top:54px;max-width:52%}.scene-copy h2{margin:8px 0 17px;color:#fffdf1;font-size:clamp(26px,3.8vw,48px);line-height:1.2}.scene-copy span{display:inline-flex;align-items:center;gap:7px;color:#bde8d7;font-size:14px}.scene-copy span::before{content:"";width:8px;height:8px;border-radius:50%;background:#58e1af;box-shadow:0 0 11px #58e1af}.online-badge{position:absolute;z-index:2;left:clamp(26px,5vw,70px);bottom:29px;display:flex;align-items:center;gap:8px;border:1px solid rgba(238,223,162,.38);border-radius:17px;padding:9px 14px;background:rgba(0,31,28,.29);backdrop-filter:blur(8px)}.online-badge i{width:9px;height:9px;border-radius:50%;background:#63e1b0}.online-badge strong{font-size:21px;color:#ffda78}.online-badge span{font-size:13px}.room-grid{display:grid;grid-template-columns:1.06fr .94fr;gap:18px;margin-top:18px}.room-card{padding:24px;border:1px solid rgba(255,255,255,.75);border-radius:26px;background:rgba(255,253,243,.82);box-shadow:0 15px 35px rgba(15,67,57,.1);backdrop-filter:blur(10px)}.focus-card{grid-row:span 2;background:linear-gradient(145deg,rgba(255,252,238,.94),rgba(235,246,237,.87))}.partner-card{grid-column:2}.card-heading{display:flex;align-items:start;justify-content:space-between;gap:12px}.card-heading h2{margin:3px 0 0;font-size:22px}.card-heading>span{padding:6px 9px;border-radius:999px;background:#eaf3e9;color:#47766a;font-size:12px;font-weight:800}.timer-face{display:grid;place-items:center;min-height:175px;margin:22px 0 14px;border:8px solid rgba(17,109,90,.15);border-radius:50%;background:radial-gradient(circle,#fffef7,#e4f1e9);box-shadow:inset 0 0 28px rgba(12,100,83,.08)}.timer-face time{font-family:ui-monospace,Consolas,monospace;color:#0b6655;font-size:clamp(46px,7vw,70px);font-weight:800;letter-spacing:-.07em;line-height:1}.timer-face span{margin-top:8px;color:#6b827a;font-size:13px}.timer-presets{display:flex;justify-content:center;gap:8px;flex-wrap:wrap}.timer-presets button,.quiet{border:1px solid var(--line);border-radius:999px;padding:8px 12px;background:#fffdf8;color:#52736a;font:inherit;font-size:13px;font-weight:800;cursor:pointer}.timer-presets button.is-active{border-color:#0c715e;background:#0c715e;color:#fff}.field-label{display:grid;gap:7px;margin:21px 0 12px;color:#52736a;font-size:13px;font-weight:800}.field-label select,.profile-fields select{width:100%;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.85);padding:10px 12px;color:var(--ink);font:inherit}.timer-actions{display:flex;gap:9px}.timer-actions button{min-height:43px;font:inherit;font-weight:800;cursor:pointer}.primary{flex:1;border:0;border-radius:13px;background:linear-gradient(135deg,#0b806a,#075548);color:#fff}.quiet{min-width:76px;border-radius:13px}.room-hint{margin:14px 0 0;color:#789087;font-size:12px;line-height:1.55}.live-label{color:#0e875f!important;background:#e6f8ee!important}.seat-lead,.partner-lead{margin:15px 0;color:#617d74;font-size:13px;line-height:1.55}.seat-list{display:grid;grid-template-columns:1fr 1fr;gap:10px}.seat-list article{display:flex;align-items:center;gap:9px;padding:11px;border-radius:15px;background:#f1f7ee}.seat-icon{display:grid;place-items:center;width:31px;height:31px;border-radius:10px;background:#d5e9d9;color:#0d705b;font-weight:800}.seat-list strong{display:block;font-family:ui-monospace,monospace;font-size:23px;line-height:1}.seat-list small{display:block;margin-top:3px;color:#5d7c72;font-size:11px}.profile-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px}.profile-fields label{display:grid;gap:6px;color:#52736a;font-size:12px;font-weight:800}.profile-fields .wide{grid-column:1/-1}.match-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:17px}.match-grid article{padding:11px 7px;border-radius:14px;background:#e8f3ed;text-align:center}.match-grid strong{display:block;color:#0b6b57;font-family:ui-monospace,monospace;font-size:25px;line-height:1}.match-grid span{display:block;margin-top:4px;color:#648078;font-size:11px}.match-note{margin:13px 0 0;color:#698179;font-size:12px;line-height:1.55}.room-footer{padding:20px 8px 0;color:#607b72;font-size:12px;text-align:center}@media(max-width:760px){.room-shell{width:min(100vw - 20px,1180px);padding-top:14px}.room-topbar{grid-template-columns:1fr auto}.room-title{grid-row:2;grid-column:1/-1;text-align:left}.return-link{font-size:0}.return-link::after{content:"返回";font-size:13px}.room-scene{min-height:310px}.scene-window{right:-5%;width:50%;height:65%}.scene-lamp{right:43%}.scene-shelf{width:100%;padding-left:52%}.scene-copy{top:40px;max-width:70%}.scene-copy h2{font-size:30px}.room-grid{grid-template-columns:1fr}.focus-card,.partner-card{grid-column:auto;grid-row:auto}.room-card{padding:19px;border-radius:22px}.seat-list{grid-template-columns:1fr 1fr}.timer-face{min-height:165px}}

/* Keep the room greeting and active-seat indicator in separate visual lanes. */
@media (min-width: 761px) {
  .scene-copy { max-width: 58%; }
  .scene-copy h2 { font-size: clamp(26px, 3.1vw, 42px); white-space: nowrap; }
}
@media (max-width: 760px) {
  .room-scene { min-height: 344px; }
  .scene-copy { max-width: 76%; }
  .online-badge { bottom: 22px; }
}

/* Interactive classroom: each active anonymous visitor may temporarily claim one desk. */
.classroom-layout{display:grid;grid-template-columns:minmax(310px,.72fr) minmax(0,1.28fr);gap:18px;margin-top:18px}.classroom-side{display:grid;gap:18px;align-content:start}.classroom-side .focus-card,.classroom-side .partner-card{grid-column:auto;grid-row:auto}.classroom-hall{position:relative;min-height:720px;overflow:hidden;border:1px solid rgba(255,255,255,.75);border-radius:27px;background:linear-gradient(180deg,#e9dfbd 0 23%,#d4b986 23% 24%,#c89e68 24% 100%);box-shadow:0 15px 35px rgba(15,67,57,.1)}.classroom-hall::before{content:"";position:absolute;inset:24% 0 0;background:repeating-linear-gradient(90deg,rgba(104,65,37,.13) 0 2px,transparent 2px 18%),repeating-linear-gradient(0deg,rgba(103,61,31,.1) 0 2px,transparent 2px 23%);opacity:.7}.classroom-board{position:relative;z-index:1;width:min(83%,620px);margin:30px auto 0;padding:22px 28px;border:10px solid #8d633d;border-radius:7px;background:linear-gradient(135deg,#0e4b41,#083a35);box-shadow:inset 0 0 35px rgba(255,255,255,.05),0 9px 15px rgba(92,57,32,.25);color:#fffdf2;text-align:center}.classroom-board span{color:#e9c967;font-family:ui-monospace,monospace;font-size:11px;font-weight:800;letter-spacing:.12em}.classroom-board h2{margin:8px 0 12px;font-size:clamp(21px,2.1vw,32px);line-height:1.2}.classroom-board p{display:inline-flex;align-items:center;gap:6px;margin:0;color:#d8efe2;font-size:13px}.classroom-board p i{width:8px;height:8px;border-radius:50%;background:#63dfae;box-shadow:0 0 10px #63dfae}.classroom-board p strong{color:#ffd976;font-family:ui-monospace,monospace;font-size:18px}.classroom-legend{position:relative;z-index:1;display:flex;justify-content:center;gap:17px;flex-wrap:wrap;margin:18px 0;color:#6e5137;font-size:12px;font-weight:800}.classroom-legend span{display:inline-flex;align-items:center;gap:5px}.classroom-legend i{width:12px;height:12px;border-radius:4px;border:1px solid #af8058;background:#f7e9bd}.classroom-legend i.mine{border-color:#0b7b65;background:#54ca9b}.classroom-legend i.busy{border-color:#9d6840;background:#9b6d4b}.classroom-seats{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,minmax(110px,1fr));gap:clamp(21px,2.2vw,35px) clamp(23px,3vw,50px);width:min(88%,680px);margin:38px auto 20px;padding:20px 7% 32px}.classroom-seat{position:relative;min-height:100px;border:0;background:transparent;color:#6a4c35;font:inherit;cursor:pointer}.classroom-seat::before{content:"";position:absolute;z-index:0;left:7%;right:7%;bottom:12px;height:44px;border:4px solid #876244;border-bottom-width:9px;border-radius:6px;background:linear-gradient(135deg,#f1d28e,#c78f58);box-shadow:0 7px 0 #79543a}.classroom-seat::after{content:"";position:absolute;z-index:0;left:18%;right:18%;bottom:0;height:18px;border-radius:4px;background:#72503a;box-shadow:6px 10px 0 -4px #4f372a,-6px 10px 0 -4px #4f372a}.classroom-seat .seat-number{position:absolute;z-index:3;right:11%;top:1px;display:grid;place-items:center;width:21px;height:21px;border-radius:50%;background:rgba(255,251,230,.9);font-family:ui-monospace,monospace;font-size:10px;font-weight:800}.classroom-seat .seat-person{position:absolute;z-index:2;left:50%;bottom:28px;width:34px;height:43px;transform:translateX(-50%);border-radius:16px 16px 8px 8px;background:#d8b18b;opacity:0;transition:opacity .2s ease}.classroom-seat .seat-person::before{content:"";position:absolute;left:50%;top:-15px;width:26px;height:26px;transform:translateX(-50%);border-radius:50%;background:#f2d0a7;box-shadow:inset -5px 0 0 rgba(98,59,37,.13)}.classroom-seat .seat-person::after{content:"";position:absolute;left:50%;top:-18px;width:28px;height:14px;transform:translateX(-50%);border-radius:17px 17px 5px 5px;background:#37463c}.classroom-seat .seat-task{position:absolute;z-index:3;left:50%;bottom:-20px;transform:translateX(-50%);width:max-content;max-width:116px;overflow:hidden;color:#6c5139;font-size:11px;font-weight:800;text-overflow:ellipsis;white-space:nowrap}.classroom-seat:hover:not(:disabled){transform:translateY(-4px)}.classroom-seat.is-occupied{cursor:not-allowed}.classroom-seat.is-occupied .seat-person{opacity:1}.classroom-seat.is-occupied .seat-number{background:#a66b42;color:#fff}.classroom-seat.is-mine .seat-person{background:#4bbd91}.classroom-seat.is-mine .seat-person::after{background:#224b40}.classroom-seat.is-mine::before{border-color:#0a765f;box-shadow:0 7px 0 #075648,0 0 0 5px rgba(92,218,165,.33)}.classroom-seat.is-mine .seat-number{background:#0a765f;color:#fff}.seat-selection-note{position:relative;z-index:1;margin:28px 28px 24px;padding:12px 14px;border-radius:13px;background:rgba(255,248,223,.62);color:#6b523d;font-size:12px;line-height:1.55;text-align:center}.seat-selection-note.is-error{background:#fff0e7;color:#a74625}@media(max-width:980px){.classroom-layout{grid-template-columns:1fr}.classroom-hall{min-height:650px}.classroom-side{grid-template-columns:1fr 1fr}.classroom-side .partner-card{align-self:stretch}}@media(max-width:650px){.classroom-side{grid-template-columns:1fr}.classroom-hall{min-height:620px;border-radius:22px}.classroom-board{width:90%;padding:18px 14px;border-width:7px}.classroom-board h2{font-size:22px}.classroom-seats{grid-template-columns:repeat(3,1fr);gap:23px 12px;width:96%;padding-left:2%;padding-right:2%}.classroom-seat{min-height:88px}.classroom-seat::before{height:37px}.classroom-seat .seat-person{bottom:25px;width:28px;height:35px}.classroom-seat .seat-person::before{width:22px;height:22px}.classroom-seat .seat-task{font-size:9px;bottom:-18px;max-width:84px}}

/* Desktop immersive classroom composition: blackboard front, six columns of desks, floating utility panels. */
@media (min-width: 981px) {
  body { background: linear-gradient(180deg,#f5eee4,#d9b990 55%,#9f704b) !important; }
  .room-shell { width: 100%; margin: 0; padding: 0; }
  .room-topbar { grid-template-columns: 1fr auto 1fr; min-height: 58px; margin: 0; padding: 0 38px; background: rgba(255,253,247,.94); box-shadow: 0 2px 11px rgba(76,48,31,.12); }
  .room-title { display:flex; align-items:center; gap:14px; } .room-title small { order:2; color:#8e7450; } .room-title h1 { margin:0; font-size:20px; }
  .room-scene { min-height: 315px; border:0; border-radius:0; box-shadow:none; background:linear-gradient(90deg,rgba(255,236,202,.83),rgba(222,194,151,.67) 17%,rgba(104,73,51,.12) 17%,rgba(104,73,51,.12) 83%,rgba(242,226,201,.72) 83%),linear-gradient(180deg,#e8d4b7,#c5976b); }
  .room-scene::before { content:""; position:absolute; inset:0; background:linear-gradient(90deg,transparent 0 14%,rgba(255,249,226,.48) 14% 14.5%,transparent 14.5% 84%,rgba(255,249,226,.36) 84% 84.5%,transparent 84.5%); pointer-events:none; }
  .scene-window { right:auto; left:4%; top:20px; width:16%; height:67%; border-width:7px; opacity:.78; }
  .scene-lamp { right:50%; transform:translateX(50%); top:0; }
  .scene-shelf { right:13%; width:22%; height:43px; padding:7px 17px; }
  .scene-copy { left:50%; top:61px; max-width:620px; transform:translateX(-50%); text-align:center; }
  .scene-copy p { color:#d8bd80; }.scene-copy h2 { font-size:clamp(32px,3vw,52px); white-space:nowrap; }.scene-copy span { justify-content:center; }
  .online-badge { left:50%; bottom:26px; transform:translateX(-50%); }
  .classroom-layout { display:block; position:relative; margin:0; }
  .classroom-side { display:contents; }
  .classroom-side .focus-card, .classroom-side .partner-card { position:absolute; z-index:7; width:286px; margin:0; padding:18px; border-color:rgba(255,255,255,.85); border-radius:21px; background:rgba(255,253,245,.93); box-shadow:0 17px 34px rgba(66,42,24,.24); }
  .classroom-side .focus-card { left:30px; bottom:24px; }.classroom-side .partner-card { right:28px; top:25px; }
  .classroom-side .focus-card .timer-face { min-height:112px; margin:13px 0 10px; border-width:5px; }.classroom-side .focus-card .timer-face time{font-size:42px;}.classroom-side .focus-card .timer-presets{gap:5px;}.classroom-side .focus-card .timer-presets button{padding:6px 8px;font-size:11px;}.classroom-side .focus-card .field-label{margin:13px 0 8px;}.classroom-side .focus-card .room-hint{margin-top:8px;}.classroom-side .focus-card .timer-actions button{min-height:38px;}
  .classroom-side .partner-card .partner-lead{margin:9px 0;}.classroom-side .partner-card .profile-fields{gap:7px;}.classroom-side .partner-card .profile-fields select{padding:7px 8px;}.classroom-side .partner-card .match-grid{margin-top:10px;}.classroom-side .partner-card .match-grid article{padding:8px 4px;}.classroom-side .partner-card .match-note{margin-top:8px;}
  .classroom-hall { min-height: calc(100vh - 373px); border:0; border-radius:0; box-shadow:none; background:linear-gradient(180deg,#ecd9ae 0 13%,#d5b080 13% 14%,#bb8652 14% 100%); }
  .classroom-hall::before { inset:14% 0 0; background:repeating-linear-gradient(90deg,rgba(97,56,30,.17) 0 2px,transparent 2px 16.666%),repeating-linear-gradient(0deg,rgba(111,67,34,.16) 0 2px,transparent 2px 25%); }
  .classroom-board { width:min(58%,780px); margin:0 auto; transform:translateY(-43%); padding:18px 24px; border-width:8px; }.classroom-board h2{font-size:clamp(23px,2.2vw,34px);}
  .classroom-legend { margin:-39px 0 10px; }
  .classroom-seats { grid-template-columns:repeat(6,minmax(84px,1fr)); gap:clamp(13px,1.2vw,23px) clamp(14px,1.6vw,30px); width:calc(100% - 350px); min-width:680px; margin:0 auto 14px; padding:8px 2.5% 35px; }
  .classroom-seat { min-height:83px; }.classroom-seat::before{height:36px;border-width:3px;border-bottom-width:7px;}.classroom-seat::after{height:14px;}.classroom-seat .seat-person{bottom:22px;width:28px;height:35px;}.classroom-seat .seat-person::before{top:-13px;width:22px;height:22px;}.classroom-seat .seat-person::after{top:-16px;width:24px;height:12px;}.classroom-seat .seat-task{bottom:-17px;font-size:9px;}.classroom-seat .seat-number{right:7%;top:0;width:18px;height:18px;font-size:9px;}
  .seat-selection-note { width:max-content; max-width:520px; margin:12px auto 20px; }
  .room-footer { position:absolute; z-index:8; right:28px; bottom:9px; width:286px; padding:0; color:rgba(255,248,231,.76); text-align:center; font-size:10px; }
}

/* User-authorized reference rendering: desktop uses the supplied classroom artwork as the immersive room surface. */
@media (min-width: 981px) {
  html, body { min-height: 100%; background: #f4efe7 !important; }
  body { background-image: url("assets/study-room-authorized-reference.png") !important; background-position: center top !important; background-repeat: no-repeat !important; background-size: 100% auto !important; }
  .room-shell { position: relative; width: 100vw !important; min-height: max(100vh, calc(100vw * .5625)); overflow: hidden; background: transparent !important; }
  .room-topbar, .room-scene { visibility: hidden !important; pointer-events: none !important; height: 0 !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; }
  .classroom-layout, .classroom-hall { position: absolute !important; inset: 0 !important; display: block !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; overflow: visible !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }
  .classroom-hall::before, .classroom-board, .classroom-legend, .seat-selection-note, .room-footer, .classroom-side .partner-card { display: none !important; }
  .classroom-side { display: contents !important; }
  .classroom-side .focus-card { position: absolute !important; z-index: 10 !important; left: .8% !important; bottom: 6.2% !important; width: 17.2% !important; height: 20.7% !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; opacity: .015 !important; }
  .classroom-side .focus-card * { pointer-events: auto !important; }
  .classroom-seats { position: absolute !important; z-index: 9 !important; left: 7.5% !important; right: 19.3% !important; bottom: 6.2% !important; display: grid !important; grid-template-columns: repeat(6, 1fr) !important; grid-template-rows: repeat(6, 1fr) !important; gap: 0 !important; width: auto !important; min-width: 0 !important; height: 49.8% !important; margin: 0 !important; padding: 0 !important; }
  .classroom-seat { min-height: 0 !important; width: 100% !important; height: 100% !important; transform: none !important; }
  .classroom-seat::before, .classroom-seat::after, .classroom-seat .seat-number, .classroom-seat .seat-person, .classroom-seat .seat-task { display: none !important; }
  .classroom-seat.is-mine { border-radius: 10px !important; background: rgba(0, 131, 103, .22) !important; box-shadow: inset 0 0 0 3px rgba(31, 178, 140, .9) !important; }
  .classroom-seat.is-mine::after { display: block !important; content: "我的座位" !important; position: absolute !important; inset: 50% auto auto 50% !important; width: max-content !important; height: auto !important; transform: translate(-50%, -50%) !important; padding: 6px 10px !important; border-radius: 8px !important; background: rgba(2, 106, 83, .9) !important; color: #fff !important; box-shadow: none !important; font-size: clamp(11px, .8vw, 15px) !important; font-weight: 800 !important; }
}

/* v38 clean occupied-seat layer: card mask, transparent portrait, and task badge only. */
@media (min-width:981px){
html,body{min-height:100%;background:#f4f0e8!important}body{background:#f4f0e8!important}.room-shell{position:relative!important;width:100%!important;margin:0!important;padding:0 0 38px!important;overflow:visible!important}.room-topbar,.room-scene{display:none!important}.classroom-layout{position:relative!important;display:flex!important;flex-direction:column!important;gap:26px!important;margin:0!important;padding:0!important}.classroom-hall{order:1!important;position:relative!important;width:100%!important;min-height:0!important;aspect-ratio:1561/1008!important;overflow:hidden!important;border:0!important;border-radius:0!important;background:url("assets/study-room-empty-seats-6x6.png") center top/100% 100% no-repeat!important;box-shadow:none!important}.classroom-hall::before{content:""!important;display:block!important;position:absolute!important;z-index:3!important;left:43.7%!important;top:30.4%!important;width:37.7%!important;height:4.35%!important;border-radius:5px!important;background:#0c4036!important;opacity:1!important;pointer-events:none!important}.classroom-board,.classroom-legend,.seat-selection-note,.reference-board-live{display:none!important}.classroom-seats{position:absolute!important;z-index:8!important;inset:0!important;width:100%!important;height:100%!important;min-width:0!important;display:block!important;margin:0!important;padding:0!important}.classroom-seat{position:absolute!important;z-index:8!important;display:block!important;width:11.45%!important;height:6.6%!important;min-height:0!important;margin:0!important;padding:0!important;overflow:visible!important;transform:none!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;color:transparent!important;cursor:pointer!important}.classroom-seat::before,.classroom-seat::after,.classroom-seat .seat-number{display:none!important}.classroom-seat:hover:not(:disabled){outline:2px solid rgba(8,123,100,.48)!important;outline-offset:2px!important;border-radius:8px!important}.classroom-seat.is-occupied::before{content:""!important;display:block!important;position:absolute!important;z-index:1!important;inset:0!important;border:0!important;border-radius:8px!important;background:rgba(255,251,244,.97)!important;box-shadow:inset 0 0 0 1px rgba(150,109,65,.16)!important}.classroom-seat.is-mine::before{box-shadow:inset 0 0 0 2px #0a9a7d,0 0 0 2px rgba(255,255,255,.75)!important}.classroom-seat .seat-person{display:none!important}.classroom-seat.is-occupied .seat-person{display:block!important;position:absolute!important;z-index:2!important;left:50%!important;bottom:-20%!important;width:47%!important;height:122%!important;overflow:visible!important;transform:translateX(-50%)!important;background:none!important;background-image:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;filter:drop-shadow(0 1px 1px rgba(43,25,10,.22))!important;opacity:1!important}.classroom-seat.is-occupied .seat-person::before,.classroom-seat.is-occupied .seat-person::after{content:none!important;display:none!important;background:none!important}.classroom-seat.is-occupied .seat-portrait{display:block!important;width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;object-fit:contain!important;object-position:center bottom!important;transform:scale(var(--portrait-scale,1))!important;transform-origin:center bottom!important}.classroom-seat.is-occupied .portrait-1{--portrait-scale:.84}.classroom-seat.is-occupied .portrait-2{--portrait-scale:.92}.classroom-seat.is-occupied .portrait-3{--portrait-scale:1.17}.classroom-seat.is-occupied .portrait-4{--portrait-scale:1}.classroom-seat.is-occupied .portrait-5{--portrait-scale:.72}.classroom-seat .seat-task{display:none!important}.classroom-seat.is-occupied .seat-task{display:block!important;position:absolute!important;z-index:3!important;top:7%!important;right:6%!important;left:auto!important;bottom:auto!important;width:max-content!important;max-width:57%!important;margin:0!important;padding:3px 7px!important;overflow:hidden!important;transform:none!important;border:0!important;border-radius:999px!important;background:#087b64!important;box-shadow:0 1px 3px rgba(78,47,24,.14)!important;color:#fff!important;font-size:clamp(9px,.69vw,12px)!important;font-weight:800!important;line-height:1.15!important;text-overflow:ellipsis!important;white-space:nowrap!important}
/* Exact A1–F6 hit areas aligned to the 6 × 6 empty-seat image. */
.classroom-seat:nth-child(1){left:11.35%!important;top:42.65%!important}.classroom-seat:nth-child(2){left:26.68%!important;top:42.65%!important}.classroom-seat:nth-child(3){left:41.85%!important;top:42.65%!important}.classroom-seat:nth-child(4){left:56.95%!important;top:42.65%!important}.classroom-seat:nth-child(5){left:71.15%!important;top:42.65%!important}.classroom-seat:nth-child(6){left:84.85%!important;top:42.65%!important}.classroom-seat:nth-child(7){left:8.65%!important;top:50.1%!important}.classroom-seat:nth-child(8){left:24.4%!important;top:50.1%!important}.classroom-seat:nth-child(9){left:40.15%!important;top:50.1%!important}.classroom-seat:nth-child(10){left:55.85%!important;top:50.1%!important}.classroom-seat:nth-child(11){left:70.6%!important;top:50.1%!important}.classroom-seat:nth-child(12){left:84.95%!important;top:50.1%!important}.classroom-seat:nth-child(13){left:5.05%!important;top:57.5%!important}.classroom-seat:nth-child(14){left:22.2%!important;top:57.5%!important}.classroom-seat:nth-child(15){left:39.35%!important;top:57.5%!important}.classroom-seat:nth-child(16){left:55.4%!important;top:57.5%!important}.classroom-seat:nth-child(17){left:71.2%!important;top:57.5%!important}.classroom-seat:nth-child(18){left:87.15%!important;top:57.5%!important}.classroom-seat:nth-child(19){left:.15%!important;top:65%!important}.classroom-seat:nth-child(20){left:18%!important;top:65%!important}.classroom-seat:nth-child(21){left:35.85%!important;top:65%!important}.classroom-seat:nth-child(22){left:53.75%!important;top:65%!important}.classroom-seat:nth-child(23){left:71.6%!important;top:65%!important}.classroom-seat:nth-child(24){left:89.45%!important;top:65%!important}.classroom-seat:nth-child(25){left:0!important;top:72.55%!important}.classroom-seat:nth-child(26){left:18.05%!important;top:72.55%!important}.classroom-seat:nth-child(27){left:36.1%!important;top:72.55%!important}.classroom-seat:nth-child(28){left:54.2%!important;top:72.55%!important}.classroom-seat:nth-child(29){left:72.25%!important;top:72.55%!important}.classroom-seat:nth-child(30){left:90.3%!important;top:72.55%!important}.classroom-seat:nth-child(31){left:0!important;top:80.15%!important}.classroom-seat:nth-child(32){left:18.15%!important;top:80.15%!important}.classroom-seat:nth-child(33){left:36.25%!important;top:80.15%!important}.classroom-seat:nth-child(34){left:54.35%!important;top:80.15%!important}.classroom-seat:nth-child(35){left:72.4%!important;top:80.15%!important}.classroom-seat:nth-child(36){left:90.45%!important;top:80.15%!important}
.classroom-side{order:2!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:20px!important;width:min(1080px,calc(100% - 48px))!important;margin:0 auto!important;padding:0!important}.classroom-side .focus-card,.classroom-side .partner-card{display:block!important;position:static!important;width:auto!important;height:auto!important;margin:0!important;padding:24px!important;transform:none!important;border:1px solid rgba(224,216,201,.9)!important;border-radius:22px!important;background:#fffdf8!important;box-shadow:0 12px 30px rgba(71,54,35,.1)!important;opacity:1!important}.reference-live-seat-summary,.reference-match-toggle,.reference-focus-toggle,.reference-sidebar-surface,.reference-toolbar-cleaner{display:none!important}.reference-invite{position:static!important;display:block!important;width:min(1080px,calc(100% - 48px))!important;height:auto!important;margin:18px auto 0!important;padding:14px!important;border:1px solid rgba(224,216,201,.9)!important;border-radius:14px!important;background:#fffdf8!important;color:#23423b!important;font:800 15px inherit!important;text-align:center!important}.room-footer{position:static!important;width:min(1080px,calc(100% - 48px))!important;margin:18px auto 0!important;padding:0!important;color:#708179!important;text-align:center!important}
/* Real wall clock; dark mode has white hour/minute hands and a red second hand. */
.reference-wall-clock{display:block!important;position:absolute!important;z-index:12!important;left:25.7vw!important;top:3.35vw!important;width:6.6vw!important;aspect-ratio:1!important;border:3px solid #4b4945!important;border-radius:50%!important;background:repeating-conic-gradient(from -1deg,#56504a 0 1deg,transparent 1deg 30deg),radial-gradient(circle,#fffdf3 0 68%,#e5dfd0 69% 100%)!important;box-shadow:0 2px 5px rgba(43,33,27,.38)!important}.reference-wall-clock::before{content:""!important;position:absolute!important;inset:9%!important;border:1px solid rgba(77,70,62,.55)!important;border-radius:50%!important}.reference-wall-clock i{position:absolute!important;z-index:4!important;color:#353432!important;font-family:Arial,sans-serif!important;font-size:clamp(6px,.5vw,9px)!important;font-style:normal!important;font-weight:700!important;line-height:1!important;transform:translate(-50%,-50%)!important}.reference-wall-clock .n12{left:50%;top:13%}.reference-wall-clock .n1{left:69%;top:18%}.reference-wall-clock .n2{left:84%;top:33%}.reference-wall-clock .n3{left:88%;top:52%}.reference-wall-clock .n4{left:82%;top:70%}.reference-wall-clock .n5{left:67%;top:84%}.reference-wall-clock .n6{left:50%;top:89%}.reference-wall-clock .n7{left:32%;top:84%}.reference-wall-clock .n8{left:18%;top:70%}.reference-wall-clock .n9{left:12%;top:52%}.reference-wall-clock .n10{left:17%;top:33%}.reference-wall-clock .n11{left:32%;top:18%}.reference-wall-clock span{position:absolute!important;z-index:5!important;left:50%!important;bottom:50%!important;border-radius:4px!important;background:#1e2523!important;transform-origin:50% 100%!important}.reference-wall-clock .clock-hour{width:5%!important;height:25%!important}.reference-wall-clock .clock-minute{width:3.5%!important;height:36%!important}.reference-wall-clock .clock-second{z-index:6!important;width:1.45%!important;height:42%!important;background:#d4413c!important;box-shadow:0 0 2px rgba(120,24,20,.8)!important}.reference-wall-clock b{position:absolute!important;z-index:7!important;left:50%!important;top:50%!important;width:7%!important;aspect-ratio:1!important;transform:translate(-50%,-50%)!important;border-radius:50%!important;background:#d4413c!important}
}
body.theme-dark .reference-wall-clock{border-color:#f0ead7!important;background:repeating-conic-gradient(from -1deg,rgba(255,255,255,.78) 0 1deg,transparent 1deg 30deg),radial-gradient(circle,#27352d 0 68%,#101814 69% 100%)!important;box-shadow:0 2px 6px rgba(0,0,0,.55)!important}body.theme-dark .reference-wall-clock::before{border-color:rgba(255,255,255,.62)!important}body.theme-dark .reference-wall-clock i{color:#fffdf1!important;text-shadow:0 1px 1px #000!important}body.theme-dark .reference-wall-clock .clock-hour,body.theme-dark .reference-wall-clock .clock-minute{background:#fffdf1!important;box-shadow:0 0 2px #000!important}body.theme-dark .reference-wall-clock .clock-second,body.theme-dark .reference-wall-clock b{background:#ff514a!important}
@media(max-width:980px){.reference-wall-clock{display:none!important}.room-shell{width:min(760px,calc(100% - 26px));margin:14px auto}.classroom-side{grid-template-columns:1fr!important;width:100%!important}.classroom-hall{aspect-ratio:auto!important;min-height:560px!important;background:linear-gradient(145deg,#0d4b42,#e7dcb8)!important}.classroom-hall::before{display:none!important}.classroom-seats{position:relative!important;display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:15px!important;padding:24px!important}.classroom-seat{position:relative!important;left:auto!important;top:auto!important;width:auto!important;height:88px!important;border-radius:12px!important;background:#c48e57!important;color:#64462e!important}.classroom-seat::before{display:block!important;content:""!important;position:absolute!important;left:8%!important;right:8%!important;bottom:14px!important;height:38px!important;border-radius:7px!important;background:#f7e5bf!important;box-shadow:0 7px 0 #79543a!important}.classroom-seat.is-occupied::before{inset:0!important;background:#fffaf3!important;box-shadow:none!important}.classroom-seat.is-occupied .seat-person{height:115%!important;bottom:-14%!important;width:52%!important}}

/* v40 — final-row perspective calibration and clean portrait overlay. */
@media (min-width:981px){
  /* Do not place a dark or white card behind a seated portrait. */
  .classroom-seat.is-occupied::before{display:none!important}
  /* Portraits sit slightly left of the card centre, matching the desk perspective. */
  .classroom-seat.is-occupied .seat-person{left:47%!important}
  .classroom-seat.is-occupied .seat-task{right:4%!important;top:5%!important}
  /* D row: original hit areas were shifted left of the printed desks. */
  .classroom-seat:nth-child(19){left:1.45%!important}
  .classroom-seat:nth-child(20){left:19.30%!important}
  .classroom-seat:nth-child(21){left:37.15%!important}
  .classroom-seat:nth-child(22){left:55.05%!important}
  .classroom-seat:nth-child(23){left:72.90%!important}
  .classroom-seat:nth-child(24){left:90.75%!important}
  /* E/F rows recede lower in the source photo; align to their actual cards. */
  .classroom-seat:nth-child(25),.classroom-seat:nth-child(26),.classroom-seat:nth-child(27),.classroom-seat:nth-child(28),.classroom-seat:nth-child(29),.classroom-seat:nth-child(30){top:74.75%!important}
  .classroom-seat:nth-child(31),.classroom-seat:nth-child(32),.classroom-seat:nth-child(33),.classroom-seat:nth-child(34),.classroom-seat:nth-child(35),.classroom-seat:nth-child(36){top:83.15%!important}
}
@media (min-width:981px){.classroom-seat:nth-child(31),.classroom-seat:nth-child(32),.classroom-seat:nth-child(33),.classroom-seat:nth-child(34),.classroom-seat:nth-child(35),.classroom-seat:nth-child(36){top:89.5%!important}}

/* v42 — high-contrast dark-mode wall-clock hands. */
body.theme-dark .reference-wall-clock .clock-hour{z-index:8!important;width:8%!important;height:27%!important;background:#fff8d7!important;border:1px solid #17130f!important;box-shadow:0 0 3px rgba(0,0,0,.95),0 0 2px #fff8d7!important}
body.theme-dark .reference-wall-clock .clock-minute{z-index:9!important;width:5%!important;height:41%!important;background:#fffdf4!important;border:1px solid #17130f!important;box-shadow:0 0 3px rgba(0,0,0,.95),0 0 2px #fffdf4!important}
body.theme-dark .reference-wall-clock .clock-second{z-index:10!important;width:1.6%!important;height:44%!important;background:#ff4e47!important;box-shadow:0 0 4px rgba(255,78,71,.9)!important}
body.theme-dark .reference-wall-clock b{z-index:11!important;width:9%!important;background:#ff514a!important;box-shadow:0 0 3px rgba(0,0,0,.9)!important}

/* v43 — keep final-row portraits above the photographed chair backs. */
@media (min-width:981px){.classroom-seat:nth-child(31).is-occupied .seat-person,.classroom-seat:nth-child(32).is-occupied .seat-person,.classroom-seat:nth-child(33).is-occupied .seat-person,.classroom-seat:nth-child(34).is-occupied .seat-person,.classroom-seat:nth-child(35).is-occupied .seat-person,.classroom-seat:nth-child(36).is-occupied .seat-person{width:38%!important;height:86%!important;bottom:4%!important}}

/* v44 — wall-clock spacing and coloured hands. */
@media (min-width:981px){.reference-wall-clock{left:23.8vw!important}.reference-wall-clock .clock-hour{background:#7c3aed!important;border-color:#38205f!important;box-shadow:0 0 3px rgba(64,29,104,.75)!important}.reference-wall-clock .clock-minute{background:#14a874!important;border-color:#07583e!important;box-shadow:0 0 3px rgba(5,83,57,.75)!important}body.theme-dark .reference-wall-clock .clock-hour{background:#9d6cff!important;border-color:#2d164d!important;box-shadow:0 0 4px rgba(178,133,255,.86)!important}body.theme-dark .reference-wall-clock .clock-minute{background:#35d497!important;border-color:#073f2d!important;box-shadow:0 0 4px rgba(91,236,171,.82)!important}}

/* v45 — real-time blackboard attendance strip. */
@media (min-width:981px){.classroom-hall::before{display:none!important}.reference-board-live{display:flex!important;position:absolute!important;z-index:11!important;left:43.7%!important;top:30.4%!important;width:37.7%!important;height:4.35%!important;align-items:center!important;justify-content:center!important;gap:clamp(8px,.9vw,15px)!important;margin:0!important;padding:0 14px!important;border-radius:5px!important;background:#0c4036!important;color:#f7f4de!important;font-size:clamp(10px,.9vw,15px)!important;font-weight:800!important;line-height:1!important;white-space:nowrap!important;pointer-events:none!important}.reference-board-live span{display:inline-flex!important;align-items:center!important;gap:5px!important}.reference-board-live b{width:7px!important;height:7px!important;border-radius:50%!important;background:#55dbaf!important;box-shadow:0 0 7px #55dbaf!important}.reference-board-live strong{color:#fff0a1!important;font-family:ui-monospace,Consolas,monospace!important;font-size:1.12em!important}.reference-board-live i{color:#dca64b!important;font-style:normal!important;font-weight:500!important}}

/* v46 — discoverable learning-tools modal for focus and buddy panels. */
.tools-launcher{display:flex!important;align-items:center!important;gap:9px!important;position:fixed!important;right:20px!important;bottom:18px!important;z-index:30!important;padding:12px 18px!important;border:1px solid rgba(255,255,255,.7)!important;border-radius:999px!important;background:#0b806a!important;color:#fff!important;box-shadow:0 8px 22px rgba(6,58,48,.28)!important;font:800 14px inherit!important;cursor:pointer!important}.tools-launcher small{font-size:11px!important;font-weight:600!important;opacity:.82!important}.classroom-side{display:none!important}.room-modal-veil:not([hidden]){display:block!important;position:fixed!important;inset:0!important;z-index:40!important;background:rgba(9,35,31,.48)!important;backdrop-filter:blur(3px)!important}.room-modal-veil[hidden]{display:none!important}body.tools-open .classroom-side{display:grid!important;position:fixed!important;z-index:50!important;left:50%!important;top:50%!important;transform:translate(-50%,-50%)!important;width:min(920px,calc(100vw - 32px))!important;max-height:calc(100vh - 48px)!important;overflow:auto!important;grid-template-columns:1fr 1fr!important;gap:18px!important;padding:18px!important;border-radius:26px!important;background:#f4f0e8!important;box-shadow:0 24px 70px rgba(0,0,0,.34)!important}.classroom-side .focus-card,.classroom-side .partner-card{display:block!important;position:static!important;width:auto!important;height:auto!important;min-width:0!important;margin:0!important;opacity:1!important;transform:none!important}.classroom-side .focus-card{grid-row:auto!important}.room-modal-veil~.orientation-prompt{z-index:51!important}@media(max-width:700px){.tools-launcher{right:12px!important;bottom:12px!important;padding:11px 14px!important}.tools-launcher small{display:none!important}body.tools-open .classroom-side{grid-template-columns:1fr!important;width:calc(100vw - 20px)!important;max-height:calc(100vh - 24px)!important;padding:12px!important;border-radius:20px!important}.classroom-side .timer-face{min-height:145px!important}}

/* v48 — keep the room surface clean: no legacy landscape prompt, no duplicate painted clock. */
.orientation-prompt{display:none!important}
@media (min-width:981px){
  .classroom-hall::before{
    content:""!important;
    display:block!important;
    position:absolute!important;
    z-index:4!important;
    left:25.1%!important;
    top:3.1%!important;
    width:9.2%!important;
    height:12.2%!important;
    border-radius:50%!important;
    background:radial-gradient(ellipse at 50% 50%,#f1ddc9 0 54%,rgba(241,221,201,.99) 67%,rgba(241,221,201,.84) 74%,rgba(241,221,201,0) 82%)!important;
    box-shadow:0 0 20px 12px rgba(241,221,201,.82)!important;
    opacity:1!important;
    pointer-events:none!important;
  }
}
/* Local ambience player: generated in-browser, with no external audio dependency. */
.noise-card{background:linear-gradient(145deg,rgba(246,252,243,.96),rgba(232,246,237,.9))}.noise-lead{margin:12px 0;color:#617d74;font-size:12px;line-height:1.55}.noise-scenes{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:0 0 11px}.noise-scenes button{min-height:34px;border:1px solid var(--line);border-radius:10px;background:#fffdf8;color:#52736a;font:800 12px inherit;cursor:pointer}.noise-scenes button.is-active{border-color:#0c715e;background:#dff3e9;color:#07634f;box-shadow:inset 0 0 0 1px rgba(12,113,94,.12)}.noise-actions{display:grid;grid-template-columns:1fr auto;gap:8px}.noise-actions button{min-height:39px;font:inherit;font-size:12px;font-weight:800;cursor:pointer}.noise-actions .primary{border-radius:12px}.noise-actions .quiet{min-width:72px;border-radius:12px}.noise-volume{display:grid;grid-template-columns:1fr auto;gap:5px 9px;align-items:center;margin-top:14px;color:#52736a;font-size:12px;font-weight:800}.noise-volume output{color:#0b6b57;font-family:ui-monospace,monospace}.noise-volume input{grid-column:1/-1;width:100%;accent-color:#0c715e;cursor:pointer}.noise-card button:disabled{cursor:not-allowed;opacity:.65}
@media (min-width:981px){.classroom-side .noise-card{display:block!important;position:absolute!important;z-index:25!important;top:67.1%!important;right:1.25%!important;width:17.75%!important;margin:0!important;padding:1.15%!important;border:0!important;border-radius:15px!important;background:rgba(255,255,251,.98)!important;box-shadow:0 5px 14px rgba(47,41,30,.1)!important}.classroom-side .noise-card .card-heading h2{font-size:clamp(14px,1.1vw,19px)!important}.classroom-side .noise-card .card-heading>span{padding:4px 7px;font-size:10px}.classroom-side .noise-card .noise-lead{margin:8px 0;font-size:10px}.classroom-side .noise-card .noise-scenes{gap:4px;margin-bottom:8px}.classroom-side .noise-card .noise-scenes button{min-height:28px;font-size:9px}.classroom-side .noise-card .noise-actions button{min-height:31px;font-size:10px}.classroom-side .noise-card .noise-actions .quiet{min-width:56px}.classroom-side .noise-card .noise-volume{margin-top:9px;font-size:10px}}
@media (max-width:650px){.noise-card{border-radius:22px}.noise-lead{font-size:13px}}