:root{--ink:#17211b;--muted:#657268;--cream:#f5f3ea;--paper:#fffef9;--green:#1e6b43;--lime:#dff272;--line:#dfe4dc;--shadow:0 14px 40px rgba(23,33,27,.09)}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font:16px/1.5 system-ui,-apple-system,"Segoe UI",sans-serif}.topbar{height:72px;background:#143e2b;color:white;display:flex;align-items:center;justify-content:space-between;padding:0 max(24px,calc((100% - 1120px)/2));box-shadow:0 2px 12px #0002}.brand{color:white;text-decoration:none;font-size:19px;font-weight:800;letter-spacing:-.02em}.brand span{margin-right:8px}.topbar nav{display:flex;align-items:center;gap:18px}.topbar nav a,.link-button{color:white;background:none;border:0;font:inherit;text-decoration:none;cursor:pointer}.topbar form{margin:0}.username{color:#cae1d2;font-size:14px}.container{max-width:1120px;margin:0 auto;padding:56px 24px;min-height:calc(100vh - 132px)}h1{font-size:clamp(32px,5vw,52px);line-height:1.06;letter-spacing:-.04em;margin:6px 0 12px}h2{font-size:21px;margin:38px 0 16px}.eyebrow{text-transform:uppercase;letter-spacing:.14em;font-size:12px;font-weight:800;color:var(--green);margin:0}.muted{color:var(--muted);margin:0}.page-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:36px}.actions{display:flex;gap:10px;flex-wrap:wrap}.button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 18px;border:1px solid transparent;border-radius:10px;font-weight:750;text-decoration:none;cursor:pointer;font-size:15px}.primary{background:var(--green);color:white}.primary:hover{background:#145334}.secondary{border-color:var(--green);color:var(--green);background:transparent}.download{background:var(--lime);color:#26330e}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.grid.compact{margin-bottom:32px}.folder-card{min-height:160px;background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:22px;display:flex;flex-direction:column;color:var(--ink);text-decoration:none;box-shadow:0 3px 12px #17211b0a;transition:.18s}.folder-card:hover{transform:translateY(-2px);box-shadow:var(--shadow);border-color:#bdd0c2}.folder-icon{font-size:31px;margin-bottom:25px}.folder-card strong{font-size:18px}.folder-card span:last-child{color:var(--green);font-size:13px;margin-top:5px}.file-list{display:flex;flex-direction:column;gap:10px}.file-row{background:var(--paper);border:1px solid var(--line);border-radius:13px;padding:14px 16px;display:flex;align-items:center;justify-content:space-between;gap:18px}.file-meta{display:flex;align-items:center;gap:13px;min-width:0}.file-meta strong{display:block;overflow-wrap:anywhere}.file-meta small{display:block;color:var(--muted)}.file-icon{font-size:26px}.empty{grid-column:1/-1;text-align:center;padding:64px 20px;background:#fff8;border:1px dashed #bec8c0;border-radius:16px;color:var(--muted)}.empty>span{font-size:40px}.empty h2{color:var(--ink);margin:12px 0 4px}.empty.small{padding:32px}.back{color:var(--green);text-decoration:none;font-weight:700;display:inline-block;margin-bottom:28px}.login-card,.form-card{max-width:520px;margin:5vh auto;background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:38px;box-shadow:var(--shadow)}.ball{font-size:36px;margin-bottom:20px}.stack{display:flex;flex-direction:column;gap:9px;margin-top:26px}.stack label{font-size:14px;font-weight:750}.stack input{width:100%;border:1px solid #bdc7bf;border-radius:10px;padding:12px;font:inherit;margin-bottom:10px;background:white}.stack .button{margin-top:8px}.error,.errorlist{color:#9d241d;background:#fff0ee;padding:10px 12px;border-radius:8px;list-style:none}.message{padding:13px 16px;border-radius:10px;background:#dff4e5;color:#18572f;margin-bottom:24px}footer{text-align:center;color:var(--muted);font-size:13px;padding:20px} @media(max-width:760px){.grid{grid-template-columns:1fr}.page-head{align-items:stretch;flex-direction:column}.actions{width:100%}.actions .button{flex:1}.username{display:none}.container{padding:36px 16px}.topbar{padding:0 16px}.login-card,.form-card{padding:26px 20px}.file-row{align-items:flex-start}.download{flex-shrink:0}}
.dropzone { display: grid; gap: .45rem; padding: 2.2rem 1rem; border: 2px dashed #9ca3af; border-radius: 14px; text-align: center; cursor: pointer; }
.dropzone span, .dropzone small { color: #6b7280; }
.dropzone.is-dragging { border-color: #2563eb; background: #eff6ff; }
#id_files { position: absolute; width: 1px; height: 1px; opacity: 0; }
.file-view[hidden] { display: none !important; }
.compact-thumbnails { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 10px; }
.compact-thumbnails .photo-card { padding: 6px; border-radius: 10px; }
.compact-thumbnails .photo-card img { aspect-ratio: 1; object-fit: cover; }
.large-tiles { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 18px; }
.files-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.view-toggle { display: flex; gap: .35rem; }
.view-toggle button { border: 1px solid #d1d5db; border-radius: 8px; background: white; padding: .45rem .7rem; cursor: pointer; }
.view-toggle button.active { background: #2563eb; color: white; border-color: #2563eb; }
.fencing-stripe { position: fixed; inset: 0 0 auto; height: 4px; z-index: 10; background: linear-gradient(90deg, #d6ad60 0 22%, #152238 22% 70%, #8fc4bd 70%); }
.fencing-stripe span { position: absolute; top: 4px; width: 42vw; height: 1px; background: rgba(214,173,96,.45); transform: rotate(-7deg); transform-origin: left; }
.fencing-stripe span:last-child { right: 0; transform: rotate(7deg); transform-origin: right; background: rgba(143,196,189,.45); }
.brand { letter-spacing: .04em; }
.brand span, .ball { color: #d6ad60; }
.files-heading { border-bottom: 1px solid rgba(214,173,96,.3); }
body { background: #071426 url("/static/storage/fencers-realistic.png") center / cover fixed no-repeat; color: #fff; text-shadow: 0 1px 3px rgba(0,0,0,.75); font-family: "Arial Narrow", "Helvetica Neue", Arial, sans-serif; text-transform: uppercase; letter-spacing: .035em; }
.container h1, .container h2, .muted, .eyebrow, .back { color: #fff; text-shadow: 0 2px 6px rgba(0,0,0,.9); }
.form-card, .login-card, .folder-card, .file-row, .photo-card { color: #fff; text-shadow: 0 1px 3px rgba(0,0,0,.85); }
.form-card .muted, .login-card .muted { color: #fff; text-shadow: 0 1px 3px rgba(0,0,0,.85); }
.folder-card, .file-row, .photo-card, .form-card, .login-card { background: rgba(8, 20, 35, .82); border-color: rgba(255,255,255,.3); }
.folder-card strong, .file-meta strong, .file-meta small, .photo-card strong, .photo-card small { color: #fff; }
.folder-card span:last-child { color: #fff; }
.primary, .secondary, .download, .button { color: #fff; text-transform: uppercase; }
.primary { background: #198754; }
.secondary { border-color: #fff; }
.stack input, .stack select, .stack textarea { text-transform: none; }
.container { position: relative; z-index: 1; }
.container::before { content: ""; position: fixed; inset: 0; z-index: -1; background: rgba(7,20,38,.70); pointer-events: none; }
.form-card, .login-card, .folder-card, .file-row, .photo-card { backdrop-filter: blur(8px); }