/* BAROOMAN V22 — Campus OS / premium motion system */
:root{
  --v22-bg:#05070a;--v22-panel:rgba(10,14,20,.72);--v22-panel-2:rgba(16,21,29,.72);
  --v22-line:rgba(255,255,255,.085);--v22-text:#f6f8fb;--v22-muted:#94a0af;
  --v22-orange:#ff943f;--v22-blue:#55c6ff;--v22-green:#6ee7b7;--v22-purple:#a78bfa;
  --v22-shadow:0 26px 80px rgba(0,0,0,.32);--v22-radius:26px;
}
html{background:var(--v22-bg);scroll-behavior:smooth}
body{background:
 radial-gradient(circle at calc(var(--mx,50)*1%) calc(var(--my,20)*1%),rgba(85,198,255,.045),transparent 26rem),
 radial-gradient(circle at 12% 18%,rgba(255,148,63,.045),transparent 30rem),
 linear-gradient(180deg,#05070a 0%,#070a0f 48%,#05070a 100%)!important;
 color:var(--v22-text);overflow-x:hidden}
body::before{content:"";position:fixed;inset:0;z-index:-3;pointer-events:none;opacity:.24;background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(to bottom,black,transparent 88%)}
.v22-aurora{position:fixed;inset:0;z-index:-2;pointer-events:none;overflow:hidden}
.v22-aurora i{position:absolute;width:44vw;height:44vw;border-radius:50%;filter:blur(100px);opacity:.08;will-change:transform}.v22-aurora i:first-child{background:var(--v22-blue);left:-15vw;top:10vh;transform:translate3d(calc(var(--mx,50)*.12px),calc(var(--my,50)*.08px),0)}.v22-aurora i:last-child{background:var(--v22-orange);right:-16vw;top:48vh;transform:translate3d(calc(var(--mx,50)*-.10px),calc(var(--my,50)*-.08px),0)}
.v22-code-trail{position:fixed;z-index:5000;pointer-events:none;font:700 10px/1 Inter,monospace;color:rgba(117,211,255,.62);text-shadow:0 0 18px rgba(85,198,255,.45);animation:v22CodeFly .82s cubic-bezier(.2,.8,.2,1) forwards;white-space:nowrap}
@keyframes v22CodeFly{0%{opacity:0;transform:translate3d(-50%,-50%,0) scale(.75)}18%{opacity:.75}100%{opacity:0;transform:translate3d(calc(-50% + var(--dx)),calc(-50% + var(--dy)),0) scale(1.08);filter:blur(2px)}}

/* Global scroll / depth */
.v22-reveal{opacity:0;transform:translate3d(0,32px,0) scale(.985);filter:blur(10px);transition:opacity .75s ease,transform .9s cubic-bezier(.16,1,.3,1),filter .75s ease}.v22-reveal.is-visible{opacity:1;transform:none;filter:none}
.v22-depth{transform:translate3d(0,var(--depth-y,0),0);will-change:transform}
.v22-magnetic{transition:transform .2s ease}
@media(pointer:fine){.v22-tilt{transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(var(--lift,0));transform-style:preserve-3d;transition:transform .18s ease,border-color .2s ease,background .2s ease}}

/* Header — cleaner and product-like */
.net-header{position:sticky!important;top:10px!important;z-index:1200!important;width:min(1440px,calc(100vw - 24px));margin:10px auto 0;border:1px solid rgba(255,255,255,.085)!important;border-radius:22px!important;background:rgba(7,10,14,.72)!important;box-shadow:0 18px 60px rgba(0,0,0,.24);backdrop-filter:blur(24px) saturate(1.25)!important}.net-nav{padding:0 14px;min-height:70px}.net-links{gap:3px!important}.net-links a{font-size:12px!important;color:#98a4b3!important;padding:9px 10px!important}.net-links a:hover,.net-links a.active{color:#fff!important;background:rgba(255,255,255,.055)!important}.net-brand b{font-size:13px}.net-brand small{font-size:9px!important;letter-spacing:.03em}
.v22-command-trigger{display:flex;align-items:center;gap:10px;min-width:250px;max-width:340px;padding:9px 12px;border:1px solid var(--v22-line);border-radius:13px;background:rgba(255,255,255,.025);color:#8793a2;cursor:pointer}.v22-command-trigger b{margin-inline-start:auto;border:1px solid rgba(255,255,255,.09);border-radius:7px;padding:3px 6px;color:#cbd5e1;font-size:9px}
.v22-command-overlay{position:fixed;inset:0;z-index:6000;display:none;place-items:start center;padding-top:min(15vh,140px);background:rgba(2,4,7,.68);backdrop-filter:blur(14px)}.v22-command-overlay.open{display:grid}.v22-command{width:min(720px,calc(100vw - 28px));border:1px solid rgba(255,255,255,.11);border-radius:24px;background:rgba(8,11,16,.96);box-shadow:0 40px 120px rgba(0,0,0,.55);overflow:hidden}.v22-command-head{display:flex;gap:10px;align-items:center;padding:16px;border-bottom:1px solid var(--v22-line)}.v22-command-head input{flex:1;background:transparent;border:0;outline:0;color:#fff;font:600 15px Estedad,Inter,sans-serif}.v22-command-list{padding:10px;display:grid;gap:5px;max-height:420px;overflow:auto}.v22-command-item{display:flex;align-items:center;gap:12px;padding:12px 13px;border-radius:14px;color:#dce4ee}.v22-command-item:hover{background:rgba(255,255,255,.055)}.v22-command-item span:first-child{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:rgba(255,255,255,.05)}.v22-command-item small{display:block;color:#7e8998;font-size:10px;margin-top:2px}.v22-command-foot{padding:10px 15px;border-top:1px solid var(--v22-line);font-size:10px;color:#737f8e}

/* Network shell */
.net-main{width:min(1420px,calc(100vw - 28px))!important;padding-top:30px!important;padding-bottom:90px!important}.dashboard.v22-network-grid{grid-template-columns:235px minmax(0,760px) 300px!important;gap:18px!important;align-items:start}.side.v22-side{position:sticky;top:104px;padding:10px!important;border:1px solid var(--v22-line);border-radius:22px!important;background:rgba(8,11,16,.64)!important}.side.v22-side a{display:flex!important;align-items:center;gap:10px;padding:11px 12px!important;margin:2px 0;color:#9ea9b7!important;font-weight:650;font-size:12px}.side.v22-side a.active,.side.v22-side a:hover{color:#fff!important;background:linear-gradient(90deg,rgba(255,148,63,.08),rgba(85,198,255,.07))!important}.v22-side-profile{padding:14px;margin-bottom:10px;border-radius:17px;background:linear-gradient(135deg,rgba(255,148,63,.065),rgba(85,198,255,.055));border:1px solid var(--v22-line)}.v22-side-profile strong{display:block;font-size:13px}.v22-side-profile small{display:block;color:#83909f;margin-top:4px}.v22-side-profile .v22-class-pill{margin-top:10px}.v22-class-pill{display:inline-flex;align-items:center;gap:6px;padding:6px 9px;border-radius:999px;border:1px solid rgba(85,198,255,.14);background:rgba(85,198,255,.055);color:#b8e9ff;font-size:10px}
.v22-feed-top{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:0 0 12px}.v22-feed-tabs{display:flex;gap:5px;padding:5px;border-radius:14px;background:rgba(255,255,255,.025);border:1px solid var(--v22-line)}.v22-feed-tabs button{border:0;background:transparent;color:#84909e;border-radius:10px;padding:8px 12px;cursor:pointer;font-weight:700;font-size:11px}.v22-feed-tabs button.active{background:#eef4f9;color:#071019}.v22-feed-meta{font-size:10px;color:#7a8695}

/* Composer */
#postComposer.v22-composer-card{padding:0!important;overflow:hidden;border-radius:24px!important;background:linear-gradient(180deg,rgba(15,20,27,.88),rgba(8,11,16,.9))!important}.v22-composer-head{display:flex;align-items:center;gap:11px;padding:16px 17px 10px}.v22-composer-head img{width:42px;height:42px;border-radius:14px;object-fit:cover}.v22-composer-head button{flex:1;text-align:start;border:1px solid var(--v22-line);border-radius:16px;padding:12px 14px;background:rgba(255,255,255,.025);color:#808c9b;cursor:text}.v22-composer-actions{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--v22-line)}.v22-composer-actions button,.v22-composer-actions a{padding:11px;border:0;border-inline-end:1px solid var(--v22-line);background:transparent;color:#9ba7b5;text-align:center;font-size:11px;cursor:pointer}.v22-composer-actions>*:last-child{border-inline-end:0}.v22-composer-actions button:hover,.v22-composer-actions a:hover{background:rgba(255,255,255,.035);color:#fff}.v22-composer-expanded{padding:14px 17px 17px;border-top:1px solid var(--v22-line);display:none}.v22-composer-expanded.open{display:block}.v22-composer-expanded textarea{min-height:120px;resize:vertical}.v22-composer-tools{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:10px}.v22-composer-tools select,.v22-composer-tools input{max-width:180px}.v22-composer-tools .btn{margin-inline-start:auto}

/* Feed card redesign */
.feed-list{display:grid;gap:12px!important}.feed-card{border-radius:24px!important;overflow:hidden;background:linear-gradient(180deg,rgba(14,19,26,.78),rgba(8,11,16,.84))!important;border:1px solid var(--v22-line)!important;box-shadow:0 22px 60px rgba(0,0,0,.2)!important}.feed-card:hover{border-color:rgba(85,198,255,.15)!important}.feed-head{padding:16px 17px 0!important}.feed-content{padding:14px 17px!important;font-size:13px!important;line-height:2!important}.feed-actions{border-top:1px solid var(--v22-line)!important;padding:7px 10px!important}.feed-actions button{border-radius:10px!important;padding:8px 11px!important}.v22-post-context{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}.v22-post-context span{font-size:9px;border:1px solid var(--v22-line);padding:4px 7px;border-radius:999px;color:#7f8b99}.right-col{position:sticky;top:104px;display:grid;gap:12px}.right-widget{border-radius:22px!important}.v22-right-class{padding:17px;border-radius:22px;background:linear-gradient(145deg,rgba(85,198,255,.065),rgba(255,148,63,.04));border:1px solid var(--v22-line)}.v22-right-class h3{margin:0 0 6px}.v22-right-class p{font-size:11px;color:#8995a4;line-height:1.8}.v22-mini-progress{height:6px;background:#0c1016;border-radius:99px;overflow:hidden;margin-top:12px}.v22-mini-progress i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--v22-orange),var(--v22-blue))}

/* Student hub */
.v22-hub-hero{position:relative;overflow:hidden;min-height:310px;padding:34px!important;border-radius:32px!important;background:radial-gradient(circle at 78% 22%,rgba(85,198,255,.11),transparent 26rem),radial-gradient(circle at 18% 90%,rgba(255,148,63,.09),transparent 24rem),rgba(9,13,18,.72)!important}.v22-hub-hero::after{content:'{ build · learn · publish }';position:absolute;inset:auto 26px 18px auto;font:800 clamp(16px,3vw,34px)/1 Inter,monospace;color:rgba(255,255,255,.025);letter-spacing:-.04em}.v22-hub-hero .v22-hub-grid{display:grid;grid-template-columns:1fr 360px;gap:26px;align-items:end}.v22-hub-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.v22-hub-stat{padding:14px;border:1px solid var(--v22-line);border-radius:17px;background:rgba(255,255,255,.028)}.v22-hub-stat strong{font-size:22px;display:block}.v22-hub-stat span{font-size:10px;color:#83909f}.v22-workspace-grid{display:grid;grid-template-columns:1.4fr .9fr;gap:16px}.v22-timeline{display:grid;gap:10px}.v22-timeline-item{display:grid;grid-template-columns:12px 1fr;gap:10px;align-items:start}.v22-timeline-dot{width:10px;height:10px;border-radius:50%;margin-top:6px;background:var(--v22-blue);box-shadow:0 0 0 5px rgba(85,198,255,.055)}

/* Classroom */
.v22-classroom-hero{position:relative;overflow:hidden;padding:32px;border:1px solid var(--v22-line);border-radius:30px;background:linear-gradient(135deg,rgba(85,198,255,.07),rgba(255,148,63,.045),rgba(255,255,255,.018))}.v22-classroom-code{position:absolute;inset:auto -15px 14px auto;font:800 64px/1 Inter,monospace;color:rgba(255,255,255,.028)}.v22-classroom-grid{display:grid;grid-template-columns:1fr 340px;gap:16px;margin-top:16px}.v22-resource-stream{display:grid;gap:10px}.v22-resource-row{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:14px;border:1px solid var(--v22-line);border-radius:18px;background:rgba(255,255,255,.024)}.v22-resource-index{width:40px;height:40px;display:grid;place-items:center;border-radius:12px;background:rgba(255,255,255,.04);font:800 11px Inter}.v22-resource-row small{color:#7c8897}.v22-classmate-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.v22-classmate{display:flex;gap:8px;align-items:center;padding:9px;border-radius:14px;background:rgba(255,255,255,.025);border:1px solid var(--v22-line)}.v22-classmate img{width:34px;height:34px;border-radius:11px;object-fit:cover}

/* Library */
.v22-library-access{display:grid;grid-template-columns:1fr auto;gap:16px;align-items:center;margin:18px 0;padding:16px 18px;border-radius:20px;border:1px solid rgba(85,198,255,.12);background:linear-gradient(90deg,rgba(85,198,255,.055),rgba(255,148,63,.03))}.v22-library-access strong{display:block}.v22-library-access small{display:block;color:#84909e;margin-top:4px}.resource-card{min-height:240px!important;transition:transform .25s ease,border-color .25s ease}.resource-card:hover{transform:translateY(-5px);border-color:rgba(85,198,255,.18)!important}.resource-card::before{content:attr(data-module);position:absolute;inset:12px 12px auto auto;font:800 9px Inter;color:#778392;border:1px solid var(--v22-line);padding:4px 7px;border-radius:999px}.resource-card{position:relative}

/* Publish studio */
.v22-studio-shell{display:grid;grid-template-columns:220px minmax(0,1fr);gap:18px;align-items:start}.v22-studio-nav{position:sticky;top:104px;padding:10px;border:1px solid var(--v22-line);border-radius:22px;background:rgba(8,11,16,.68)}.v22-studio-nav button{width:100%;border:0;background:transparent;color:#8d99a8;text-align:start;padding:11px 12px;border-radius:12px;cursor:pointer}.v22-studio-nav button.active{background:rgba(255,255,255,.055);color:#fff}.v22-studio-panel{display:none}.v22-studio-panel.active{display:grid}.v22-studio-editor{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:16px;align-items:start}.v22-editor-card{padding:22px;border-radius:24px;border:1px solid var(--v22-line);background:rgba(10,14,20,.72)}.v22-editor-card input.v22-title-input{font-size:28px!important;font-weight:800;letter-spacing:-.035em;padding:14px 0!important;background:transparent!important;border:0!important;border-bottom:1px solid var(--v22-line)!important;border-radius:0!important}.v22-editor-card textarea.v22-body{min-height:360px;line-height:2;resize:vertical}.v22-editor-toolbar{display:flex;gap:5px;flex-wrap:wrap;margin:10px 0}.v22-editor-toolbar button{border:1px solid var(--v22-line);background:rgba(255,255,255,.025);color:#9ba7b5;padding:7px 9px;border-radius:9px;cursor:pointer}.v22-live-preview{position:sticky;top:104px;padding:20px;border-radius:24px;border:1px solid var(--v22-line);background:linear-gradient(180deg,rgba(17,22,29,.84),rgba(9,12,17,.9));min-height:420px}.v22-live-preview .preview-cover{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:16px;background:#0c1016}.v22-live-preview h2{font-size:22px;line-height:1.5}.v22-live-preview p{color:#9aa5b3;line-height:1.9}.v22-project-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px}

/* Register */
.v22-class-request{margin-top:12px;padding:14px;border:1px solid rgba(85,198,255,.12);border-radius:16px;background:rgba(85,198,255,.035)}.v22-class-request small{display:block;color:#82909f;line-height:1.7;margin-top:7px}

/* Admin */
.admin-layout-v21{grid-template-columns:270px minmax(0,1fr)!important}.admin-nav-v21{top:104px!important;border-radius:24px!important}.admin-panel-v21{animation:v22PanelIn .35s ease}@keyframes v22PanelIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.v22-admin-class-grid{display:grid;grid-template-columns:380px minmax(0,1fr);gap:16px}.v22-class-card-admin{padding:16px;border:1px solid var(--v22-line);border-radius:18px;background:rgba(255,255,255,.025)}.v22-class-card-admin.active{border-color:rgba(85,198,255,.22);background:rgba(85,198,255,.045)}.v22-access-matrix{display:grid;gap:8px}.v22-access-resource{display:grid;grid-template-columns:auto 1fr 110px 110px;gap:10px;align-items:center;padding:12px;border:1px solid var(--v22-line);border-radius:15px;background:rgba(255,255,255,.02)}.v22-student-access-row{display:grid;grid-template-columns:minmax(170px,1fr) 180px 120px auto;gap:10px;align-items:center;padding:12px;border:1px solid var(--v22-line);border-radius:16px;background:rgba(255,255,255,.022)}

/* Decorative mouse-follow code blocks — safe for the hero */
.v22-floating-code{position:fixed;z-index:-1;pointer-events:none;font:700 11px/1.7 Inter,monospace;color:rgba(151,216,255,.06);white-space:pre;transform:translate3d(calc((var(--mx,50) - 50)*.18px),calc((var(--my,50) - 50)*.12px),0);transition:opacity .3s ease}.v22-floating-code.a{left:3vw;top:24vh}.v22-floating-code.b{right:4vw;top:62vh;color:rgba(255,166,94,.055);transform:translate3d(calc((var(--mx,50) - 50)*-.16px),calc((var(--my,50) - 50)*-.1px),0)}

@media(max-width:1180px){.dashboard.v22-network-grid{grid-template-columns:210px minmax(0,1fr)!important}.dashboard.v22-network-grid>.right-col{display:none}.v22-hub-hero .v22-hub-grid,.v22-workspace-grid,.v22-classroom-grid{grid-template-columns:1fr}.v22-studio-editor{grid-template-columns:1fr}.v22-live-preview{position:static}.v22-admin-class-grid{grid-template-columns:1fr}.v22-command-trigger{display:none}}
@media(max-width:850px){.net-header{top:6px!important}.net-links{display:none!important}.dashboard.v22-network-grid{display:block!important}.side.v22-side{position:static;display:flex;overflow:auto;margin-bottom:12px}.side.v22-side a{white-space:nowrap}.v22-side-profile{display:none}.v22-composer-actions{grid-template-columns:repeat(2,1fr)}.v22-studio-shell{grid-template-columns:1fr}.v22-studio-nav{position:static;display:flex;overflow:auto}.v22-studio-nav button{width:auto;white-space:nowrap}.v22-project-fields{grid-template-columns:1fr}.v22-hub-stats{grid-template-columns:repeat(2,1fr)}.v22-access-resource,.v22-student-access-row{grid-template-columns:1fr}.v22-floating-code{display:none}}
@media(max-width:580px){.net-main{width:min(100vw - 16px,1420px)!important}.net-header{width:calc(100vw - 12px)}.v22-feed-top{align-items:flex-start;flex-direction:column}.v22-feed-tabs{width:100%;overflow:auto}.v22-hub-stats{grid-template-columns:1fr 1fr}.v22-classmate-grid{grid-template-columns:1fr}.v22-composer-tools .btn{margin-inline-start:0;width:100%}.v22-editor-card{padding:16px}.v22-library-access{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.v22-reveal{opacity:1!important;transform:none!important;filter:none!important;transition:none!important}.v22-depth,.v22-tilt,.v22-magnetic{transform:none!important}.v22-code-trail,.v22-aurora,.v22-floating-code{display:none!important}}
/* Scroll-linked decorative parallax — content stays readable; only light layers move. */
.v22-parallax-surface{position:relative;isolation:isolate;overflow:hidden}.v22-parallax-surface::before{content:"";position:absolute;z-index:-1;width:420px;height:420px;border-radius:50%;left:calc(50% - 210px);top:calc(50% - 210px);background:radial-gradient(circle,rgba(85,198,255,.075),rgba(255,148,63,.028) 42%,transparent 70%);filter:blur(14px);transform:translate3d(calc((var(--mx,50) - 50)*.7px),var(--v22-parallax,0px),0) scale(1.05);pointer-events:none;will-change:transform}
.v22-parallax-surface:nth-of-type(even)::before{background:radial-gradient(circle,rgba(255,148,63,.065),rgba(85,198,255,.025) 44%,transparent 72%)}
