* { box-sizing: border-box; }
html, body, main { width: 100%; height: 100%; margin: 0; overflow: hidden; background: #000; }
body { overscroll-behavior: none; color: #fff; font: 14px/1.6 monospace; }
#forest { display: block; width: 100%; height: 100%; outline: none; cursor: none; image-rendering: pixelated; touch-action: none; }
#fallback, noscript { position: absolute; max-width: 30em; top: 45%; left: 50%; transform: translate(-50%, -50%); }
[hidden] { display: none !important; }
#field-controls { position: absolute; top: max(18px, env(safe-area-inset-top)); right: max(18px, env(safe-area-inset-right)); width: 226px; padding: 9px 10px; background: #000b; border: 1px solid #ffffff26; opacity: .67; transition: opacity .2s; }
#field-controls:hover, #field-controls:focus-within { opacity: 1; }
.control-buttons { display: flex; justify-content: space-between; gap: 8px; margin-bottom: 10px; }
button { appearance: none; display: block; padding: 3px 0; border: 0; background: transparent; color: #fff; cursor: pointer; }
button:focus-visible { outline: 1px solid #fff; outline-offset: 4px; }
button canvas, #key-legend, #map-drawing, #discovery { display: block; image-rendering: pixelated; }
#map-button canvas { width: 51px; height: 16.5px; }
#keys-button canvas { width: 60px; height: 16.5px; }
#sound-button canvas { width: 69px; height: 16.5px; }
#key-legend { width: 163px; height: 59px; }
#discovery { position: absolute; left: 50%; bottom: max(36px, env(safe-area-inset-bottom)); width: 300px; height: 28px; transform: translateX(-50%); opacity: 0; transition: opacity .45s; pointer-events: none; }
#discovery.visible { opacity: 1; }
#interaction-hint { position:absolute;bottom:18%;left:50%;transform:translateX(-50%);font:11px/1.5 monospace;letter-spacing:2px;padding:7px 11px;background:#000b;color:#ddd;pointer-events:none;text-align:center; }
#forest.interactive { cursor:crosshair; }
#terminal { width:min(880px,calc(100vw - 28px));height:min(700px,calc(100dvh - 40px));max-width:none;max-height:none;padding:0;border:13px solid #303030;border-radius:22px;background:#101211;color:#c5cbc6;box-shadow:0 0 0 2px #555,inset 0 0 70px #000;overflow:hidden;font:12px/1.8 monospace; }
#terminal::backdrop {background:#000d;}
#terminal::after {content:'';position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,#0002 0,#0002 1px,transparent 1px,transparent 3px);box-shadow:inset 0 0 75px #0008;border-radius:8px;}
.terminal-top,.terminal-bottom { display:flex;justify-content:space-between;align-items:center;padding:16px 24px;letter-spacing:1px;font-size:10px;gap:12px; }
.terminal-top {border-bottom:1px solid #535953;}.terminal-top button {font:inherit;color:#a6ada7;white-space:nowrap;}
#terminal-tabs {display:flex;gap:22px;padding:12px 26px;border-bottom:1px solid #303830;}
#terminal-tabs button {font:10px monospace;letter-spacing:1px;color:#b6c0b7;}
#terminal-content {padding:34px 42px;height:calc(100% - 150px);overflow:auto;}
#terminal-content h2 {font:clamp(24px,5vw,52px)/1.1 monospace;letter-spacing:5px;color:#e2e7e1;margin:22px 0;}
#terminal-content p {max-width:47em;font-size:12px;line-height:1.9;color:#aeb8af;}
.terminal-kicker {font-size:9px;letter-spacing:2px;color:#78877b;}.terminal-intro {font-size:17px!important;}
.terminal-rule {height:1px;background:#374239;margin:30px 0;}.terminal-action {border:1px solid #637166;padding:10px 13px;margin-top:25px;font:10px monospace;letter-spacing:1px;color:#c7d3c8;}
.terminal-action:hover {background:#d1d9d1;color:#101211;}.terminal-bottom {position:absolute;bottom:0;left:0;right:0;border-top:1px solid #344037;background:#101211;}
.photo-grid {display:grid;grid-template-columns:1fr 1fr;gap:24px;}.found-photo {display:block;width:100%;aspect-ratio:1;border:6px solid #8c8b7f;background-size:200% 200%;background-repeat:no-repeat;filter:grayscale(1) contrast(1.1);padding:0;}
.found-photo.large {width:min(100%,390px);margin:0 auto;}.photo-caption {font-size:9px!important;letter-spacing:1px;}.notebook-line {font-size:16px!important;color:#d0d7cf!important;}
@media(max-width:540px){#terminal-content{padding:20px;} .terminal-top,.terminal-bottom{padding:12px;font-size:8px;} .photo-grid{gap:14px;} #terminal-tabs{padding:12px;} }
#field-map { padding: 0; border: 1px solid #666; background: #080808; color: #fff; width: min(768px, calc(100vw - 32px), calc((100dvh - 48px) * 1.0667)); max-width: none; max-height: calc(100dvh - 32px); overflow: hidden; }
#field-map::backdrop { background: #000b; }
#map-drawing { width: 100%; height: auto; }
#map-close { position: absolute; right: 16px; top: 13px; z-index: 1; }
#map-close canvas { width: 84px; height: 16.5px; }
@media (pointer: coarse) { #forest { cursor: default; } #field-controls { opacity: .85; } button { padding: 9px 0; } }
@media (prefers-reduced-motion: reduce) { #field-controls, #discovery { transition: none; } }
#ending { position:fixed;inset:0;width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:#000;color:#ddd;text-align:center; }
#ending[open] { display:flex;flex-direction:column;align-items:center;justify-content:center;gap:55px; }
#ending::backdrop { background:#000; }
#ending h1 { font:24px/1 monospace;letter-spacing:12px;font-weight:normal;margin:0 0 0 12px; }
#return-to-forest { font:9px/1.5 monospace;letter-spacing:2px;color:#777;padding:12px; }
#return-to-forest:hover { color:#fff; }

#terminal .portfolio-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:25px;margin:25px 0}#terminal .portfolio-card{display:block;text-align:left;border:1px solid #4b544d;padding:12px;width:100%;font:inherit;color:inherit;background:#101211}#terminal .portfolio-card:hover,#terminal .portfolio-card:focus-visible{border-color:#d0d7cf;background:#1b211c}#terminal .portfolio-card h3{font:16px/1.4 monospace;letter-spacing:1px;margin:14px 0 8px}#terminal .portfolio-card p{font-size:10px;margin:0}#terminal .portfolio-card-cover{display:block;width:100%;aspect-ratio:1.5;object-fit:cover;background:#050505}#terminal .portfolio-filters,#terminal .portfolio-footer,#terminal .portfolio-pagination{display:flex;align-items:center;flex-wrap:wrap;gap:15px;margin:20px 0}#terminal .portfolio-filters .terminal-action{margin:0;padding:6px 9px;font-size:8px}#terminal .portfolio-filters [aria-pressed=true]{background:#c7d3c8;color:#101211}#terminal a.terminal-action{display:inline-block;text-decoration:none}#terminal .portfolio-project-cover,#terminal .portfolio-large-image{width:100%;height:auto;display:block;margin:25px 0}#terminal .portfolio-project-cover{cursor:zoom-in}#terminal .portfolio-project-body{margin:25px 0;overflow-wrap:anywhere}#terminal .portfolio-project-body img,#terminal .portfolio-project-body video{max-width:100%;height:auto}#terminal .portfolio-project-body h2{font:24px/1.4 monospace;letter-spacing:2px}#terminal .portfolio-project-body h3{font:18px/1.4 monospace;letter-spacing:1px}#terminal .portfolio-project-body figure{margin:25px 0}#terminal .portfolio-project-body a{color:#ddd;text-decoration:underline}#terminal .portfolio-gallery{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:30px 0}#terminal .portfolio-gallery button{padding:0;width:100%}#terminal .portfolio-gallery img{width:100%;height:auto;display:block}#terminal .portfolio-video{display:block;width:100%;aspect-ratio:16/9;border:0;background:#000;margin:25px 0}#terminal .portfolio-pagination{justify-content:space-between;font-size:10px}#terminal .portfolio-pagination .terminal-action{margin:0}#terminal .portfolio-footer .terminal-action{margin:0;font-size:8px}@media(max-width:540px){#terminal .portfolio-grid{grid-template-columns:1fr}#terminal .portfolio-gallery{grid-template-columns:1fr}}
