:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#080b10;--panel:#10161f;--panel-2:#0c121a;--line:#263141;--line-hi:#39475b;--muted:#8e9caf;--text:#edf2f8;--accent:#3dd6a0;--danger:#ff8091}*{box-sizing:border-box}html,body{background:var(--bg);min-height:100%;color:var(--text);margin:0;font:13px/1.45 Inter,ui-sans-serif,system-ui,-apple-system,sans-serif}button,input,select{font:inherit}button{cursor:pointer;border:0}main{background-image:linear-gradient(90deg,#05070e75 0%,#05070e47 45%,#05070e66 100%),linear-gradient(#080b1014,#080b104d),url(/images/stu-got-hexed-background.webp);background-position:50%;background-repeat:no-repeat;background-size:cover;background-attachment:fixed;min-height:100vh;padding:0 18px 18px}header{-webkit-backdrop-filter:blur(18px)saturate(135%);background:linear-gradient(90deg,#0a0e166b,#0a0e1694);border-bottom:1px solid #ffffff1f;border-radius:0 0 6px 6px;justify-content:space-between;align-items:center;max-width:1720px;height:66px;margin:auto;padding:0 14px;display:flex;box-shadow:inset 0 1px #ffffff0d,0 8px 30px #0000002e}.brand{align-items:baseline;gap:12px;display:flex}.brand-mark{background:var(--accent);clip-path:polygon(25% 7%,75% 7%,100% 50%,75% 93%,25% 93%,0 50%);align-self:center;width:17px;height:17px}h1{letter-spacing:-.025em;margin:0;font-size:20px}.brand>span:last-child{color:var(--muted);border-left:1px solid var(--line);padding-left:12px;font-size:12px}h2{letter-spacing:.12em;text-transform:uppercase;color:#aeb9c8;margin:0;font-size:11px}h3{color:#707f93;letter-spacing:.13em;text-transform:uppercase;margin:24px 0 4px;font-size:10px}.status{color:var(--muted);text-transform:uppercase;letter-spacing:.06em;align-items:center;gap:8px;font-size:11px;display:flex}.status span{background:var(--accent);border-radius:50%;width:7px;height:7px}.status.working span{background:#f5b942;animation:1s infinite pulse}.status.failed span{background:var(--danger)}.workspace{grid-template-columns:292px minmax(500px,1fr) 234px;gap:10px;max-width:1720px;height:calc(100vh - 84px);min-height:650px;margin:18px auto 0;display:grid}aside,.visual{-webkit-backdrop-filter:blur(20px)saturate(135%);background:#0c121bad;border:1px solid #ffffff1c;border-radius:6px;min-width:0;overflow:auto;box-shadow:inset 0 1px #ffffff0a,0 12px 36px #0000003d}.controls-panel{padding:16px}.control-stack section{border-bottom:1px solid var(--line);margin:0 0 17px;padding:0 0 17px}.control-stack section:last-child{border:0;margin:0;padding:0}label{color:var(--muted);margin-top:10px;font-size:11px;display:block}input[type=number],select{width:100%;height:34px;color:var(--text);font-variant-numeric:tabular-nums;background:#090e15;border:1px solid #303c4c;border-radius:4px;outline:none;margin-top:4px;padding:6px 8px}input:focus,select:focus{border-color:var(--accent);box-shadow:0 0 0 1px #3dd6a033}.input-unit{position:relative}.input-unit span{color:#647287;position:absolute;top:12px;right:8px}.input-unit input{padding-right:31px}.field-grid{grid-template-columns:1fr 1fr;gap:8px;display:grid}.check{text-transform:none;color:#bec8d4;align-items:center;gap:7px;margin-top:8px;padding:7px 0;display:flex}.shape-grid{grid-template-columns:repeat(3,1fr);gap:5px;margin-top:11px;display:grid}.shape-grid button{color:#8f9db0;background:#0b1119;border:1px solid #2b3747;border-radius:4px;flex-direction:column;justify-content:center;align-items:center;gap:5px;height:52px;padding:5px 2px;font-size:10px;display:flex}.shape-grid button:hover,.shape-grid button.active{color:var(--text);background:#13231f;border-color:#4f6a68}.shape-grid button.active{box-shadow:inset 0 -2px var(--accent)}.shape-glyph{background:currentColor;width:17px;height:17px;display:block}.sides-3{clip-path:polygon(50% 4%,96% 92%,4% 92%)}.sides-4{clip-path:inset(10% 0)}.sides-5{clip-path:polygon(50% 0,98% 36%,79% 95%,21% 95%,2% 36%)}.sides-6{clip-path:polygon(25% 4%,75% 4%,100% 50%,75% 96%,25% 96%,0 50%)}.sides-7{clip-path:polygon(50% 0,89% 19%,100% 61%,72% 95%,28% 95%,0 61%,11% 19%)}.sides-8{clip-path:polygon(29% 0,71% 0,100% 29%,100% 71%,71% 100%,29% 100%,0 71%,0 29%)}.segmented{background:#090e15;border:1px solid #293646;border-radius:4px;margin-top:9px;padding:2px;display:flex}.segmented button{color:var(--muted);background:0 0;border-radius:2px;flex:1;padding:6px;font-size:11px}.segmented button.active{color:#fff;background:#263344}.strategy-list{gap:5px;margin-top:10px;display:grid}.strategy-list button{text-align:left;color:#aeb9c7;background:#0b1119;border:1px solid #293646;border-radius:4px;padding:8px}.strategy-list button.active{background:#11221e;border-color:#477064}.strategy-list button>span{color:var(--text);justify-content:space-between;font-size:12px;display:flex}.strategy-list i{text-transform:uppercase;letter-spacing:.06em;color:var(--accent);border:1px solid #31594e;border-radius:2px;padding:1px 4px;font-size:8px;font-style:normal}.strategy-list small{color:#718096;margin-top:2px;font-size:9px;line-height:1.35;display:block}.secondary{color:#c9d3df;background:#1a2431;border:1px solid #344256;border-radius:4px;width:100%;margin-top:10px;padding:7px;font-weight:600}.secondary:hover{background:#222e3d}.error{color:#ffb2bc;border-left:2px solid var(--danger);background:#2b171c;padding:9px 10px;font-size:11px}.error strong{color:#ffd5da;margin-bottom:2px;display:block}.visual{-webkit-backdrop-filter:blur(24px)saturate(130%);background:linear-gradient(145deg,#0c121c75,#070b1257);grid-template-rows:1fr auto;display:grid;overflow:hidden;box-shadow:inset 0 1px #ffffff0e,0 12px 36px #00000038}.canvas-wrap{touch-action:none;min-height:0;position:relative;overflow:hidden}.canvas-wrap canvas{cursor:grab;display:block}.canvas-wrap canvas:active{cursor:grabbing}.canvas-empty{text-align:center;color:#607086;place-content:center;display:grid;position:absolute;inset:0}.canvas-empty strong{color:#95a3b4}.canvas-empty span{font-size:11px}.canvas-tools{border:1px solid #34445b;border-radius:4px;display:flex;position:absolute;top:10px;right:10px;overflow:hidden}.canvas-tools button{color:#dce5ef;background:#141d29e8;border-right:1px solid #34445b;min-width:31px;height:29px;font-weight:600}.canvas-tools button:last-child{border:0}.canvas-tools button:hover{background:#243247}.display-controls{-webkit-backdrop-filter:blur(14px);min-height:44px;color:var(--muted);text-transform:capitalize;background:#080d154d;border-top:1px solid #ffffff17;align-items:center;gap:12px;padding:8px 12px;font-size:10px;display:flex}.display-controls>strong{text-transform:uppercase;letter-spacing:.1em;color:#c0cad7;font-size:9px}.display-controls label{align-items:center;gap:4px;margin:0;display:flex}.display-controls input[type=checkbox]{accent-color:var(--accent)}.display-controls .spacer{flex:1}.color input{background:0 0;border:0;width:20px;height:18px;padding:0}.color span{display:none}.results{padding:16px}.panel-heading{justify-content:space-between;align-items:center;margin-bottom:18px;display:flex}.panel-heading>span{color:var(--accent);text-transform:uppercase;letter-spacing:.06em;font-size:9px}.metric{color:var(--muted);border-bottom:1px solid #222c39;justify-content:space-between;align-items:baseline;padding:9px 0;font-size:11px;display:flex}.metric strong{color:#dbe3ed;font-variant-numeric:tabular-nums;font-size:13px}.metric.hero{border-bottom:1px solid var(--line);padding:1px 0 17px;display:block}.metric.hero strong{color:var(--accent);letter-spacing:-.035em;font-size:38px;line-height:1.1;display:block}.alternate-comparison{border-top:1px solid #ffffff14;margin-top:24px;padding-top:14px}.alternate-heading{flex-direction:column;gap:2px;margin-bottom:8px;display:flex}.alternate-heading>span{color:#707f93;letter-spacing:.13em;text-transform:uppercase;font-size:9px}.alternate-heading>strong{color:#dbe4ef;font-size:12px;font-weight:600}.comparison-card{color:#7f8da0;background:linear-gradient(145deg,#1f2b3dd1,#121b28c7);border:1px solid #677ea061;border-radius:5px;padding:11px 12px;box-shadow:inset 0 1px #ffffff0a}.comparison-count{border-bottom:1px solid #ffffff14;justify-content:space-between;align-items:baseline;padding-bottom:9px;font-size:10px;display:flex}.comparison-count>strong{color:#eef3f8;font-variant-numeric:tabular-nums;font-size:16px}.comparison-delta{flex-direction:column;gap:2px;padding-top:9px;display:flex}.comparison-delta>strong{font-variant-numeric:tabular-nums;font-size:11px}.comparison-delta>span{color:#7f8da0;font-size:9px}.comparison-delta.better>strong{color:var(--accent)}.comparison-delta.worse>strong{color:var(--danger)}.comparison-delta.equal>strong{color:#dbe4ef}.muted{color:var(--muted);font-size:11px}@keyframes pulse{50%{opacity:.3}}@media (max-width:1100px){.workspace{grid-template-columns:280px 1fr;height:auto}.results{grid-column:1/-1}.visual{min-height:670px}}@media (max-width:720px){main{background-attachment:scroll;padding:0 10px 10px}.brand>span:last-child{display:none}.workspace{flex-direction:column;margin-top:10px;display:flex}.visual{order:2;min-height:550px}.results{order:3}.display-controls{flex-wrap:wrap}.display-controls .spacer{display:none}.workspace>.controls-panel{order:1}.shape-grid{grid-template-columns:repeat(3,1fr)}}
main{isolation:isolate;position:relative;overflow:clip;background:#05070e!important}main:before,main:after{content:"";pointer-events:none;position:fixed;inset:0}main:before{z-index:0;filter:blur(24px)brightness(.46)saturate(.88);background:url(/images/stu-got-hexed-background.webp) 50%/cover no-repeat;inset:-3%;transform:scale(1.035)}main:after{z-index:1;background-image:linear-gradient(90deg,#05070e47 0%,#05070e1f 48%,#05070e3d 100%),linear-gradient(#05070e0f,#05070e2e),url(/images/stu-got-hexed-background.webp);background-position:50%,50%,55%;background-repeat:no-repeat;background-size:100% 100%,100% 100%,contain}main>*{z-index:2;position:relative}header{-webkit-backdrop-filter:blur(10px)saturate(125%);background:linear-gradient(90deg,#0a0e1661,#0a0e1685)}aside{-webkit-backdrop-filter:blur(14px)saturate(128%);background:#0a101994}.visual{-webkit-backdrop-filter:blur(12px)saturate(122%);background:linear-gradient(145deg,#0a10194d,#060a1133)}.display-controls{-webkit-backdrop-filter:blur(8px)saturate(122%);background:#080d153d}@media (max-width:720px){main{overflow:hidden}main:before{filter:blur(18px)brightness(.42)saturate(.86);inset:-6%}main:after{background-position:50%,50%,62%;background-size:100% 100%,100% 100%,cover}}
