.campaign-photo{display:block;margin:18px 0 22px;border:1px solid #225477;border-radius:12px;overflow:hidden;background:#061323;text-align:center}
.campaign-photo img{display:block;width:100%;height:340px;object-fit:contain;background:#020c17}
.campaign-photo span{display:block;padding:10px;color:var(--cyan);font-weight:700;font-size:13px}
.campaign-photo-empty{padding:18px;border:1px dashed #326183;border-radius:10px;margin:16px 0;color:var(--muted)}
.package-quantity{display:block;font-weight:800;color:#eef5ff;font-size:18px;margin-bottom:6px}
.package{min-width:0;overflow-wrap:anywhere}
.columns>*{min-width:0}
textarea{font:inherit;color:inherit;background:#0b2135;border:1px solid #527b9c;border-radius:6px;width:100%;padding:12px;box-sizing:border-box}
[hidden]{display:none!important}
@media(max-width:800px){
 body{background-attachment:scroll;background-image:linear-gradient(#020d1cef,#020d1cf5),url('assets/arcade-reference.png');font-size:14px}
 header{padding:14px 16px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;min-height:0}
 header .brand{font-size:20px;letter-spacing:0;overflow-wrap:anywhere;line-height:1.15}
 header>.button{padding:10px 12px;min-height:42px;font-size:14px;white-space:nowrap}
 header>nav{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;gap:4px;overflow:visible;white-space:normal;padding:0}
 header>nav a{display:flex;align-items:center;justify-content:center;text-align:center;min-height:40px;padding:4px;font-size:14px;background:#0b2236;border-radius:6px}
 .workspace{padding:18px 12px 24px}
 .masthead{padding:0 4px 18px;display:block}
 .masthead .titlemark{font-size:23px!important;line-height:1.2}
 .masthead p{font-size:18px;line-height:1.3;margin:10px 0 0}
 .masthead p span{font-size:13px;line-height:1.5}
 .campaign-picker{font-size:13px;margin-bottom:14px}
 .campaign-picker select{min-height:44px}
 .surface{padding:0;background:transparent;box-shadow:none}
 .columns{gap:14px}
 .panel{padding:18px 14px;border-radius:12px}
 .hero h1{font-size:32px;line-height:1.08;margin:14px 0;overflow-wrap:anywhere}
 .hero h2{font-size:23px;line-height:1.2;margin:14px 0 10px}
 .hero p{font-size:14px;line-height:1.6;margin:10px 0 16px}
 .eyebrow{font-size:11px;letter-spacing:2px}
 .campaign-photo{margin:14px 0}
 .campaign-photo img{height:260px}
 .hero>.button{width:100%;box-sizing:border-box;text-align:center;padding:14px 10px;font-size:18px}
 .packages{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:18px}
 .packages .package{padding:14px 8px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;margin:0;min-height:180px}
 .package-quantity{font-size:18px;margin:0}
 .packages .package-name{font-size:12px;line-height:1.25}
 .packages .package b{font-size:29px;line-height:1.1;margin:3px 0}
 .packages .package-unit,.packages .package-original{display:none}
 .packages .package-savings{font-size:11px;line-height:1.3}
 .packages .package>.muted{font-size:12px;line-height:1.3}
 .packages .package-badge{font-size:10px;padding:4px 7px;margin:0}
 .columns>aside h2{font-size:25px;margin:0 0 12px}
 .columns>aside .stat,.columns>aside .timer{font-size:32px;line-height:1.2}
 .columns>aside p{font-size:13px;line-height:1.5}
 footer{padding:20px 16px;gap:12px;font-size:12px}
 footer>span{display:none}
 footer>small{font-size:11px}
 .admin-nav{display:flex;flex-wrap:wrap;white-space:normal;overflow:visible}
 .admin-nav a{font-size:12px;padding:9px}
}
@media(max-width:360px){header{grid-template-columns:1fr}header>.button{width:100%;text-align:center;box-sizing:border-box}.hero h1{font-size:28px}}