:root{
  --ink:#111;
  --paper:#f7f2e7;
  --panel:#fffdf8;
  --line:#222;
  --soft:#d8d0c0;
}
*{box-sizing:border-box}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:"Courier New",monospace;
  line-height:1.45;
}
a{color:#0033cc}
.wrap{width:min(920px,94vw);margin:0 auto;padding:18px 0 42px}
header{text-align:center;border-bottom:2px solid var(--line);padding:12px 0 16px;margin-bottom:18px}
.brand{font-size:clamp(28px,6vw,54px);font-weight:bold;letter-spacing:-2px}
.tag{font-size:14px;margin-top:4px}
nav{margin-top:12px;font-size:14px}
nav a{margin:0 8px}
.clock{
  border:2px solid var(--line);
  background:var(--panel);
  padding:16px;
  text-align:center;
}
.time{font-size:clamp(48px,14vw,110px);font-weight:bold;line-height:1}
.photo-frame{
  margin:14px auto 10px;
  border:8px ridge #aaa;
  background:#ddd;
  width:min(760px,100%);
  aspect-ratio:4/3;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}
.photo-frame img{width:100%;height:100%;object-fit:cover}
.placeholder{padding:24px;max-width:560px}
.placeholder .big{font-size:clamp(24px,5vw,42px);font-weight:bold}
.message{font-family:Georgia,serif;font-size:clamp(20px,3.3vw,30px);font-style:italic;margin:16px auto 8px;max-width:720px}
.credit{font-size:13px}
.status{margin-top:12px;font-size:13px}
.progress{margin:12px 0;height:18px;border:1px solid var(--line);background:#fff}
.progress span{display:block;height:100%;background:#222}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:6px}
.cell{padding:7px;border:1px solid #777;background:#eee;text-align:center;font-size:12px}
.cell.filled{background:#d9ead3}
.card{background:var(--panel);border:1px solid var(--line);padding:16px;margin:14px 0}
label{display:block;font-weight:bold;margin:12px 0 5px}
input,textarea,select,button{
  font:inherit;width:100%;padding:10px;border:1px solid #555;background:#fff
}
button,.button{
  display:inline-block;width:auto;background:#111;color:#fff;padding:9px 14px;text-decoration:none;border:0;cursor:pointer
}
.small{font-size:12px}
.notice{border:2px solid #333;padding:10px;background:#fff}
.warn{background:#fff3cd}
.ok{background:#d1e7dd}
.admin-grid{display:grid;grid-template-columns:160px 1fr;gap:14px;align-items:start}
.thumb{width:160px;height:120px;object-fit:cover;border:1px solid #555}
.actions{display:flex;gap:8px;flex-wrap:wrap}
.actions form{display:inline}
.actions button{width:auto}
footer{text-align:center;margin-top:28px;padding-top:15px;border-top:1px solid #777;font-size:12px}
@media (max-width:620px){
  .admin-grid{grid-template-columns:1fr}
  .thumb{width:100%;height:auto}
}
