/* DK9's public-site visual language, kept local and without third-party requests. */
:root{color-scheme:dark;--blue:#24b7ff;--navy:#080e17;--muted:#9bb2c7;--line:#20394e;--radius:6px;color:#ecf4fa;background:#080e17;font-family:'Segoe UI',Arial,sans-serif}
body{background:radial-gradient(ellipse at 85% 5%,#12314c66,transparent 55%),#080e17;color:#ecf4fa}
h1,h2,h3,.brand strong,.quick strong{font-family:'Arial Narrow','Bahnschrift Condensed','Segoe UI',sans-serif}h1{font-weight:800;letter-spacing:-1.4px}h2{font-size:24px;letter-spacing:-.6px}.eyebrow{color:#50c5ff;letter-spacing:2.5px}
.sidebar{background:linear-gradient(180deg,#080e17,#091725);border-right:1px solid var(--line);padding-top:34px}.sidebar .brand{margin-bottom:48px}.sidebar .brand-logo{width:56px;height:74px}.brand small{color:#89a7bd}.sidebar>.eyebrow{font-size:9px;margin:0 15px 12px}.nav-link{border-radius:4px;color:#9ab0c3;margin:7px 0}.nav-link:hover{color:#e8f5ff;background:#102537}.nav-link.active{background:linear-gradient(90deg,#103a57,#102335);color:#65cbff;box-shadow:inset 3px 0 #24b7ff}.sidebar-note{border-color:var(--line);color:#819bb1}.sidebar-note b{color:#d2e7f6}
.topbar{background:#080f19e8;border-color:var(--line);height:80px}.breadcrumb{letter-spacing:.3px}.breadcrumb strong{color:#d5e9f7}.avatar{background:#15354d;color:#8dd9ff;border:1px solid #2c526c;border-radius:8px}.icon-btn{color:#a3c3d9}.icon-btn:hover{background:#163248}.content{max-width:1440px;padding-top:24px}.demo-banner{background:#0b1826;border:1px dashed #2b4a62;color:#9ab5ca;border-radius:4px;margin-bottom:20px}.demo-banner select{background:#102438;color:#dceefa;border-color:#2d4d65}.text-link{color:#5cc6ff}.text-link:hover{color:#c5eeff}
.hero{min-height:330px;padding:45px 38px;border:1px solid #31536d;border-radius:6px;background:linear-gradient(90deg,#06101bf5 0%,#06101bba 43%,#06101b18 100%),linear-gradient(0deg,#06101bda,transparent 70%),url('assets/hero.webp') center 48%/cover;box-shadow:0 20px 60px #0003}.hero:before{content:'';position:absolute;top:0;left:30px;width:80px;height:2px;background:#38bdff;box-shadow:0 0 24px #24b7ff}.hero:after{content:'DK9 / MEDLEMSPORTAL';position:absolute;right:25px;bottom:22px;color:#a0bed1;font-size:9px;letter-spacing:3px}.landscape{display:none}.hero .welcome{gap:22px}.hero .avatar.large{background:#102a3dbd;color:#7dd4ff;border:1px solid #4c7999;width:68px;height:78px;border-radius:5px;box-shadow:none}.hero h1{font-size:clamp(38px,4.5vw,64px);margin:7px 0 15px}.hero p{margin-top:16px;color:#b4cbdd;font-size:15px;line-height:1.7}.hero .eyebrow{color:#58c6ff}.hero .role{background:#12344bd9;color:#9adeff;border:1px solid #32627e;border-radius:3px;font-size:10px;letter-spacing:1px}.hero-bottom{color:#8caec4;margin-top:26px}.quick-grid{gap:14px;margin-top:18px}.quick{background:linear-gradient(125deg,#102438,#0c1928);border-color:#254258;border-radius:5px;color:#e1f0fa;padding:21px;position:relative;transition:transform .18s,border-color .18s}.quick:after{content:'↗';margin-left:auto;color:#6088a6;font-size:18px}.quick:hover{background:#14314a;border-color:#41b6f5;transform:translateY(-3px)}.quick .symbol{background:#12344b;color:#4bc2ff;border:1px solid #27546f;border-radius:5px}.quick strong{font-size:16px;letter-spacing:.3px}.quick small{color:#8eaac0}
.panel{background:linear-gradient(130deg,#0e1d2d,#0a1522);border-color:var(--line);border-radius:6px;position:relative;padding:25px}.panel:before{content:'';position:absolute;top:-1px;left:24px;width:29px;height:2px;background:#35b6f4}.panel-head h2{color:#e5f2fa}.panel-head h2>.icon{color:#50bffd}.folder{background:linear-gradient(135deg,#122c42,#0e2032);border-color:#28485f;border-radius:5px;color:#dcedf8;min-height:146px}.folder:hover{background:#193c55;border-color:#44b5ed}.folder .icon{color:#53c4ff;fill:#163e59}.folder small{color:#90aec3}.panel-foot{color:#8ca6bb}.invite-card{background:linear-gradient(125deg,#12354f,#0b1d30);border-color:#285574}.invite-card h2{font-size:29px;max-width:240px}.invite-card p{color:#a6c0d3;line-height:1.75}.invite-card .panel-head>.icon{width:30px;height:30px;color:#6bceff}.btn{background:linear-gradient(110deg,#098fdd,#1760c9);border:1px solid #44baff;border-radius:4px;box-shadow:inset 0 1px #a5deff30;color:#fff;font-size:13px;min-height:47px}.btn:hover{background:linear-gradient(110deg,#24afff,#267be7)}.btn.secondary{background:#142c40;border-color:#35566e;color:#c3e4f7}.btn.secondary:hover{background:#1d405a}.btn.warn{background:#332b1c;color:#f6d28d;border-color:#74603c}.pill,.role{background:#183348;color:#acd9f3;border-radius:4px}.pill.amber{background:#352d1c;color:#e8c585}.service,.activity,.member-row,.file-row{border-color:#20384b}.service small,.activity small{color:#90a8bb}.service .service-icon,.activity .avatar{background:#142c40;color:#77bbdf;border-radius:5px}.dot{background:#7490a4}.notice,.info-box{background:#102a3e;color:#afcbdf;border:1px solid #294b64;border-radius:5px}.notice h3{color:#d4eafa}.steps li{color:#abc3d6}.steps li:before{background:#183b56;color:#7ad4ff}.folder-fields{border-color:#2d4a60;border-radius:5px}.folder-fields legend{color:#a2bdd1}
input,select{background:#091726;color:#e2f2fc;border-color:#34526a;border-radius:4px}label{color:#b9d2e4}label small{color:#94acbf}.role-choice{background:#102436;border-color:#31516a;border-radius:5px}.role-choice:has(input:checked){background:#15405c;border-color:#43bfff;color:#b8e9ff}.link-output{background:#071522;border-color:#315672;color:#a3ddff;border-radius:4px}.error{background:#342c1c;color:#f4d498;border:1px solid #73603b}.inline-note{color:#8ba8bd}dialog{background:#0d1d2d;color:#e1f1fc;border-color:#3b637f;border-radius:7px;box-shadow:0 30px 100px #0009}dialog p{color:#b0cadc}dialog::backdrop{background:#020811bd;backdrop-filter:blur(7px)}.page-heading p{color:#a1b9cb}.bottomnav{background:#081522f5;border-top-color:#32516b}.bottomnav button.active{background:#153b55;color:#75d2ff;border-radius:4px}.auth-layout{background:#080e17}.auth-brand{background:linear-gradient(90deg,#06101bef,#06101b88),url('assets/hero.webp') 58% center/cover;min-height:100vh}.auth-brand h1{font-size:clamp(38px,4vw,64px)}.auth-panel{color:#e5f2fa}.auth-panel h1{font-size:36px}.auth-panel>p{color:#9db8cb}
@media(min-width:1500px){.hero{min-height:370px;padding:50px}.content{padding-top:30px}}
@media(max-width:1100px){.quick{padding:16px;gap:10px}.quick:after{display:none}.hero{min-height:315px}.hero:after{font-size:8px;letter-spacing:2px}}
@media(max-width:760px){body{background:#080e17}.topbar{background:#080f19;border-bottom:1px solid #243b4e;height:80px}.content{padding:16px 16px 110px}.demo-banner{margin-bottom:15px;font-size:10px}.hero{padding:30px 23px;min-height:325px;border-radius:5px;background-position:60% center}.hero .welcome{display:block}.hero .avatar.large{display:none}.hero h1{font-size:46px;letter-spacing:-1.8px}.hero p{font-size:13px;max-width:230px}.hero .eyebrow{font-size:9px}.hero-bottom{margin-top:24px;font-size:10px}.hero:after{bottom:15px;right:18px;font-size:7px}.quick-grid{gap:8px;margin-top:12px}.quick{padding:14px 4px;min-height:91px;border-radius:4px;gap:9px}.quick .symbol{width:33px;height:33px;border:0;background:transparent}.quick strong{font-size:11px}.panel{padding:22px 17px;border-radius:5px}.panel-head h2{font-size:21px}.folder{padding:16px 10px;min-height:126px;border-radius:4px}.folder strong{font-size:12px}.folder small{font-size:10px}.invite-card{padding:25px}.invite-card h2{font-size:29px}.auth-brand{min-height:290px;padding:32px 25px;background-position:center}.auth-brand h1{font-size:37px;max-width:300px}.auth-panel{padding:32px 25px}.auth-panel h1{font-size:29px}.member-row .role{font-size:9px}.bottomnav button{min-width:0;flex:1;padding:6px 8px}.panel-head{gap:8px}}
@media(prefers-reduced-motion:reduce){.quick{transition:none}.quick:hover{transform:none}}

/* Illuminated, tactile controls — no continuous animation. */
.quick{border-radius:13px;background:linear-gradient(155deg,#23465f 0%,#122c43 38%,#091624 100%);border:1px solid #3c6886;border-bottom-color:#102334;box-shadow:inset 0 1px 0 #b4e8ff45,inset 0 -3px 0 #030b15,0 5px 0 #040c16,0 10px 22px #0006;transition:transform .18s,box-shadow .18s,border-color .18s;overflow:hidden}
.quick:before{content:'';position:absolute;top:0;left:16%;right:16%;height:1px;background:linear-gradient(90deg,transparent,#9eeaff,transparent);box-shadow:0 0 12px #2abaff;pointer-events:none}
.quick .symbol{position:relative;width:49px;height:49px;border-radius:13px;background:radial-gradient(ellipse at 30% 0,#83ddff65,transparent 65%),linear-gradient(145deg,#20709d,#123d64 55%,#071d36);border:1px solid #4c9ac3;box-shadow:inset 1px 1px 0 #bbebff65,inset -1px -2px 0 #06162c,0 4px 0 #061426,0 6px 15px #0008,0 0 20px #12a9ff20;color:#b0efff;transform:perspective(180px) rotateX(8deg);flex-shrink:0}
.quick .icon{width:27px;height:27px;stroke-width:1.8;filter:drop-shadow(0 2px 0 #07527b) drop-shadow(0 0 5px #43c9ff80)}
.quick strong{text-shadow:0 2px 2px #0008}.quick small{color:#a0bdd1}.quick:hover{background:linear-gradient(155deg,#2b5674,#15354e 45%,#0c2033);border-color:#65c9ff;box-shadow:inset 0 1px #d2f3ff55,inset 0 -3px #06111e,0 7px 0 #040c16,0 12px 28px #0007,0 0 24px #14aaff20}
.folder{position:relative;overflow:hidden;border-radius:12px;background:radial-gradient(ellipse at 15% 0,#2b6c9140,transparent 70%),linear-gradient(145deg,#193a51,#0d2135);border-color:#355d79;box-shadow:inset 0 1px #a6ddff24,inset 0 -2px #071421,0 5px 12px #0003;transition:transform .18s,box-shadow .18s,border-color .18s}
.folder .icon{width:43px;height:43px;stroke:#98e5ff;fill:#2386b6;stroke-width:1.2;transform:perspective(120px) rotateY(-16deg) rotateX(8deg);filter:drop-shadow(2px 3px 0 #063957) drop-shadow(0 6px 6px #0008) drop-shadow(0 0 9px #27b7ff50)}
.folder:hover{transform:translateY(-2px);box-shadow:inset 0 1px #c6eeff44,0 8px 18px #0005,0 0 18px #1baeff18}.btn{border-radius:9px;background:linear-gradient(170deg,#39bdff 0%,#0885d7 42%,#1651ac 100%);border:1px solid #68ccff;border-bottom-color:#143b76;box-shadow:inset 0 1px #d5f5ff85,inset 0 -2px #082a6d80,0 4px 0 #071c39,0 8px 20px #007ed32b;text-shadow:0 1px 2px #003a75;transition:transform .15s,box-shadow .15s,filter .15s}.btn:not(:disabled):hover{filter:brightness(1.12);box-shadow:inset 0 1px #e6faff99,0 4px 0 #071c39,0 0 25px #22acff45}.btn.secondary{background:linear-gradient(155deg,#294b64,#142c40);box-shadow:inset 0 1px #aad8f533,0 3px 0 #071522,0 5px 12px #0003;text-shadow:none}.btn.warn{background:linear-gradient(155deg,#493d25,#2b2418);border-color:#8a7547;box-shadow:inset 0 1px #e8d39b33,0 3px 0 #19140b;text-shadow:none}
.nav-link.active{border-radius:8px;background:linear-gradient(110deg,#164566,#102b42);box-shadow:inset 3px 0 #59d1ff,inset 0 1px #79ccff20,0 0 20px #008cff0d}.nav-link.active .icon,.bottomnav button.active .icon{color:#9ce7ff;filter:drop-shadow(0 0 6px #24b7ff)}
.bottomnav{box-shadow:0 -10px 30px #0005,inset 0 1px #75cdff20}.bottomnav button.active{border-radius:9px;background:linear-gradient(155deg,#235674,#11324d);box-shadow:inset 0 1px #8de0ff55,inset 0 -2px #061628,0 3px 7px #0005}.panel{border-radius:10px;box-shadow:inset 0 1px #a6d9ff0c,0 10px 24px #0002}.panel:before{box-shadow:0 0 12px #24b7ff80}.hero{box-shadow:inset 0 1px #bbeaff30,0 18px 45px #0005,0 0 30px #159bff0b;border-radius:10px}.service .service-icon{background:linear-gradient(145deg,#214762,#10263a);border:1px solid #315a76;box-shadow:inset 0 1px #b1dfff25,0 3px 6px #0004;border-radius:8px}.quick:not(:disabled):active,.folder:not(:disabled):active,.btn:not(:disabled):active{transform:translateY(3px);box-shadow:inset 0 2px 5px #0005,0 1px 0 #040e1b;filter:brightness(1.08)}.btn:disabled{box-shadow:none;filter:saturate(.35)}
@media(max-width:760px){.quick{padding:16px 4px 13px;min-height:112px;border-radius:11px;gap:12px}.quick .symbol{width:43px;height:43px;border:1px solid #4c9ac3;border-radius:11px}.quick .icon{width:25px;height:25px}.quick-grid{margin-bottom:7px;gap:9px}.folder{border-radius:10px;min-height:137px}.folder .icon{width:36px;height:36px;margin-bottom:17px}.panel{border-radius:10px}.hero{border-radius:10px}}
@media(prefers-reduced-motion:reduce){.quick,.folder,.btn{transition:none}.quick:hover,.folder:hover,.quick:not(:disabled):active,.folder:not(:disabled):active,.btn:not(:disabled):active{transform:none}}
/* Sculpted shortcut artwork and illuminated glass cards. */
.quick-grid{gap:18px;margin-top:24px}.quick{min-height:225px;flex-direction:column;align-items:flex-start;padding:20px 23px 24px;background:radial-gradient(ellipse at 50% 24%,#2272a14a,transparent 67%),linear-gradient(145deg,#193448c9,#091728ed 70%);border:1px solid #3c6484;border-radius:20px;box-shadow:inset 0 1px #c8f3ff44,inset 0 -1px #5ccfff20,0 12px 30px #0006,0 0 20px #168fff0b;backdrop-filter:blur(18px);gap:0}.quick .symbol{width:150px;height:150px;margin:-18px auto -3px;background:transparent!important;border:0!important;box-shadow:none!important;transform:none!important;border-radius:0;background-position:center!important;background-repeat:no-repeat!important;background-size:contain!important}.quick-files .symbol{background-image:url('assets/sculpt-folder.svg')!important}.quick-members .symbol{background-image:url('assets/sculpt-users.svg')!important}.quick-invite .symbol{background-image:url('assets/sculpt-invite.svg')!important}.quick-operations .symbol{background-image:url('assets/sculpt-windows.svg')!important}.quick .symbol>.icon{visibility:hidden}.quick strong{font-size:21px;letter-spacing:-.4px}.quick small{display:block;font-size:11px;margin-top:7px;color:#9ebbd1}.quick:after{display:block;position:absolute;bottom:26px;right:20px;color:#80d8ff;font-size:24px}.quick:before{top:0;left:22%;right:22%;height:2px;box-shadow:0 0 15px #3bd4ff,0 0 35px #21aaff}.quick:hover{background:radial-gradient(ellipse at 50% 24%,#359dd66b,transparent 68%),linear-gradient(145deg,#204760,#0b2035);box-shadow:inset 0 1px #d5f7ff88,0 15px 34px #0007,0 0 26px #1cafff30}.quick:hover .symbol{filter:brightness(1.15)}.hero{border-radius:20px}.hero h1{text-shadow:0 3px 25px #0008}.panel{border-radius:17px;background:radial-gradient(ellipse at 0 0,#18436640,transparent 65%),#0b1827;border-color:#29485f}.panel:before{left:28px;width:50px}.folder{border-radius:13px;background:linear-gradient(145deg,#1c3b53,#102437);box-shadow:inset 0 1px #8fdbff36,0 5px 18px #0004}.folder>.icon{background:url('assets/sculpt-folder.svg') center/contain no-repeat;width:65px;height:65px;stroke:transparent;fill:transparent;filter:none;transform:none;margin:-8px 0 6px}.btn{min-height:50px;border-radius:12px;box-shadow:inset 0 1px #dcf8ff99,inset 0 -2px #082a6d80,0 4px 0 #071c39,0 0 24px #149fff40}.bottomnav button.active{box-shadow:inset 0 1px #9ce9ff66,0 0 16px #149fff30}.invite-card{background:radial-gradient(ellipse at 100% 0,#1875a265,transparent 70%),linear-gradient(135deg,#102f48,#0b1a2d)}
@media(max-width:760px){.hero{min-height:255px;padding:24px 22px}.hero h1{font-size:39px}.hero p{margin-top:12px}.hero-bottom{margin-top:18px}.hero:after{font-size:6px;bottom:12px}.quick-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:19px}.quick{min-height:200px;padding:10px 17px 20px;border-radius:18px;align-items:flex-start;gap:0}.quick .symbol{width:140px;height:140px;max-width:120%;margin:-8px auto -1px;align-self:center;flex-shrink:0}.quick strong{font-size:18px}.quick small{font-size:9px;line-height:1.5;max-width:105px;margin-top:5px}.quick:after{right:13px;bottom:23px;font-size:20px}.folder{padding:13px 10px;min-height:135px}.folder>.icon{width:62px;height:62px}.panel{border-radius:16px}.hero .role{font-size:9px}.demo-banner{padding:6px 9px}.demo-banner select{min-height:34px}}
.storage-meter{margin:18px 0;color:#a8cce1;font-size:12px}.storage-meter progress{display:block;width:100%;height:8px;margin-top:8px;accent-color:#41c6ff}dialog input+.btn,dialog select+.btn{margin:12px 0 22px}.filters{margin-top:20px}.file-row strong{display:block}.file-row .icon-btn{flex-shrink:0}@media(max-width:450px){.file-row{gap:7px}.file-row .btn{font-size:11px;padding:9px}.file-row>.icon{display:none}}
.enrollment-qr{display:block;max-width:100%;height:auto;margin:22px auto;background:white;border:10px solid white;border-radius:12px}.user-top a.avatar{text-decoration:none}.auth-panel .check{align-items:flex-start}
