:root{--ink:#171611;--paper:#f4efdf;--bone:#d7cfb9;--red:#e33b21}*{box-sizing:border-box}html{background:var(--ink)}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,sans-serif}button,a{font:inherit}header{min-height:128px;background:var(--ink);color:var(--paper);display:flex;align-items:end;justify-content:space-between;padding:24px 3vw 20px;border-bottom:8px solid var(--red)}small{font:700 11px/1.2 "Courier New",monospace;letter-spacing:.14em}h1,h2{font-family:"Arial Black",Impact,sans-serif;letter-spacing:-.055em;margin:0;line-height:.82}h1{font-size:clamp(44px,8vw,108px)}h2{font-size:clamp(38px,6vw,74px)}output{border:1px solid var(--paper);padding:9px 12px;font:700 11px "Courier New",monospace}.workbench{display:grid;grid-template-columns:170px minmax(0,1fr);background:#8c8a80;border-bottom:3px solid var(--ink)}.tools{background:var(--bone);border-right:3px solid var(--ink);padding:12px;display:flex;flex-direction:column;gap:12px}.tools fieldset{border:0;border-top:2px solid var(--ink);padding:6px 0 0;margin:0;display:grid;gap:5px}.tools legend{padding:0;font:700 10px "Courier New",monospace;letter-spacing:.15em}.tools button,.viewer-bar button,.viewer-bar a{border:1px solid var(--ink);background:var(--paper);color:var(--ink);padding:9px 7px;text-align:left;font:700 11px "Courier New",monospace;cursor:pointer;text-decoration:none}.tools button:hover,.tools button.active{background:var(--ink);color:var(--paper)}#publish{margin-top:auto;background:var(--red);color:#fff;border:3px solid var(--ink);padding:15px 8px}.stage{padding:28px;overflow:auto;display:flex;justify-content:center;align-items:start;min-height:80vh}.paper{width:min(100%,647px);aspect-ratio:11/17;box-shadow:8px 8px 0 #17161173;background:var(--paper);overflow:hidden}.paper canvas,.canvas-container{display:block;width:100%!important;height:100%!important}.archive{padding:48px 3vw 72px}.archive-head{display:flex;justify-content:space-between;align-items:end;border-bottom:5px solid var(--ink);padding-bottom:12px;margin-bottom:20px}.archive-head strong,.grid p{font:700 12px "Courier New",monospace}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:18px}.edition{background:transparent;border:0;padding:0;text-align:left;cursor:pointer}.edition img{width:100%;aspect-ratio:11/17;object-fit:cover;border:2px solid var(--ink);box-shadow:4px 4px 0 var(--ink)}.edition span{display:block;margin-top:9px;font:700 11px "Courier New",monospace}.edition:hover img{transform:translate(-2px,-2px);box-shadow:7px 7px 0 var(--red)}footer{background:var(--ink);color:var(--paper);padding:24px 3vw;font:700 10px/1.5 "Courier New",monospace;letter-spacing:.1em}.viewer{position:fixed;inset:0;z-index:20;background:#171611f0;display:flex;flex-direction:column}.hidden{display:none}.viewer-bar{display:flex;gap:8px;align-items:center;padding:10px;background:var(--bone);border-bottom:3px solid var(--ink);font:700 11px "Courier New",monospace}.viewer-bar span{margin-right:auto}.viewer-body{flex:1;overflow:auto;padding:24px;text-align:center}.viewer-body img{width:min(850px,100%);height:auto;box-shadow:8px 8px 0 var(--red)}@media(max-width:700px){header{align-items:start;flex-direction:column;gap:18px}.workbench{grid-template-columns:1fr}.tools{border-right:0;border-bottom:3px solid var(--ink);display:grid;grid-template-columns:repeat(2,1fr)}#publish{grid-column:1/-1;margin:0;text-align:center}.stage{padding:18px 10px;min-height:auto}.archive-head{align-items:start;gap:18px;flex-direction:column}.grid{grid-template-columns:repeat(2,1fr)}.viewer-bar{flex-wrap:wrap}.viewer-bar span{width:100%}}


/* SILVERHEAD TRANSMISSION SKIN */

body {
    background:
        linear-gradient(rgba(92, 205, 222, 0.055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(92, 205, 222, 0.055) 1px, transparent 1px),
        #070a0b;
    background-size: 34px 34px;
    color: #e8eee9;
}

header {
    background: #050708;
    color: #f4efdf;
    border-bottom: 1px solid #64cbd8;
    box-shadow: 0 0 24px rgba(100, 203, 216, 0.18);
}

header small,
.archive small {
    color: #64cbd8;
}

output {
    color: #64cbd8;
    border-color: #64cbd8;
    background: rgba(100, 203, 216, 0.05);
}

.workbench {
    background:
        linear-gradient(rgba(100, 203, 216, 0.06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(100, 203, 216, 0.06) 1px, transparent 1px),
        #090d0f;
    background-size: 28px 28px;
    border-bottom-color: #64cbd8;
}

.tools {
    background: #0c1012;
    color: #e8eee9;
    border-color: #64cbd8;
}

.tools fieldset {
    border-color: #52666a;
}

.tools legend {
    color: #64cbd8;
}

.tools button,
.viewer-bar button,
.viewer-bar a {
    background: #090d0f;
    color: #e8eee9;
    border-color: #52666a;
}

.tools button:hover,
.tools button.active {
    background: #64cbd8;
    color: #050708;
    border-color: #64cbd8;
}

#publish {
    background: #d63a32;
    color: white;
    border-color: #f4efdf;
}

.stage {
    border-left: 1px solid rgba(100, 203, 216, 0.25);
}

.paper {
    background: #f4efdf;
    box-shadow:
        0 0 0 1px #64cbd8,
        12px 12px 0 rgba(0, 0, 0, 0.65),
        0 0 36px rgba(100, 203, 216, 0.12);
}

.archive {
    background: transparent;
}

.archive-head {
    border-color: #64cbd8;
}

.archive-head strong,
.edition span,
.grid p {
    color: #64cbd8;
}

.edition img {
    border-color: #52666a;
    box-shadow: 4px 4px 0 #050708;
}

.edition:hover img {
    box-shadow:
        7px 7px 0 #d63a32,
        0 0 20px rgba(100, 203, 216, 0.25);
}

footer {
    border-top: 1px solid #64cbd8;
    background: #050708;
    color: #aebbb8;
}

.viewer-bar {
    background: #0c1012;
    color: #e8eee9;
    border-color: #64cbd8;
}