*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--primary: #ff4400;--primary-hover: #e03d00;--secondary: #5b7a9d;--secondary-hover: #4d6a8a;--text: #333;--text-muted: #666;--text-faint: #767676;--border: #eee;--bg: #fff;--bg-subtle: #f5f5f5;--bg-elevated: #f8f9fa;--danger: #e55;--danger-hover: #c44;--radius: 6px;--font-heading: "Teko", sans-serif;--font-body: "Ubuntu", sans-serif}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}body{font-family:var(--font-body);color:var(--text);background:var(--bg);line-height:1.6;font-size:15px;-webkit-font-smoothing:antialiased}a{color:var(--primary);text-decoration:none}a:hover{text-decoration:underline}button{font-family:var(--font-body);cursor:pointer;border:none;border-radius:var(--radius);font-size:14px;font-weight:500;transition:background .15s}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--primary);outline-offset:2px}button:disabled{opacity:.5;cursor:not-allowed}input,textarea,select{font-family:var(--font-body);font-size:14px;padding:10px 12px;border:1px solid var(--border);border-radius:var(--radius);width:100%;transition:border-color .15s}input:focus,textarea:focus,select:focus{outline:none;border-color:var(--primary)}h1,h2,h3{font-family:var(--font-heading);font-weight:600;letter-spacing:-.3px}.container{max-width:960px;margin:0 auto;padding:0 24px}.btn-primary{background:var(--primary);color:#fff;padding:10px 20px}.btn-primary:hover{background:var(--primary-hover)}.btn-secondary{background:var(--secondary);color:#fff;padding:8px 16px}.btn-secondary:hover{background:var(--secondary-hover)}.btn-tertiary{background:transparent;color:var(--text);padding:8px 16px;border:1px solid var(--border)}.btn-tertiary:hover{background:var(--bg-subtle)}.btn-danger{background:transparent;color:var(--danger);padding:6px 12px;border:1px solid var(--danger);font-size:12px}.btn-danger:hover{background:var(--danger);color:#fff}.card{border:1px solid var(--border);border-radius:var(--radius);padding:20px;background:var(--bg);transition:box-shadow .15s}.card:hover{box-shadow:0 2px 8px #0000000f}#toast-container{position:fixed;bottom:24px;left:50%;transform:translate(-50%);z-index:1000;display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none}.toast{background:var(--text);color:#fff;padding:10px 20px;border-radius:var(--radius);font-size:14px;max-width:360px;text-align:center;opacity:0;transform:translateY(20px);transition:opacity .2s,transform .2s;pointer-events:auto;box-shadow:0 4px 12px #00000026}.toast.toast-enter{opacity:1;transform:translateY(0)}.toast.toast-exit{opacity:0;transform:translateY(-10px)}.toast.toast-success{background:#2d8a4e}.toast.toast-error{background:#c44}.toast.toast-info{background:var(--text)}.offline-banner{background:var(--text-faint);color:#fff;text-align:center;padding:6px;font-size:13px;display:none}.offline-banner.visible{display:block}.spinner{width:40px;height:40px;border:3px solid var(--border);border-top-color:var(--primary);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}#boot-loader{display:flex;align-items:center;justify-content:center;height:100vh}.page-header{display:flex;justify-content:space-between;align-items:center;padding:16px 24px;border-bottom:1px solid var(--border)}.page-header h1,.page-header h2{font-size:28px}.avatar{width:32px;height:32px;border-radius:50%;background:var(--bg-subtle);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px}.user-pill{display:flex;align-items:center;gap:12px}.user-pill span{color:var(--text-muted);font-size:14px}.header-actions{display:flex;align-items:center;gap:8px}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.section-header h2{font-size:32px}.room-card{cursor:pointer}.room-card h3{font-size:20px;font-family:var(--font-body);font-weight:600}.room-meta{color:var(--text-faint);font-size:13px;margin-top:4px}.room-type{color:var(--text-faint);font-size:12px;margin-top:8px}.wall-card{cursor:pointer;border-radius:var(--radius);overflow:hidden;border:1px solid var(--border)}.wall-card img{width:100%;aspect-ratio:16/10;object-fit:cover;display:block}.wall-info{padding:8px 10px}.wall-info p:first-of-type{font-size:14px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.wall-info p:last-of-type{font-size:12px;color:var(--text-faint)}.wall-row{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid var(--border);border-radius:var(--radius)}.wall-row img{width:64px;height:40px;border-radius:4px;object-fit:cover;flex-shrink:0}.wall-row .caption{font-weight:600}.wall-row .meta{color:var(--text-faint);margin-left:8px;font-size:13px}.view-toggle-bar{display:flex;gap:4px;margin-bottom:20px;background:var(--bg-subtle);padding:3px;border-radius:4px;width:fit-content}.wallpaper-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}.member-badge{background:var(--bg-subtle);padding:3px 8px;border-radius:3px;font-size:12px;color:var(--text-faint)}.modal-backdrop{position:fixed;inset:0;background:#0009;z-index:200;display:flex;align-items:center;justify-content:center}.detail-card{max-width:480px;width:90%;overflow:hidden;padding:0}.detail-card img{width:100%;display:block}.detail-card .detail-info{padding:16px}.detail-card h3{font-family:var(--font-body);font-size:16px;font-weight:600}.detail-card .meta{font-size:13px;color:var(--text-faint);margin-top:4px}.detail-card .actions{display:flex;gap:8px;margin-top:12px}#upload-overlay{position:fixed;inset:0;background:#00000080;z-index:300;display:flex;align-items:center;justify-content:center}#upload-card{max-width:440px;width:90%;padding:24px}#upload-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}#upload-header h3{font-size:20px}#upload-zone{border:2px dashed var(--border);border-radius:var(--radius);padding:32px 16px;text-align:center;cursor:pointer;background:var(--bg-subtle);transition:border-color .15s}#upload-zone:hover,#upload-zone[style*=primary]{border-color:var(--primary)}#upload-zone p:first-child{font-size:15px;font-weight:500;margin-bottom:4px}#upload-zone p:last-child{font-size:12px;color:var(--text-faint)}.upload-file-item{display:flex;justify-content:space-between;align-items:center;padding:6px 8px;background:var(--bg-subtle);border-radius:4px;font-size:13px}.upload-file-item span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.upload-file-item span:last-child{color:var(--text-faint);font-size:11px;flex-shrink:0;margin-left:8px}#upload-caption{margin-top:12px}#upload-submit{margin-top:12px;width:100%}#upload-status{margin-top:8px;text-align:center;font-size:13px;color:var(--text-faint)}.wall-card img,.wall-row img{background:var(--bg-subtle);min-height:80px}.wall-card img.error,.wall-row img.error{background:var(--bg-subtle);display:flex;align-items:center;justify-content:center}.wall-card img.error:after,.wall-row img.error:after{content:"Failed to load";font-size:12px;color:var(--text-faint)}.carousel-image{background:var(--bg-subtle);min-height:50vh;display:flex;align-items:center;justify-content:center}.detail-card img{background:var(--bg-subtle);min-height:200px}.img-loading{animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@media(max-width:768px){.container{padding:0 16px}button,.btn-primary,.btn-secondary,.btn-tertiary,.btn-danger{min-height:44px;min-width:44px}input,textarea,select{min-height:44px}h1{font-size:24px!important}h2{font-size:20px!important}.card{padding:16px}}@media(max-width:480px){body{font-size:14px}.container{padding:0 12px}button,.btn-primary,.btn-secondary,.btn-tertiary,.btn-danger,input,textarea,select{min-height:44px;font-size:16px}}
