
:root{
    --desktop:#008080;
    --win:#c0c0c0;
    --light:#ffffff;
    --mid:#808080;
    --dark:#404040;
    --black:#000000;
    --navy:#000080;
    --blue:#1084d0;
    --lime:#00ff00;
    --yellow:#ffff00;
    --magenta:#ff00ff;
    --cyan:#00ffff;
    --red:#ff0000;
    --font-ui:Tahoma,Verdana,Arial,sans-serif;
    --font-mono:"Courier New",Courier,monospace;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
    margin:0;
    color:#000;
    font-family:var(--font-ui);
    font-size:14px;
    background:#000 url("stars.gif") repeat;
    background-attachment:fixed;
}
a{color:#0000ee;text-decoration:underline}
a:visited{color:#551a8b}
a:hover{background:#000080;color:#fff}
button,input,textarea{font:inherit}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px dotted #000;outline-offset:2px}
.shell{width:min(980px,calc(100% - 16px));margin:8px auto 28px}
.window{
    background:var(--win);
    border-top:2px solid var(--light);
    border-left:2px solid var(--light);
    border-right:2px solid var(--black);
    border-bottom:2px solid var(--black);
    box-shadow:1px 1px 0 #000;
    margin-bottom:10px;
}
.titlebar{
    min-height:28px;
    padding:3px 4px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    color:#fff;
    font-weight:700;
    background:linear-gradient(90deg,var(--navy),var(--blue));
    user-select:none;
}
.titlebar.inactive{background:linear-gradient(90deg,#666,#aaa)}
.titlebar-title{display:flex;align-items:center;gap:7px;min-width:0}
.titlebar-title span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.app-icon{width:16px;height:16px;display:grid;place-items:center;background:#fff;color:#000080;border:1px solid #000;font:700 11px var(--font-mono)}
.window-controls{display:flex;gap:2px;flex:0 0 auto}
.window-controls span{
    width:21px;height:20px;display:grid;place-items:center;color:#000;background:var(--win);font:700 11px Arial;
    border-top:2px solid #fff;border-left:2px solid #fff;border-right:2px solid #000;border-bottom:2px solid #000;
}
.window-body{padding:10px}
.hero{
    background:#000;
    color:#00ff00;
    border:2px inset #fff;
    padding:18px 14px 15px;
    text-align:center;
    font-family:var(--font-mono);
    overflow:hidden;
}
.hero-kicker{color:var(--cyan);font-size:12px;letter-spacing:2px;text-transform:uppercase}
.logo{
    margin:8px 0 3px;
    font:bold clamp(38px,8vw,78px)/.92 Arial Black,Impact,sans-serif;
    letter-spacing:-3px;
    color:#ff0;
    text-shadow:3px 3px 0 #f00,6px 6px 0 #00f;
    transform:skew(-4deg);
}
.logo-version{color:#fff;font-size:.55em;vertical-align:top;text-shadow:2px 2px 0 #00f}
.hero-sub{color:#fff;font-weight:bold;margin-top:8px}
.hero-event{display:inline-block;margin-top:13px;padding:7px 10px;border:1px dashed #0f0;color:#0f0;background:#001900}
.badge-new{color:#ff0;background:#f00;font:bold 11px Arial;padding:2px 4px;margin-left:6px;animation:blink 1s steps(1,end) infinite}
@keyframes blink{50%{opacity:0}}
.navbar{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;margin-top:8px}
.winbtn,.winbtn:visited{
    display:block;padding:7px 8px;text-align:center;text-decoration:none;color:#000;background:var(--win);font-weight:700;
    border-top:2px solid #fff;border-left:2px solid #fff;border-right:2px solid #000;border-bottom:2px solid #000;
}
.winbtn:hover{background:#000080;color:#fff}
.winbtn:active{border-top:2px solid #000;border-left:2px solid #000;border-right:2px solid #fff;border-bottom:2px solid #fff}
.ticker{position:relative;overflow:hidden;white-space:nowrap;background:#000;color:#ff0;border:2px inset #fff;font:700 13px var(--font-mono);padding:5px 0}
.ticker-track{display:inline-block;padding-left:100%;animation:ticker 22s linear infinite}
@keyframes ticker{to{transform:translateX(-100%)}}
.desktop-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(245px,.55fr);gap:10px;align-items:start}
.section-title{font:bold 18px var(--font-ui);margin:0 0 9px;color:#000080}
.section-title::before{content:">> ";font-family:var(--font-mono)}
.retro-hr{height:2px;border-top:1px solid #808080;border-bottom:1px solid #fff;margin:10px 0}
.info-table{width:100%;border-collapse:collapse}
.info-table td{vertical-align:top;padding:4px 5px;border-bottom:1px dotted #808080}
.info-table td:first-child{width:112px;font-weight:700;color:#000080}
.statusbox{background:#000;color:#0f0;border:2px inset #fff;padding:9px;font:13px var(--font-mono)}
.statusline{display:flex;justify-content:space-between;gap:10px;margin:4px 0}
.status-ok{color:#0f0}.status-warn{color:#ff0}.status-hot{color:#ff00ff}
.progress{height:20px;border:2px inset #fff;background:#fff;padding:2px;margin-top:8px}
.progress-fill{height:100%;width:0;background:repeating-linear-gradient(90deg,#000080 0 12px,#1084d0 12px 24px);animation:boot 4.5s steps(18,end) infinite}
@keyframes boot{0%{width:4%}75%{width:93%}100%{width:100%}}
.hammer-row{display:flex;justify-content:center;gap:7px;align-items:end;min-height:62px;background:#000;border:2px inset #fff;padding:5px;overflow:hidden}
.hammer-row img{width:64px;max-width:28%;height:auto;image-rendering:pixelated}
.game-list{columns:2;column-gap:22px;margin:6px 0;padding-left:22px}
.game-list li{break-inside:avoid;margin:5px 0}
.callout{border:1px dashed #000080;background:#ffffcc;padding:8px;margin:10px 0}
.countdown{font:bold 18px var(--font-mono);color:#ff00ff;text-align:center;padding:8px;background:#000;border:2px inset #fff}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px 12px}
.field.full{grid-column:1/-1}
label{display:block;font-weight:700;margin-bottom:3px}
.req{color:#c00}
input[type="text"],input[type="email"],textarea{
    width:100%;min-height:40px;padding:7px 8px;background:#fff;color:#000;border:2px inset #fff;border-radius:0;font-family:var(--font-ui);font-size:16px;
}
textarea{min-height:105px;resize:vertical}
.checkbox{display:flex;align-items:flex-start;gap:8px;font-weight:400;background:#ddd;border:1px dotted #808080;padding:8px}
.checkbox input{width:18px;height:18px;margin:0}
.hidden-field{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}
.button-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:11px}
button.retro-button{
    min-height:38px;padding:6px 18px;background:var(--win);color:#000;font-weight:700;cursor:pointer;
    border-top:2px solid #fff;border-left:2px solid #fff;border-right:2px solid #000;border-bottom:2px solid #000;
}
button.retro-button:active{border-top:2px solid #000;border-left:2px solid #000;border-right:2px solid #fff;border-bottom:2px solid #fff}
.message{padding:8px 10px;margin:0 0 10px;border:2px inset #fff;font:bold 13px var(--font-mono)}
.message.success{background:#000;color:#0f0}.message.error{background:#fff;color:#900}.message.info{background:#ffffcc;color:#000080}
.message ul{margin:5px 0 0;padding-left:20px}
.privacy-note{font-size:12px;color:#333;margin-top:8px}
.participant-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.counter-badge{background:#000;color:#0f0;border:2px inset #fff;padding:5px 7px;font:700 13px var(--font-mono)}
.part-table{width:100%;border-collapse:collapse;background:#fff;border:2px inset #fff}
.part-table th{background:#000080;color:#fff;text-align:left;padding:6px;border:1px solid #c0c0c0;font-size:12px}
.part-table td{padding:6px;border:1px solid #c0c0c0;vertical-align:top;font-size:13px;overflow-wrap:anywhere}
.part-table tr:nth-child(even) td{background:#eee}
.part-table .num{width:38px;text-align:center;font-family:var(--font-mono)}
.rent-icon{white-space:nowrap;color:#000080;font-weight:700}
.footer{text-align:center;font:12px var(--font-mono);color:#000;background:#c0c0c0;padding:8px}
.footer img{image-rendering:pixelated;max-width:100%;height:auto}
.best-viewed{margin-top:5px;color:#333}
.modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.55);display:none;align-items:center;justify-content:center;padding:12px;z-index:1000}
.modal-backdrop.open{display:flex}
.modal{width:min(440px,100%);margin:0}
.modal .window-body{display:flex;gap:12px;align-items:flex-start}
.modal-icon{font-size:34px;line-height:1}
.modal-text{flex:1}
.modal-actions{display:flex;justify-content:center;padding:0 10px 10px}
@media (max-width:760px){
    .shell{width:min(100% - 8px,980px);margin-top:4px}
    .desktop-grid{grid-template-columns:1fr}
    .navbar{grid-template-columns:1fr 1fr}
    .navbar a:last-child{grid-column:1/-1}
    .game-list{columns:1}
    .logo{letter-spacing:-2px}
    .hero{padding-inline:8px}
    .form-grid{grid-template-columns:1fr}
    .field.full{grid-column:auto}
    .part-table,.part-table tbody,.part-table tr,.part-table td{display:block;width:100%}
    .part-table thead{display:none}
    .part-table{border:0;background:transparent}
    .part-table tr{background:#fff;border:2px inset #fff;margin-bottom:8px;padding:2px}
    .part-table tr:nth-child(even) td{background:#fff}
    .part-table td{border:0;border-bottom:1px dotted #aaa;padding:6px 7px 6px 118px;position:relative;min-height:29px}
    .part-table td:last-child{border-bottom:0}
    .part-table td::before{content:attr(data-label);position:absolute;left:7px;top:6px;width:104px;color:#000080;font-weight:700}
    .part-table .num{text-align:left;width:100%}
}
@media (max-width:430px){
    body{font-size:13px}
    .window-body{padding:7px}
    .navbar{grid-template-columns:1fr}
    .navbar a:last-child{grid-column:auto}
    .titlebar{font-size:12px}
    .window-controls span{width:19px}
    .hero-event{display:block}
    .hammer-row img:nth-child(3){display:none}
}
@media (prefers-reduced-motion:reduce){
    html{scroll-behavior:auto}
    .ticker-track,.progress-fill,.badge-new{animation:none}
    .ticker-track{padding-left:8px}
}

input[type=password],input[type=date],select{width:100%;min-height:40px;padding:7px;border:2px inset #fff;font:16px Tahoma,Arial,sans-serif;background:#fff;color:#000} form .retro-button{margin-top:10px}fieldset{margin:10px 0} .navbar{grid-template-columns:repeat(auto-fit,minmax(105px,1fr))}.gallery-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin-top:16px}.gallery-grid figure{margin:0;padding:8px}.gallery-grid img{width:100%;height:180px;object-fit:contain;background:#000}.gallery-grid figcaption{overflow-wrap:anywhere}dialog{max-width:95vw;max-height:95vh;background:#c0c0c0;border:3px outset #fff}dialog::backdrop{background:rgba(0,0,0,.85)}.table-scroll{overflow-x:auto} input[type=file]{max-width:100%}
.desktop-toolbar{position:sticky;top:0;z-index:10000;display:flex;align-items:center;gap:10px;background:#c0c0c0;border:2px outset #fff;padding:4px;margin-bottom:8px}.desktop-toolbar span{font-size:12px}.window[hidden]{display:none!important}.shell .window{position:relative}.titlebar{cursor:move;touch-action:none}.window-close{flex-shrink:0;margin-left:auto;width:23px;height:21px;cursor:pointer;background:#c0c0c0;color:#000;border:2px outset #fff;font:bold 16px Arial;line-height:15px}.dragging{user-select:none;box-shadow:3px 5px 12px #000}.titlebar:focus-visible{outline:2px dotted #fff;outline-offset:-4px}@media(max-width:760px){.titlebar{cursor:default;touch-action:auto}.desktop-toolbar span{display:none}}
.game-pick{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:6px;margin:4px 0 10px}.game-count{color:#000080;font-weight:700}
.xp-guide h2{margin-top:18px}.xp-guide kbd{display:inline-block;padding:0 5px;border:2px outset #fff;background:#c0c0c0;font:bold 12px var(--font-mono)}.xp-guide code{background:#fff;border:1px solid #808080;padding:0 3px}.checklist li,.steps>li{margin:6px 0}.steps>li ul,.steps>li ol{margin:4px 0}.howto{background:#fff;border:2px inset #fff;margin:8px 0;padding:0}.howto>summary{cursor:pointer;padding:8px 10px;font-weight:700;background:#c0c0c0;border-bottom:1px solid #808080;list-style:none}.howto>summary::before{content:'[+] ';font-family:var(--font-mono);color:#000080}.howto[open]>summary::before{content:'[-] '}.howto>*:not(summary){margin:8px 10px}.howto .info-table td{overflow-wrap:anywhere}.model-meta{font-weight:400;color:#333;font-size:12px;margin-left:6px}.drivers{margin:0;padding-left:18px}.imac-table td{font-size:12px}
.lb{padding:0;border:2px solid;border-color:#fff #000 #000 #fff;background:#c0c0c0;width:min(1100px,96vw);max-width:96vw;max-height:96vh;color:#000;box-shadow:4px 4px 0 #000}
.lb::backdrop{background:rgba(0,0,40,.88)}
.lb-titlebar{display:flex;align-items:center;gap:7px;padding:3px 4px;color:#fff;font-weight:700;background:linear-gradient(90deg,#000080,#1084d0)}
.lb-title{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lb-stage{position:relative;display:flex;align-items:center;justify-content:center;background:#000;margin:4px;border:2px inset #fff;min-height:200px;height:min(72vh,760px);touch-action:pan-y}
.lb-stage img{max-width:100%;max-height:100%;object-fit:contain;display:block;transition:opacity .15s}
.lb.is-loading .lb-stage img{opacity:.35}
.lb-loading{position:absolute;color:#0f0;font:bold 13px var(--font-mono);display:none}
.lb.is-loading .lb-loading{display:block}
.lb-nav{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:64px;background:#c0c0c0;color:#000;font-size:20px;cursor:pointer;border:2px solid;border-color:#fff #000 #000 #fff;opacity:.85}
.lb-nav:hover,.lb-nav:focus-visible{opacity:1;background:#000080;color:#fff}
.lb-nav:active{border-color:#000 #fff #fff #000}
.lb-prev{left:8px}.lb-next{right:8px}
.lb.single .lb-nav,.lb.single #lb-play{display:none}
.lb-status{display:flex;gap:3px;padding:0 4px 4px;align-items:stretch;font-size:13px}
.lb-cell{border:1px solid;border-color:#808080 #fff #fff #808080;padding:4px 7px;display:flex;align-items:center;gap:6px}
#lb-counter{font-family:var(--font-mono);font-weight:700;white-space:nowrap}
.lb-caption{flex:1;min-width:0;overflow-wrap:anywhere;display:block}
.lb-caption small{color:#444}
.lb-btn,.lb-btn:visited{background:#c0c0c0;color:#000;border:2px solid;border-color:#fff #000 #000 #fff;padding:3px 9px;font:bold 12px var(--font-ui);text-decoration:none;cursor:pointer;white-space:nowrap}
.lb-btn:hover{background:#000080;color:#fff}
.lb-btn[aria-pressed="true"]{border-color:#000 #fff #fff #000;background:#a0a0a0}
@media(max-width:600px){.lb-stage{height:62vh}.lb-nav{width:36px;height:52px}.lb-status{flex-wrap:wrap}.lb-caption{order:3;flex-basis:100%}}
