/* The city owns the screen. Interface panels occupy predictable safe areas. */
:root{--cream:#fff8e8;--gold:#ffca70;--panel:#141e29f5;--burnt:#c96325;--caption-bottom:24px;--body-size:16px}
html{font-size:16px}html[data-text-size=large]{--body-size:19px}
button,select{font:inherit}button{cursor:pointer}button:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid #ffd183;outline-offset:4px}
[hidden]{display:none!important}
body{font-family:Verdana,Arial,sans-serif;color:var(--cream)}
body:not(.playing)>.hud,body:not(.playing)>#utilityDock,body:not(.playing) #chapterStrip,body:not(.playing) #streetStatus{visibility:hidden}
#introOverlay{background:linear-gradient(90deg,#07131de8 0%,#0a1727b3 37%,#1019260f 82%),url('img/friday-title.webp') center/cover no-repeat #14283c;align-items:stretch;justify-content:flex-start;overflow:auto;padding:max(32px,env(safe-area-inset-top)) 5vw max(20px,env(safe-area-inset-bottom));touch-action:pan-y}
#introOverlay::before{display:none}
.introPanel{margin:auto 0;width:min(620px,100%);max-width:620px;max-height:none;background:none;border:0;border-radius:0;box-shadow:none;overflow:visible}
.introPanel::after{display:none}.introHero{display:block;padding:0}.brandBlock{border:0;padding:0}
.brandBlock .gt-title{font-family:Impact,'Arial Black',sans-serif;font-size:clamp(76px,12vw,150px);letter-spacing:-2px;line-height:.84;color:#ffd287;text-shadow:3px 4px 0 #293544,6px 7px 0 #07131d}
.brandBlock .gt-sub{font:16px/1.6 Verdana,sans-serif;color:#fff7e5;margin:20px 0 0}
.deadlineStamp{font:700 13px/1.5 Verdana,sans-serif;letter-spacing:1px;border:0;border-left:3px solid #ffc46c;border-radius:0;padding:2px 12px;transform:none;margin:16px 0 22px}
.introBrief{max-width:520px}.introBrief .brief{font:var(--body-size)/1.65 Verdana,sans-serif;background:#0b172be6;border:1px solid #ffffff24;border-radius:3px;padding:17px 19px;margin:0 0 14px}
.introBrief .brief b{color:#ffe1a2}.introBrief .controls{font:14px/1.8 Verdana,sans-serif;margin:0 0 14px;color:#f0e8d6;max-width:480px}
.introActions{padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px;max-width:520px}
.introActions .bigbtn{font:700 14px/1.4 Verdana,sans-serif;padding:13px 15px;border:1px solid #e8cfa581;border-radius:3px;box-shadow:none;letter-spacing:0;background:#122738!important;color:#fff4df;text-shadow:none;min-height:48px}
.introActions #startBtn{font:700 18px/1.4 Verdana,sans-serif;padding:17px 24px;letter-spacing:0;color:#17212b;background:#ffcb77!important;border-color:#ffddaa;box-shadow:0 4px 0 #a75722}
.introActions #startBtn:hover{background:#ffe1a2!important;transform:translateY(-1px)}
.introPace{grid-column:1/-1;margin-bottom:5px}.introPace label{display:block;font:700 14px/1.5 Verdana,sans-serif;margin-bottom:6px}
.introPace select{width:100%;max-width:520px;min-height:44px;background:#132537;color:#fff4dd;border:1px solid #a4adba;border-radius:3px;padding:8px 10px;font-size:14px}
.introPace small{display:block;color:#e5decf;font-size:12px;line-height:1.6;margin:6px 0}
.introFooter{display:block;padding:18px 0 0;border:0;background:none;max-width:520px}.introFooter .tiny{font:12px/1.7 Verdana,sans-serif;color:#d9dddc}.introFooter .tiny:last-child{display:block;margin-top:8px}
#objectives{top:20px;left:20px;width:310px;padding:0;border:0;border-radius:3px;background:var(--panel);box-shadow:0 6px 24px #06121b45;pointer-events:auto}
.hudEyebrow{display:none}#missionFocus{padding:13px 15px 10px;margin:0;border:0;border-left:3px solid #ffbf67;background:none;border-radius:0}
#missionKicker{font:700 12px/1.4 Verdana,sans-serif;letter-spacing:1px;color:#ffce7e}
#missionTitle{font:700 18px/1.4 Verdana,sans-serif;letter-spacing:-.25px;margin-top:6px;white-space:normal;overflow:visible}
#missionDetail{font:14px/1.5 Verdana,sans-serif;color:#d0d7dc;margin-top:6px;white-space:normal;overflow:visible}
#objChip{font:700 12px/1.6 Verdana,sans-serif;letter-spacing:0;padding:9px 15px;background:#ffffff06;border-top:1px solid #ffffff1c}
#objBody{padding:12px 15px;max-height:55vh;overflow:auto;font:14px/1.65 Verdana,sans-serif;touch-action:pan-y;overscroll-behavior:contain}
#objBody h3{font:700 14px/1.5 Verdana,sans-serif;letter-spacing:.3px;margin:10px 0 5px}#objBody h3 span{font-size:12px!important}
#objectives.expanded{width:min(380px,calc(100vw - 40px));max-height:calc(100dvh - 40px);overflow:auto}#objectives .ob{padding:4px 0}
#clockbox{top:20px;left:50%;padding:11px 14px;min-width:230px;border-top:2px solid #ffbf67;border-radius:3px;background:var(--panel)}
#clock{font:700 24px/1.2 'Courier New',monospace;letter-spacing:-.7px;text-shadow:none}#clockRow{gap:10px;align-items:center}#countdown{font:700 12px/1.5 Verdana,sans-serif}
#dateline{font:12px/1.5 Verdana,sans-serif;letter-spacing:.2px;margin:3px 0 6px}#phaseLabel{display:none}#sunlabel{font:12px/1.5 Verdana,sans-serif;letter-spacing:0}#sunbarWrap{width:100%;height:5px;border:0;margin:6px 0;border-radius:0}
#schmooze{font:12px/1.5 Verdana,sans-serif;max-width:240px;white-space:normal}#blessChip,#alertChip,#eyeChip,#glowChip{font:700 14px/1.4 Verdana,sans-serif;letter-spacing:0;text-shadow:none}
#mapwrap{top:20px;right:20px;padding:5px;border:1px solid #8a9ca05c;border-bottom:2px solid #e5b367;background:var(--panel)}#minimap{width:132px;height:132px;image-rendering:auto}
#utilityDock{top:178px;right:20px;width:144px;gap:5px}#utilityDock button{min-height:39px;font:700 12px/1.2 Verdana,sans-serif;padding:7px 5px;border:1px solid #bdccd052;background:#122332f5;border-radius:2px;letter-spacing:0;text-align:center}#utilityDock #journalBtn{grid-column:1/-1}
#utilityDock button::after{display:none!important}#utilityDock button::first-letter{font-size:inherit}#utilityDock button.unread{color:#142331;background:#ffcb77;border-color:#fff0c7}
#chapterStrip{left:20px;bottom:24px;display:flex;gap:12px;align-items:center;background:#0d1b2de0;padding:10px 14px;border-radius:2px}
#chapterNumber{font:700 24px/1 'Courier New',monospace;color:#ffcb77}#chapterTitle{font:14px/1.4 Verdana,sans-serif;max-width:210px}
#streetStatus{right:20px;bottom:24px;width:180px;padding:10px 12px;background:#0d1b2de0;border-radius:2px;display:flex;flex-direction:column;gap:5px}
#streetName{font:700 12px/1.5 Verdana,sans-serif;letter-spacing:.5px}#streetHeat{font:12px/1.4 Verdana,sans-serif;color:#e1e5e7}.heatTrack{height:3px;background:#ffffff20;display:block}.heatTrack i{height:3px;background:#f3ae63;display:block;width:0}
#sceneCaption{bottom:var(--caption-bottom);left:50%;transform:translateX(-50%);width:min(660px,calc(100vw - 680px));min-width:300px;background:#101b2af5;border:1px solid #dfd5c02e;border-left:3px solid #ffcb77;border-radius:3px;padding:12px 16px;box-shadow:0 5px 24px #0006;text-align:left;z-index:26;line-height:1.55}
#captionLabel{display:block;font:700 12px/1.5 Verdana,sans-serif;letter-spacing:.8px;color:#ffca77;margin-bottom:5px}#captionText{display:block;font:var(--body-size)/1.55 Verdana,sans-serif;color:#fff9ee}
#sceneCaption{overflow:auto;touch-action:pan-y;pointer-events:auto;overscroll-behavior:contain}
#toasts{display:none!important}#prompt{font:700 16px/1.5 Verdana,sans-serif;bottom:178px;padding:11px 17px;width:max-content;max-width:min(600px,calc(100vw - 360px));border:1px solid #edd2a550;border-left:3px solid #ffcb77;border-bottom-width:1px;border-radius:3px;background:#0d192aef;box-shadow:0 5px 18px #0005}
#progWrap{bottom:159px;width:230px;height:12px;border:1px solid #dcebc4;border-radius:2px}#stamWrap{bottom:141px;height:6px;width:120px}#stamLabel{font:12px/1.2 Verdana,sans-serif;letter-spacing:0;top:-4px}
.keycap{font:700 14px/1.2 Verdana,sans-serif;display:inline-flex}
.overlay,.fridayModal{touch-action:pan-y;overscroll-behavior:contain}.fridayModal{position:fixed;inset:0;z-index:90;display:grid;place-items:center;padding:24px;background:#08121be0}
.notebook{width:min(860px,100%);max-height:calc(100dvh - 48px);display:flex;flex-direction:column;background:#f4eedb;color:#202932;border:1px solid #e0d3b4;border-radius:4px;box-shadow:0 24px 100px #0008;overflow:hidden}
.notebookBar{padding:20px 24px 16px;background:#15364e;color:#fff7e5;display:flex;gap:16px;justify-content:space-between;align-items:center;border-bottom:4px solid #c7682a}
.notebookDate{font:700 12px/1.5 Verdana,sans-serif;letter-spacing:.8px;color:#ccdadf}.notebookBar h2{font:700 32px/1.2 Georgia,serif;margin-top:5px}.notebookBar button{background:#284a63;color:#fff8ea;border:1px solid #d6e0e486;padding:11px 13px;font-size:14px;border-radius:2px}
kbd{font:12px/1.2 Verdana,sans-serif;border:1px solid currentColor;opacity:.8;padding:2px 4px;border-radius:2px}
#notebookTabs{display:flex;gap:0;padding:0 24px;background:#e8e0ca;border-bottom:1px solid #c4b89e}#notebookTabs button{background:none;color:#344656;border:0;border-bottom:3px solid transparent;padding:14px 16px;font:700 14px/1.5 Verdana,sans-serif}#notebookTabs [aria-current=page]{border-bottom-color:#b64b19;color:#162f43}
#notebookPage{padding:24px;overflow:auto;overscroll-behavior:contain;touch-action:pan-y;font:var(--body-size)/1.65 Verdana,sans-serif;min-height:180px}.chapterHeading>span{font:700 12px/1.4 Verdana,sans-serif;letter-spacing:1px;color:#925129}.chapterHeading h3{font:700 28px/1.3 Georgia,serif;margin:7px 0 9px}.chapterHeading p{max-width:680px;color:#495057;margin-bottom:20px}
.goalList{display:grid;gap:8px}.goal{width:100%;display:grid;grid-template-columns:24px 1fr auto;gap:12px;text-align:left;align-items:center;background:#fffbee;border:1px solid #b9ad93;border-radius:3px;padding:12px;color:#20354a;font-size:14px}.goal strong{display:block;font-size:16px}.goal small{display:block;font-size:14px;color:#626459;line-height:1.6}.goal>span:last-child{font-size:12px;font-weight:700}.goal.finished{opacity:.6;background:#e6e3d6}.goalCheck{font-size:23px;color:#9c5524}
.notebookAside{margin-top:22px;padding:16px;background:#e7e1d1;border-left:3px solid #a96332}.notebookAside p{font-size:14px;margin:7px 0 12px}.notebookAside button,.pendingReply{padding:11px 15px;background:#23485e;color:#fff9ef;border:0;border-radius:3px;font-size:14px}.pendingReply{width:100%;margin-bottom:18px;background:#8a421e;text-align:left}
.replyCard{background:#fffef4;border:1px solid #b5ab90;border-top:5px solid #53778f;padding:20px;margin-bottom:30px}.messageFrom{font:700 12px/1.4 Verdana,sans-serif;letter-spacing:1px;color:#48616d}.replyCard h3{font:700 24px/1.4 Georgia,serif;margin:8px 0}.replyCard p{margin:0 0 18px}.replyCard button{display:block;width:100%;text-align:left;background:#eaf0ef;color:#1b3848;border:1px solid #9eaead;border-radius:3px;padding:12px 14px;margin-top:10px;font:16px/1.55 Verdana,sans-serif}.replyCard button strong,.replyCard button small{display:block}.replyCard button small{font-size:14px;margin-top:4px;color:#4a5b60}
.logHeading{font:700 24px/1.4 Georgia,serif}.logHint{font-size:14px;color:#5e665e}.conversationLog article{padding:14px 0;border-bottom:1px solid #bfb69d}.conversationLog article>span{font:700 12px/1.4 Verdana,sans-serif;color:#77634a}.conversationLog p{margin-top:5px}.settingRow{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:12px 0;padding:12px 0;border-bottom:1px solid #c8bda1;font-size:16px}.settingRow select{font-size:14px;max-width:58%;min-height:44px;padding:8px;background:#fffef4;border:1px solid #8f937e;border-radius:2px;color:#223846}.controlsGuide{margin-top:20px;font-size:14px}.controlsGuide p{margin:12px 0}.notebookFoot{padding:11px 24px;font:12px/1.5 Verdana,sans-serif;color:#586057;border-top:1px solid #c1b59a;background:#e9e2cf;display:flex;justify-content:space-between;gap:14px}
.notebookOpen #utilityDock,.notebookOpen #btnZone,.notebookOpen #stickZone{visibility:hidden}
#schmoozePanel{max-width:560px;width:calc(100% - 32px);max-height:90dvh;overflow:auto;border:1px solid #e8be7b;border-top:5px solid #cb6d2e;border-radius:4px;background:#142435;padding:24px;text-align:left;touch-action:pan-y}#schmoozePanel h2{font:700 24px/1.3 Georgia,serif}#schmoozeText{font:var(--body-size)/1.7 Verdana,sans-serif;font-style:normal}.schBtn{font:16px/1.5 Verdana,sans-serif;min-height:48px;padding:12px 15px;background:#20364b;border:1px solid #b8c6c4;border-radius:3px}.schBtn b{font:700 16px/1.5 Verdana,sans-serif;letter-spacing:0}.schBtn small{font-size:14px}
#phoneWin>div{width:min(350px,calc(100vw - 28px))!important;max-height:90dvh;overflow:auto}#phScreen{font:var(--body-size)/1.6 'Courier New',monospace!important;max-height:56dvh;overflow:auto}#phTabs button,#phX{font-size:14px!important;min-height:44px}#phClock{font-size:12px!important}#phScreen span,#phScreen div{font-size:inherit!important}
#aimWin>div,#mailWin>div{width:min(580px,calc(100vw - 24px))!important;max-height:92dvh;overflow:auto;font-size:16px!important}#aimWin button,#mailWin button{font-size:14px!important;min-height:40px}#aimAway,#aimList,#mailBody{font-size:16px!important;line-height:1.6!important}#mailBody>div,#mailBody select{font-size:16px!important}#mailBody{max-height:60dvh!important}#mailBody select{max-width:100%;white-space:normal}
.desktopLink{margin:10px;padding:9px 14px;border:2px outset #fff;background:#e5e2d2;color:#183f6b;font:14px/1.5 Verdana,sans-serif}.campusBrowser{border:2px solid #29558b;background:white;color:#242c38;font:16px/1.6 Verdana,sans-serif}.browserTitle{background:#21538f;color:white;padding:7px 12px;font-size:14px}.browserAddress{background:#ede9d7;color:#394447;font:14px/1.5 'Courier New',monospace;padding:8px 12px;overflow-wrap:anywhere}.facebookBar{background:#3b5998;color:white;padding:18px;display:flex;justify-content:space-between;gap:12px;align-items:center}.facebookBar strong{font:700 30px/1.2 Verdana,sans-serif;letter-spacing:-1.5px}.facebookBar span{font-size:12px}.feedPrivacy{font-size:14px;padding:12px 18px;background:#fff9ce;border-bottom:1px solid #e0d592}.campusBrowser h3{font:700 20px/1.4 Verdana,sans-serif;margin:18px 18px 0;color:#3b5998}.feedNotice{font-size:14px;margin:4px 18px 15px;color:#69778a}.campusBrowser article{padding:14px 18px;border-top:1px solid #d8dfea}.campusBrowser article span{font-size:12px;color:#637a95}.campusBrowser button{margin:18px;background:#3b5998;color:white;border:1px solid #193e74;padding:10px;font-size:14px}
#mapWin>div{width:min(660px,calc(100vw - 24px))!important;max-height:94dvh;overflow:auto}#mapWin canvas{max-width:100%!important;height:auto!important}#mapX{font-size:14px!important;min-height:44px}
#endOverlay{background:linear-gradient(110deg,#102a3dea,#172236e8),url('img/friday-title.webp') center/cover}#endOverlay .panel{max-width:800px;border:1px solid #d0b47d;border-radius:4px;background:#112231ed;padding:28px;max-height:92dvh}#endTitle{font-size:48px}#endStory{font:var(--body-size)/1.8 Georgia,serif;border:0;border-top:1px solid #dacaad55;background:none;padding:20px 0;margin:15px 0}#endStory p+p{margin-top:14px}#endStats{font:14px/1.7 Verdana,sans-serif}#endGrade{font:700 16px/1.5 Verdana,sans-serif;letter-spacing:0}#endOverlay .bigbtn{font:700 16px/1.5 Verdana,sans-serif;letter-spacing:0;border-width:1px;border-radius:3px}
.fridayEnded #fridayLayer>.hud,.fridayEnded #objectives,.fridayEnded #clockbox,.fridayEnded #utilityDock,.fridayEnded #mapwrap,.fridayEnded #btnZone,.fridayEnded #stickZone{display:none!important}
html[data-motion=reduced] *,html[data-motion=reduced] *::after{animation:none!important;transition:none!important}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
@media(max-width:1100px){#clockbox{left:350px;transform:none;min-width:205px}#chapterStrip{display:none}#sceneCaption{width:min(600px,calc(100vw - 255px));left:20px;transform:none;min-width:0}#prompt{max-width:calc(100vw - 225px);left:20px;transform:none}#stamWrap{left:120px;transform:none}#progWrap{left:20px;transform:none}}
@media(max-width:760px){
  #introOverlay{padding:28px 22px;align-items:flex-start;background-position:62% center}.introPanel{margin:0;max-width:520px}.brandBlock .gt-title{font-size:84px}.brandBlock .gt-sub{font-size:14px}.introBrief .brief{font-size:16px}.introBrief .controls{font-size:14px}.introActions .bigbtn{font-size:14px}
  #objectives{left:10px;top:12px;width:calc(100vw - 120px)}#missionFocus{padding:9px 11px 8px}#missionKicker{font-size:12px}#missionTitle{font-size:16px;line-height:1.4;margin-top:4px}#missionDetail{font-size:14px;line-height:1.4;margin-top:4px}#objChip{font-size:12px;padding:6px 11px}#objectives.expanded{width:calc(100vw - 20px);z-index:40;max-height:75dvh}#objBody{font-size:14px;max-height:50dvh}
  #mapwrap{top:12px;right:10px;padding:4px}#minimap{width:88px;height:88px}#clockbox{top:172px;left:10px;width:calc(100vw - 124px);min-width:0;transform:none;padding:6px 9px}#clock{font-size:20px}#countdown{font-size:12px}#dateline,#sunlabel,#schmooze{display:none}#sunbarWrap{margin:5px 0 0}#clockRow{justify-content:space-between}#blessChip,#alertChip,#eyeChip,#glowChip{font-size:14px}
  #utilityDock{top:113px;right:10px;width:98px;grid-template-columns:1fr 1fr;gap:4px}#utilityDock button{font-size:12px;min-height:36px;padding:5px 2px;overflow-wrap:anywhere}#utilityDock #phoneBtn,#utilityDock #mapBtn,#utilityDock #journalBtn{grid-column:1/-1;font-size:12px}#utilityDock #glowBtn{display:none}
  #streetStatus{display:none}#sceneCaption{left:10px;right:10px;width:auto;bottom:172px;min-width:0;transform:none;padding:10px 12px;border-left-width:3px}#captionText{font-size:var(--body-size);line-height:1.45}#captionLabel{font-size:12px;margin-bottom:3px}
  #prompt{left:50%;bottom:105px;transform:translateX(-50%);width:calc(100vw - 175px);max-width:none;padding:8px;font-size:14px;line-height:1.45}#prompt .keycap{display:none}#progWrap{bottom:91px;left:50%;transform:translateX(-50%);width:calc(100vw - 190px);height:9px}#stamWrap{bottom:77px;left:50%;transform:translateX(-50%);width:100px}#stamLabel{display:none}
  #stickZone{width:43%;height:155px;bottom:env(safe-area-inset-bottom)}#stickBase{width:104px;height:104px;left:20px;bottom:20px;border-color:#e7dfc37d;background:#111e2c88}#stickNub{background:#ffd28dd9}#btnZone{right:14px;bottom:max(18px,env(safe-area-inset-bottom));gap:9px}.tbtn{width:65px;height:65px;font:700 16px/1 Verdana,sans-serif;border:2px solid #ffe0ab;background:#182e44e6}#btnRun{width:53px;height:45px;font:700 13px/1 Verdana,sans-serif;border-radius:9px}
  .fridayModal{padding:10px}.notebook{max-height:calc(100dvh - 20px)}.notebookBar{padding:15px}.notebookBar h2{font-size:27px}.notebookDate{font-size:12px;letter-spacing:0}.notebookBar button{font-size:14px;padding:9px}.notebookBar kbd{display:none}#notebookTabs{padding:0 6px}#notebookTabs button{font-size:13px;padding:10px 8px;flex:1}#notebookTabs span{font-size:12px}#notebookPage{padding:17px}.chapterHeading h3{font-size:25px}.goal{grid-template-columns:20px 1fr;gap:8px;padding:10px}.goal>span:last-child{display:none}.goal strong{font-size:16px}.goal small{font-size:14px}.notebookFoot{padding:10px 15px;font-size:12px}.replyCard{padding:14px}.replyCard h3{font-size:23px}.settingRow{flex-wrap:wrap}.settingRow select{max-width:100%;width:100%}
}
@media(max-width:380px){#missionDetail{font-size:13px}#missionTitle{font-size:15px}#clockbox{top:186px}#objChip{font-size:12px}.introActions{grid-template-columns:1fr}.brandBlock .gt-title{font-size:72px}}
@media(max-width:760px){#objectives,#mapwrap{top:max(12px,env(safe-area-inset-top))}#objectives{left:max(10px,env(safe-area-inset-left))}#mapwrap,#utilityDock{right:max(10px,env(safe-area-inset-right))}#introOverlay{padding-top:max(28px,env(safe-area-inset-top))}}
@media(max-height:560px) and (orientation:landscape){#introOverlay{padding:20px 4vw}.introPanel{max-width:680px}.introHero{display:grid;grid-template-columns:200px 1fr;gap:20px}.brandBlock .gt-title{font-size:70px}.introActions{max-width:680px}.introBrief .brief{padding:12px;font-size:14px}.introBrief .controls{font-size:12px}.introPace{margin-top:10px}#objectives{width:250px;top:10px;left:10px}#clockbox{top:10px;left:280px;width:210px}#mapwrap{top:10px;right:10px}#minimap{width:80px;height:80px}#utilityDock{top:103px;right:10px;width:96px}#sceneCaption{bottom:10px;left:140px;width:calc(100vw - 260px);max-width:none;font-size:14px}#captionText{font-size:14px}#chapterStrip,#streetStatus{display:none}#prompt{bottom:105px;left:50%;transform:translateX(-50%);max-width:calc(100vw - 320px);font-size:14px}#progWrap{bottom:90px;left:50%;transform:translateX(-50%)}#stamWrap{bottom:77px;left:50%;transform:translateX(-50%)}#stickZone{height:145px;width:140px}#btnZone{bottom:12px}}

/* Small persistent controls let the player clear the city view at any time. */
#hudControls{position:fixed;top:max(10px,env(safe-area-inset-top));left:max(10px,env(safe-area-inset-left));z-index:45;display:flex;align-items:center;gap:6px;max-width:calc(100vw - 132px);pointer-events:auto}
#hudControls button{min-height:42px;padding:8px 11px;border:1px solid #aebbb85c;border-radius:3px;background:#122332f5;color:#fff4dd;font:700 12px/1.3 Verdana,sans-serif;white-space:nowrap}
#compactClock{font:700 13px/1.3 'Courier New',monospace;white-space:nowrap;padding:8px;background:#122332eb;border-radius:3px}
body:not(.playing) #hudControls,.fridayEnded #hudControls,.notebookOpen #hudControls{display:none}
body:not(.hudMinimized) #compactClock{display:none}
body.playing #objectives{top:max(62px,calc(env(safe-area-inset-top) + 52px))!important;max-height:calc(100dvh - 82px)}
.hudMinimized #objectives,.hudMinimized #clockbox,.hudMinimized #mapwrap,.hudMinimized #utilityDock,.hudMinimized #chapterStrip,.hudMinimized #streetStatus{display:none!important}
.hudMinimized #hudControls{max-width:calc(100vw - 20px)}
/* Keep the compact controls inside narrow phone screens. Expanded panels already
   provide their own notebook/map controls. */
#hudControls{flex-wrap:wrap}
body:not(.hudMinimized) #compactNotebook,body:not(.hudMinimized) #compactMap{display:none}
@media(max-width:380px){#hudControls button{padding:8px}#compactClock{padding:6px;font-size:12px}}

/* Captions have their own controls, independent of the expanded HUD. */
#sceneCaption{padding-right:48px;max-width:660px;overflow:auto;pointer-events:auto}
#captionDismiss{position:absolute;right:5px;top:5px;width:38px;height:38px;border:1px solid #ffffff40;background:#1e3145;color:#fff4dd;border-radius:3px;font:24px/1 Verdana;cursor:pointer}
@media(max-width:760px){#hudControls{gap:4px}#hudControls button{font-size:11px;padding:7px}#captionToggle{min-height:36px}#sceneCaption{max-width:calc(100vw - 20px)}}

#paintCanvas{display:block;width:100%;max-width:480px;background:#f7edcc;border:3px solid #7b817d;touch-action:none;margin:14px 0} .paintTools{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:12px}.paintTools button,#resumeCampus{padding:12px;border:1px solid #8d8779;background:#e7dab9;color:#152738;font:700 14px Verdana}#flyerTitle{display:block;width:100%;max-width:480px;padding:10px;font:16px monospace;margin:8px 0}#notebookTabs{flex-wrap:wrap}