:root{--primary: #e9967a;--secondary: #ffb6a5;--background: #fff0e6;--text: #342c29;--muted: #f4dcd3}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Courier New,monospace;background-color:var(--background);color:var(--text);line-height:1.6;font-size:16px;display:flex;flex-direction:column;min-height:100vh}.skip-link{position:absolute;top:-40px;left:0;background:var(--primary);color:var(--text);padding:8px;z-index:100;font-weight:700;border:2px solid var(--text)}.skip-link:focus{top:0}header{background-color:var(--primary);color:var(--text);padding:1rem;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;border-bottom:3px solid var(--text);font-weight:700;text-transform:uppercase}header h1 i{margin-right:.5rem}nav a{color:var(--text);margin-left:1rem;text-decoration:none;font-weight:700;border:2px solid var(--text);padding:4px 8px;background-color:var(--secondary);transition:background-color .3s ease}nav a:hover{background-color:var(--primary);color:var(--background);text-decoration:none}main{padding:1rem;margin:auto;flex:1;max-width:1200px;background-color:var(--background);border:2px solid var(--text);box-shadow:inset 0 0 5px var(--muted)}footer{background-color:var(--secondary);color:var(--text);text-align:center;padding:1rem;margin-top:auto;border-top:3px solid var(--text);font-weight:700;text-transform:uppercase}.card{border:2px solid var(--text);padding:1rem;margin-bottom:1.5rem;background-color:var(--background);display:flex;flex-direction:column;gap:.5rem;font-family:Courier New,monospace;box-shadow:inset 1px 1px 0 var(--secondary)}.card img{width:100%;height:auto;border:2px solid var(--text)}.card h3{margin-top:.5rem;color:var(--primary);font-weight:700;text-transform:uppercase;letter-spacing:1px}.card p{margin:.25rem 0;font-size:.95rem}form{display:flex;flex-direction:column;gap:.75rem;margin-top:1rem;font-family:Courier New,monospace}form label{font-weight:700;letter-spacing:.05em}form input,form textarea{width:100%;padding:.6rem;font-size:1rem;border:2px solid var(--text);background-color:var(--background);color:var(--text);font-family:Courier New,monospace}form input:focus,form textarea:focus{outline:none;border-color:var(--primary);background-color:var(--muted)}form button{margin-top:1rem;padding:.75rem;font-size:1rem;background-color:var(--primary);color:var(--text);border:2px solid var(--text);cursor:pointer;font-weight:700;text-transform:uppercase;font-family:Courier New,monospace;transition:background-color .3s ease}form button:hover{background-color:var(--secondary);color:var(--text)}.view-transition{view-transition-name:page;transition:all .4s ease-in-out}::view-transition-old(page),::view-transition-new(page){animation:fade .3s ease-in-out both}@keyframes fade{0%{opacity:0}to{opacity:1}}@media (max-width: 600px){header,footer,main{padding:1rem}nav{flex:1 1 100%;text-align:left;margin-top:.5rem}.card{padding:.75rem}form input,form textarea,form button{font-size:1rem}}.header-banner-wrapper{background-color:var(--background);text-align:center;padding:.5rem 0;border-bottom:2px solid var(--primary);font-family:Courier New,monospace;color:var(--primary);font-weight:700;text-transform:uppercase}.login-banner-wrapper{display:flex;flex-direction:column;align-items:center;justify-content:center;margin:2rem 0;text-align:center;font-family:Courier New,monospace;color:var(--primary)}.login-banner-wrapper img{width:400px;max-width:80%;height:auto;margin-bottom:1rem;border:2px solid var(--primary)}.coord-inputs{display:flex;gap:1rem;margin-top:1rem}.coord-inputs input{flex:1;padding:.5rem;font-size:1rem;border:2px solid var(--muted);background-color:var(--background);color:var(--text);font-family:Courier New,monospace}.form-buttons{display:flex;gap:1rem;margin-top:1.5rem}button.primary{background-color:var(--primary);color:var(--text);border:2px solid var(--text);font-family:Courier New,monospace;font-weight:700;cursor:pointer;text-transform:uppercase;padding:.5rem 1rem;transition:background-color .3s ease}button.primary:hover{background-color:var(--secondary)}button.outline{background-color:var(--primary);color:var(--text);border:2px solid var(--text);font-family:Courier New,monospace;font-weight:700;cursor:pointer;text-transform:uppercase;padding:.5rem 1rem;transition:background-color .3s ease}button.outline:hover{background-color:var(--secondary)}.form-wrapper{max-width:600px;width:100%;margin:3rem auto;background:var(--background);padding:2rem;border:2px solid var(--primary);box-shadow:inset 1px 1px 5px var(--muted);font-family:Courier New,monospace}.form-wrapper h2{text-align:center;margin-bottom:1.5rem;color:var(--primary);font-weight:700;text-transform:uppercase;letter-spacing:2px}.form-wrapper form label{display:block;margin:.5rem 0 .3rem;font-weight:700;font-family:Courier New,monospace;letter-spacing:.1em}.form-wrapper form input,.form-wrapper form textarea{width:100%;padding:.75rem;border:2px solid var(--primary);background-color:var(--background);color:var(--text);font-family:Courier New,monospace;font-size:1rem;resize:vertical}.form-wrapper form input:focus,.form-wrapper form textarea:focus{outline:none;border-color:var(--secondary);background-color:var(--muted)}#startCamera,#capturePhoto,#stopCamera,#deletePhoto{font-family:VT323,monospace;background-color:salmon;color:#000;border:2px solid #000;padding:6px 12px;cursor:pointer;margin:4px;border-radius:2px;box-shadow:2px 2px #000}#startCamera:hover,#capturePhoto:hover,#stopCamera:hover{background-color:#ffa07a;color:#000}#story-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;font-family:VT323,monospace}.story-card{background:#fff0e6;border-radius:0;border:2px solid #000;box-shadow:4px 4px #000;overflow:hidden;display:flex;flex-direction:column}.story-card img{width:100%;height:150px;object-fit:cover;border-bottom:2px solid #000}.story-content{padding:1rem}.story-content h3{margin:0 0 .5rem;color:#000;font-size:1.2rem}.story-content p{margin:0;font-size:1rem;color:#333}.story-date{font-size:.85rem;color:#555;margin-top:.3rem}.story-button{display:inline-block;background:#000;color:salmon;padding:6px 12px;text-decoration:none;border:2px solid #000;font-weight:700;margin-top:.5rem;font-family:VT323,monospace;box-shadow:2px 2px #000}.story-button:hover{background:#333}#fab{position:fixed;bottom:24px;right:24px;width:48px;height:48px;background:salmon;color:#000;font-size:24px;border:2px solid #000;border-radius:0;cursor:pointer;font-family:VT323,monospace;box-shadow:4px 4px #000}#fab:hover{background:#ffa07a}.pagination{display:flex;justify-content:center;align-items:center;gap:1rem;margin-top:1rem;font-family:VT323,monospace}.pagination button{background-color:salmon;color:#000;border:2px solid #000;padding:.5rem 1rem;cursor:pointer;font-size:1rem;box-shadow:2px 2px #000}.pagination button:disabled{background-color:#ccc;color:#666;cursor:not-allowed}.pagination span{font-weight:700}.detail-container{max-width:700px;margin:0 auto;padding:1rem;font-family:VT323,monospace;line-height:1.6;border:2px solid #000;border-radius:0;box-shadow:4px 4px #000;background-color:#fff0e6}.detail-container a.back-link{display:inline-block;background-color:#000;color:salmon;padding:.5rem 1rem;border:2px solid #000;text-decoration:none;font-weight:700;margin-bottom:1rem;font-family:VT323,monospace;box-shadow:2px 2px #000}.detail-container a.back-link:hover{background-color:#333;color:#ffa07a}.detail-container h2,.detail-container h3{margin-top:0;color:#000}.detail-container p{margin:.5rem 0;color:#222}.btn-login-link{display:inline-block;background-color:salmon;color:#000;padding:10px 16px;border:2px solid #000;border-radius:2px;text-decoration:none;font-weight:700;margin-top:12px;font-family:VT323,monospace;box-shadow:2px 2px #000;transition:background-color .2s ease}.btn-login-link:hover{background-color:#ffa07a;color:#000}.custom-btn{font-family:VT323,monospace;display:inline-flex;align-items:center;gap:6px;font-size:1rem;padding:6px 12px;background-color:salmon;border:2px solid #000;color:#000;border-radius:2px;cursor:pointer;box-shadow:2px 2px #000;transition:background-color .2s}.custom-btn:hover{background-color:#ffa07a}.bookmark-actions{display:flex;gap:8px;font-family:VT323,monospace}#bookmark-list{list-style:none;padding:0;margin-top:1rem;font-family:VT323,monospace}#bookmark-list li{background-color:#fff0e6;border:2px solid #000;padding:12px 16px;margin-bottom:12px;border-radius:0;box-shadow:2px 2px #000;transition:background-color .2s}#bookmark-list a{text-decoration:none;color:#000;font-size:1.1rem}#bookmark-list small{color:#444;font-size:.95rem}.delete-bookmark{font-family:VT323,monospace;margin-top:8px;color:#000;padding:6px 12px;font-size:1rem;background-color:salmon;border:2px solid #000;border-radius:2px;cursor:pointer;box-shadow:2px 2px #000;transition:background-color .2s}.delete-bookmark:hover{background-color:#ffa07a}.toast{position:fixed;bottom:20px;left:50%;transform:translate(-50%);background-color:#000;color:salmon;padding:12px 20px;border:2px solid #000;border-radius:0;font-size:1.1rem;font-family:VT323,monospace;box-shadow:4px 4px #000;z-index:9999;opacity:0;pointer-events:none;transition:opacity .3s ease}.toast.show{opacity:1;pointer-events:auto}
