:root{color-scheme:light;--bg: #dbd2c4;--surface: #fbf8f2;--inset: #f2ede4;--border: #e7e1d6;--text: #2b2926;--text-muted: #76706a;--orange: #e0612a;--orange-rgb: 224, 97, 42;--amber: #d97706;--amber-rgb: 217, 119, 6;--yellow: #ca8a04;--teal: #2f8f83;--teal-rgb: 47, 143, 131;--danger: #c8372d;--flash-bg: #fbe9df;--success-bg: #e2f1ee;--radius: 6px;--radius-sm: 4px;--banner-strip: 64px;--banner-logo: 40px;--shadow: 0 1px 3px rgba(60, 40, 20, .1), 0 6px 18px rgba(60, 40, 20, .1);--shadow-hover: 0 2px 6px rgba(60, 40, 20, .12), 0 12px 28px rgba(60, 40, 20, .14)}*,*:before,*:after{box-sizing:border-box}body{margin:0;background-color:var(--bg);background-image:repeating-linear-gradient(60deg,rgba(60,40,20,.05) 0 1px,transparent 1px 6px),repeating-linear-gradient(-60deg,rgba(60,40,20,.05) 0 1px,transparent 1px 6px);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.5}body.popup-open{overflow:hidden}a{color:inherit;text-decoration:none}app-root{display:flex;flex-direction:column;min-height:100vh}.form{display:grid;gap:16px;max-width:640px;padding:24px;border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow)}.form .field{display:flex;flex-direction:column;gap:6px}.form .row{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}.form label{font-size:13px;font-weight:700;color:var(--text-muted)}.form .optional{font-weight:400}.form input,.form select,.form textarea{width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--inset);color:var(--text);font:inherit}.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--orange)}.form input.ng-invalid.ng-touched,.form select.ng-invalid.ng-touched{border-color:var(--danger)}.form .error{color:var(--danger);font-size:13px}.form .server-errors{padding:12px 16px;border:1px solid var(--danger);border-radius:var(--radius-sm);color:var(--danger)}.form .server-errors p{margin:0}.form .actions{display:flex;justify-content:flex-end;gap:12px}.primary,.secondary{padding:10px 20px;border-radius:var(--radius-sm);font:inherit;font-weight:700}.primary{border:none;background:linear-gradient(90deg,var(--orange),var(--amber));color:#fff;cursor:pointer}.primary:disabled{opacity:.6;cursor:not-allowed}.secondary{border:1px solid var(--border);background:none;color:var(--text-muted);cursor:pointer}.game-list{display:grid;gap:16px;align-content:start}.browse.split{display:grid;grid-template-columns:minmax(280px,2fr) minmax(0,3fr);gap:20px;align-items:start}.panel{position:sticky;top:16px;max-height:calc(100vh - 32px);overflow-y:auto}.pill{padding:1px 10px;border:1px solid transparent;border-radius:var(--radius-sm);font-size:10px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;white-space:nowrap}.pill.joined{border-color:rgba(var(--teal-rgb),.4);background:rgba(var(--teal-rgb),.15);color:var(--teal)}.pill.created{background:linear-gradient(90deg,var(--orange),var(--amber));color:#fff}.pill.waitlisted{border-color:rgba(var(--orange-rgb),.4);color:var(--orange)}.pill.plain{border-color:var(--border);color:var(--text-muted)}.picture-item{display:flex;gap:14px;align-items:flex-start;padding:12px 0;border-top:1px solid var(--border)}.picture-item.banner-item{flex-direction:column}.logo-preview{display:grid;flex-shrink:0;place-items:center;width:64px;height:64px;overflow:hidden;border:1px solid var(--border);border-radius:50%;background:var(--inset);color:var(--text-muted);font-size:24px;font-weight:800;text-transform:uppercase}.banner-preview{display:grid;place-items:center;width:100%;aspect-ratio:3;overflow:hidden;border:1px dashed var(--border);border-radius:var(--radius-sm);background:var(--inset);color:var(--text-muted);font-size:13px}.logo-preview img,.banner-preview img{width:100%;height:100%;object-fit:cover}.picture-text{display:flex;flex-direction:column;gap:2px}.picture-text small{color:var(--text-muted)}.picture-buttons{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}.file-button{padding:8px 14px;font-size:14px;cursor:pointer}.file-button input{display:none}.remove-picture{padding:8px 12px;border:none;background:none;color:var(--text-muted);font:inherit;font-size:14px;text-decoration:underline;cursor:pointer}.remove-picture:hover{color:var(--danger)}
