/* Screen reconstruction at twice the official 570 x 320 screenshot coordinates.
 * References: papersplea.se/img/Shot01-Title.png, Shot04-Newspaper.png,
 * Shot07-Night.png. All shapes and print texture below are newly drawn CSS.
 * The perspective title is an approximation of the original bespoke lettering.
 */
.classic-screen:has(.title-panel,.newspaper,.night-panel){background:#000}

/* Title: centered perspective lettering, eagle/bars, and two narrow menu links. */
.classic-screen .title-panel{position:absolute;inset:0;width:1140px;height:640px;max-height:none;margin:0;padding:0!important;overflow:visible;text-align:center}
.title-panel>.emblem{
  position:absolute;left:414px;right:auto;top:56px;width:312px;height:84px;margin:0;
  background:repeating-linear-gradient(0deg,#586651 0 12px,transparent 12px 18px) 0 4px/100% 56px no-repeat;
  clip-path:none;
}
.title-panel>.emblem::before{
  content:'';position:absolute;left:82px;top:0;width:148px;height:84px;background:#ba4246;
  clip-path:polygon(0 0,40% 0,45% 10%,50% 3%,55% 10%,60% 0,100% 0,64% 68%,60% 86%,50% 100%,40% 86%,36% 68%);
}
.title-panel>.emblem::after{
  content:'';position:absolute;left:127px;top:0;width:58px;height:68px;background:#000;
  clip-path:polygon(0 0,31% 0,38% 16%,50% 7%,62% 16%,69% 0,100% 0,83% 25%,68% 22%,62% 34%,75% 35%,63% 48%,59% 74%,50% 100%,41% 74%,37% 48%,25% 35%,38% 34%,32% 22%,17% 25%);
}
.classic-screen .title-panel>h1{
  position:absolute;left:50%;top:132px;transform:translateX(-50%);width:630px;max-width:none;
  margin:0;color:#eef0e9;text-align:center;font-family:Impact,'Arial Black',sans-serif;
  font-weight:900;font-size:96px;line-height:.85;letter-spacing:-4px;
  -webkit-text-stroke:2px currentColor;
  text-shadow:0 4px #586552,0 8px #586552,0 12px #586552,0 16px #586552,0 20px #586552,0 24px #586552,0 28px #586552,0 32px #586552;
}
.title-panel h1 .logo-top,.title-panel h1 .logo-bottom{display:block;white-space:nowrap;transform-origin:50% 0;will-change:auto}
.title-panel h1 .logo-top{font-size:86px;line-height:86px;letter-spacing:-2px;transform:scaleX(1.6) perspective(420px) rotateX(22deg) skewX(-6deg)}
.title-panel h1 .logo-bottom{margin-top:-4px;font-size:146px;line-height:126px;letter-spacing:-5px;transform:scaleX(1.52) perspective(430px) rotateX(24deg) skewX(-6deg);text-shadow:0 4px #586552,0 8px #586552,0 12px #586552,0 16px #586552,0 20px #586552,0 24px #586552,0 28px #586552,0 32px #586552,0 36px #586552,0 40px #586552,0 44px #586552,0 48px #586552}
.title-panel .menu-actions{display:contents;margin:0}
.classic-screen .title-panel button[data-action=new],
.classic-screen .title-panel button[data-action=endless-menu],
.classic-screen .title-panel button[data-action=continue]{
  position:absolute;left:470px;width:200px;height:34px;margin:0;padding:4px 0;
  border:0;border-bottom:2px solid #333e31;background:none;color:#64705c;
  font:20px/24px ClassicDisplay,var(--pixel);text-align:center;
}
.classic-screen .title-panel button[data-action=new]{top:478px}
.classic-screen .title-panel button[data-action=endless-menu]{top:536px}
.classic-screen .title-panel button[data-action=continue]{left:242px;top:478px;width:180px;font-size:17px}
.classic-screen .title-panel button[data-action=new]:hover,
.classic-screen .title-panel button[data-action=endless-menu]:hover,
.classic-screen .title-panel button[data-action=continue]:hover{color:#bbc3ac;border-bottom-color:#788a67;background:none}
.classic-screen .title-panel button[data-action=new]:focus-visible,
.classic-screen .title-panel button[data-action=endless-menu]:focus-visible{outline:0;color:#b6c5a5;border-bottom-color:#899d74}
.classic-screen .title-panel button[data-action=options]{
  position:absolute;left:20px;bottom:20px;width:60px;height:60px;margin:0;padding:0;
  border:2px solid #293429;border-radius:50%;background:none;color:#44553f;font-size:0;
}
.title-panel button[data-action=options]::before{content:'';position:absolute;left:27px;top:18px;width:9px;height:29px;transform:rotate(42deg);background:#3e4d38}
.title-panel button[data-action=options]::after{content:'';position:absolute;left:23px;top:12px;width:21px;height:21px;border:6px solid #3e4d38;border-left-color:transparent;transform:rotate(42deg)}
.classic-screen .title-panel button[data-action=options]:hover{border-color:#6d7c5e;background:none}
.classic-screen .title-panel a.menu-link{position:absolute;right:22px;bottom:24px;margin:0;padding:4px 0;color:#3e4939;font:14px/1 var(--pixel);background:none}
.classic-screen .title-panel a.menu-link:hover{color:#9aa889;background:none}
.title-panel>small{position:absolute;left:220px;right:220px;bottom:20px;display:block;margin:0;text-align:center}
.classic-screen .title-panel .credits-link{display:inline-block;margin:0;padding:0;font:12px/1 var(--pixel);color:#53604b;background:none}
.classic-screen .title-panel .credits-link:hover{color:#a5b294;background:none}

/* Morning paper: a small unrotated broadsheet, with the walk link below it. */
.classic-screen .newspaper{
  --news-paper:#d5d5c2;--news-ink:#282b24;--news-rule:#676d5d;
  position:absolute;left:204px;top:60px;width:732px!important;height:440px;max-height:none;
  padding:0!important;margin:0;overflow:visible;background:var(--news-paper);color:var(--news-ink);
  transform:none;box-shadow:8px 0 #8c9180,0 10px #898e7c;isolation:isolate;
}
.newspaper::before{content:'';position:absolute;inset:12px;border:4px double var(--news-rule);pointer-events:none;z-index:-1}
.newspaper .masthead{position:absolute;left:26px;right:26px;top:22px;height:58px;padding:0 108px;border:0;border-bottom:2px solid var(--news-rule);font-size:0;text-align:center}
.newspaper .masthead::after{content:'The Truth of Arstotzka';position:relative;display:block;font:42px/52px ClassicDisplay,var(--pixel);letter-spacing:-2px;white-space:nowrap}
.newspaper .masthead::before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,#747965 0 4px,transparent 4px 8px) left 0 top 2px/100px 50px no-repeat,repeating-linear-gradient(0deg,#747965 0 4px,transparent 4px 8px) right 0 top 2px/100px 50px no-repeat;pointer-events:none}
.newspaper .dateline{position:absolute;left:26px;right:26px;top:82px;height:22px;margin:0;padding:0 6px;border:0;border-bottom:2px solid #8a8e7a;display:flex;justify-content:space-between;align-items:center;font:14px/18px var(--pixel);color:#727866}
.newspaper .dateline>span:first-child{text-align:center;flex:1}
.newspaper .dateline>span:last-child{font-size:13px}
.newspaper .dateline::before{content:'Sports';position:absolute;right:4px;top:236px;width:148px;height:20px;background:var(--news-paper);font:18px/20px ClassicDisplay,var(--pixel);text-align:center;z-index:2}
.classic-screen .newspaper>h2{position:absolute;left:28px;top:116px;width:324px;height:94px;margin:0;padding:0;color:#20251d;font:38px/33px ClassicDisplay,var(--pixel);text-transform:none;text-align:center;letter-spacing:-1px;overflow:hidden}
.newspaper .news-columns{display:contents;border:0;padding:0;margin:0}
.newspaper .news-columns>p{position:absolute;margin:0;color:#414b37;font:17px/18px var(--pixel);overflow:hidden}
.newspaper .news-columns>p:first-child{left:28px;top:214px;width:324px;height:58px}
.newspaper .news-columns>p:nth-child(2){left:372px;top:200px;width:332px;height:86px}
.newspaper .news-columns::before{content:attr(data-secondary-headline);position:absolute;left:372px;right:28px;top:154px;height:42px;color:#22271f;font:31px/34px ClassicDisplay,var(--pixel);text-align:center}
.newspaper .news-columns::after{content:'The Weather';position:absolute;left:30px;bottom:62px;width:150px;height:22px;background:var(--news-paper);font:17px/20px ClassicDisplay,var(--pixel);color:#454d3b;text-align:center;z-index:2}
.newspaper::after{content:'';position:absolute;left:28px;right:28px;top:282px;bottom:16px;pointer-events:none;background:repeating-linear-gradient(0deg,#b9bdab 0 6px,transparent 6px 10px) 0 0/152px 100% no-repeat,repeating-linear-gradient(0deg,#b9bdab 0 6px,transparent 6px 10px) 170px 0/152px 100% no-repeat,repeating-linear-gradient(0deg,#b9bdab 0 6px,transparent 6px 10px) 344px 0/152px 100% no-repeat,repeating-linear-gradient(0deg,#b9bdab 0 6px,transparent 6px 10px) 520px 0/156px 100% no-repeat;z-index:-1}
.classic-screen .newspaper>button[data-action=work]{position:absolute;left:252px;top:532px;width:228px;height:30px;margin:0;padding:3px 0;border:0;border-bottom:2px solid #3b4335;background:none;color:#66715c;font:20px/24px ClassicDisplay,var(--pixel);text-align:center}
.classic-screen .newspaper>button[data-action=work]:hover{background:none;color:#b8c3aa;border-bottom-color:#8a9b77}
.classic-screen .newspaper>button[data-action=work]:focus-visible{outline:0;color:#b8c3aa;border-bottom-color:#8a9b77}

/* Evening: a central ledger, status circles at right, and optional tools left. */
.classic-screen .night-panel{position:absolute;inset:0;width:1140px;height:640px;max-height:none;margin:0;padding:0!important;display:block;overflow:visible;color:#b9b9a8;font:28px/1 ClassicDisplay,var(--pixel)}
.night-panel>section:first-child{display:contents}
.night-panel>section:first-child>h2{display:none}
.night-panel .night-date{position:absolute;left:0;right:0;top:10px;height:68px;margin:0;text-align:center;color:#79846f;font:25px/1 ClassicDisplay,var(--pixel)}
.night-panel .night-date::before{content:'';position:absolute;left:196px;right:196px;top:29px;height:2px;background:#343c32;pointer-events:none}
.night-panel .night-date>small{position:relative;display:block;width:140px;height:18px;margin:0 auto;background:#000;color:#5d6958;font:14px/18px ClassicDisplay,var(--pixel);z-index:1}
.night-panel .night-date>span{position:relative;display:block;width:140px;height:40px;margin:0 auto;padding:4px 0;background:#6a765f;color:#080b08;font:28px/32px ClassicDisplay,var(--pixel);clip-path:polygon(12% 0,88% 0,100% 50%,88% 100%,12% 100%,0 50%);z-index:1}
.night-panel .night-message{position:absolute;left:210px;right:210px;top:92px;margin:0;text-align:center;color:#a7b19a;font:18px/20px var(--pixel)}
.night-panel>section:first-child::before{content:'';position:absolute;left:48px;top:120px;width:60px;height:440px;background:radial-gradient(circle at 30px 31px,transparent 0 26px,#293228 27px 29px,transparent 30px) 0 0/60px 64px repeat-y;pointer-events:none}
.night-panel::after{content:'8\A CLASS';position:absolute;right:66px;top:18px;width:80px;white-space:pre;text-align:center;color:#6e7b65;font:20px/22px ClassicDisplay,var(--pixel);pointer-events:none}
.night-panel[data-housing]::after{content:attr(data-housing) '\A CLASS'}
.night-panel .family-member{position:absolute;right:42px;width:168px;height:84px;margin:0;padding:0;border:0;display:flex;flex-direction:column-reverse;justify-content:flex-end;align-items:center;gap:6px;color:#69765f}
.night-panel .family-member:nth-child(1 of .family-member){top:152px}
.night-panel .family-member:nth-child(2 of .family-member){top:236px}
.night-panel .family-member:nth-child(3 of .family-member){top:404px}
.night-panel .family-member:nth-child(4 of .family-member){top:320px}
.night-panel .family-member:nth-child(5 of .family-member){top:488px}
.night-panel .family-member>span:first-child{font:15px/16px var(--pixel);color:#69765f;text-align:center}
.night-panel .family-member>.condition{display:flex;align-items:center;justify-content:center;width:62px;height:62px;padding:0;border-radius:50%;background:#77846b;color:#10170f;font:32px/1 ClassicDisplay,var(--pixel);text-align:center}
.night-panel .family-member.sick>.condition{background:#90785f;color:#3d2421;font-size:20px;line-height:18px}
.night-panel .family-member.dead>.condition{background:#4f5044;color:#171b14;font-size:22px}
.night-panel .night-notes{position:absolute;left:0;top:0;width:1px;height:1px;margin:0;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.night-panel>.finances{position:absolute;left:366px;top:266px;width:400px;margin:0;padding:0;font:28px/1 ClassicDisplay,var(--pixel)}
.night-panel>.finances>h2{display:none}
.night-panel .finance-row{position:relative;display:flex;align-items:center;justify-content:space-between;width:400px;height:32px;min-height:32px;margin:0;padding:0;border:0;color:#b7b8a6;font:28px/32px ClassicDisplay,var(--pixel)}
.night-panel .finance-row:nth-of-type(n+3){color:#8b353a}
.night-panel .finance-row.income{color:#b7b8a6}
.night-panel .finance-row.expense{color:#8b353a}
.night-panel .finance-row>span:first-child,.night-panel .finance-row>label{text-transform:uppercase}
.night-panel .finance-row>span:last-child{min-width:70px;text-align:right}
.night-panel .finance-row label{display:flex;align-items:center;gap:0;font:inherit;cursor:pointer}
.night-panel .finance-row input[type=checkbox]{appearance:none;position:absolute;right:-44px;top:5px;width:22px;height:22px;margin:0;border:4px solid #7a3034;border-radius:50%;background:#000;box-shadow:none;cursor:pointer}
.night-panel .finance-row input[type=checkbox]:checked::after{content:'';position:absolute;left:4px;top:4px;width:6px;height:6px;border-radius:50%;background:#b84d52}
.night-panel .finance-row input[type=checkbox]:not(:checked){border-color:#383a30}
.night-panel .finance-row input[type=checkbox]:focus-visible{outline:2px solid #9aa78a;outline-offset:3px}
.night-panel .finance-row.total{height:42px;min-height:42px;margin:4px 0 0;padding:8px 0 0;border-top:2px solid #404638;border-bottom:0;color:#c5c6b4}
.night-panel .finance-row.total>span{visibility:hidden}
.night-panel #remaining-credits{font:28px/32px ClassicDisplay,var(--pixel);text-align:right}
.night-panel #remaining-credits::before{content:'$'}
.night-panel .finance-row:has(#expense-upgrade){position:absolute;left:-216px;top:64px;width:168px;height:auto;min-height:0;display:block;color:#77856b;font-size:16px;line-height:20px}
.night-panel .finance-row:has(#expense-upgrade)>label{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.night-panel #expense-upgrade{width:168px;max-width:168px;height:34px;margin:0;padding:3px;border:2px solid #44543a;background:#131c11;color:#879c73;font:16px/20px var(--pixel);text-transform:none}
.night-panel #expense-upgrade[type=checkbox]{position:relative;right:auto;top:auto;flex:0 0 22px;width:22px;height:22px;max-width:22px;padding:0;border:4px solid #44543a;border-radius:50%;background:#000}
.night-panel .upgrade-row>label{flex-direction:row!important;align-items:center!important;gap:9px!important;font:16px/18px var(--pixel);max-width:168px}.night-panel .upgrade-row>span{display:block;font:18px/22px ClassicDisplay,var(--pixel);margin:6px 0 0 30px;text-align:left}
.night-panel .housing-row label{font-size:23px}
.night-panel:has(#expense-escape:checked) .finance-row:has(#rent-cost,#expense-food,#expense-heat,[data-medicine],#housing-upgrade){opacity:.25;pointer-events:none}
.night-panel .finance-row:has(#escape-count){position:absolute;left:-216px;top:224px;width:180px;height:auto;min-height:0;color:#87947b;font-size:16px;line-height:20px}
.night-panel .finance-row:has(#escape-count)>label{display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.night-panel #escape-count{height:30px;padding:2px;border:2px solid #44543a;background:#131c11;color:#aab79c;font:20px/24px var(--pixel)}
.night-panel .finances>small{position:absolute;left:-216px;top:300px;width:180px;color:#67775c;font:14px/17px var(--pixel)}
.night-panel .escape-party{position:absolute;left:-216px;top:244px;width:182px;display:grid;gap:6px;color:#87947b;font:16px/18px var(--pixel)}
.night-panel .escape-party>label{display:flex;align-items:center;gap:7px}
.night-panel .escape-party input{appearance:none;flex:0 0 14px;width:14px;height:14px;margin:0;border:2px solid #66775c;background:#000;cursor:pointer}
.night-panel .escape-party input:checked{background:#879a76}
.night-panel .escape-party input:focus-visible{outline:2px solid #b7c3aa;outline-offset:2px}
.night-panel:has(.escape-party) .finances>small{top:384px}
.night-panel:has([data-medicine],#escape-count,.escape-party)>.finances{top:172px}
.night-panel:has([data-medicine],#escape-count,.escape-party) .finance-row{height:28px;min-height:28px;font-size:25px;line-height:28px}
.classic-screen .night-panel button[data-action=sleep]{position:fixed;right:48px;bottom:16px;width:200px;height:32px;margin:0;padding:3px 0;border:0;border-bottom:2px solid #333e30;background:none;color:#69785e;font:20px/24px ClassicDisplay,var(--pixel);text-align:center}
.classic-screen .night-panel button[data-action=sleep]:hover{background:none;color:#c3cfb6;border-bottom-color:#859a72}
.classic-screen .night-panel button[data-action=sleep]:focus-visible{outline:0;color:#c3cfb6;border-bottom-color:#859a72}