@font-face{
  font-family:'DingTalk JinBuTi';
  src:url('./dingtalk-jinbuti.woff2') format('woff2');
  font-weight:100 900;
  font-style:normal;
  font-display:swap;
}

:root{
  --font-ui:'DingTalk JinBuTi','PingFang SC','Microsoft YaHei',sans-serif;
  --font-mono:'DingTalk JinBuTi','JetBrains Mono','SFMono-Regular',Consolas,monospace;
}

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}

html{scroll-snap-type:y proximity;overflow-y:scroll;scroll-behavior:smooth}
html.iodev-font-pending-cc body{opacity:0;visibility:hidden}
html.iodev-font-ready-cc body{opacity:1;visibility:visible;transition:opacity .22s ease}

body{
  font-family:var(--font-ui);
  background:#060608;
  color:#e4e4e8;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

button,input,textarea,select{font:inherit}

.iodev-page-cc{min-height:100vh;min-height:100svh;scroll-snap-align:start;position:relative;overflow:hidden}
.iodev-p1-cc{display:flex;align-items:center;justify-content:center;padding:clamp(32px,5vw,72px) 0}

.iodev-p1-cc .iodev-ambient-cc{position:absolute;inset:0;pointer-events:none;z-index:0}
.iodev-p1-cc .iodev-ambient-cc::before{content:'';position:absolute;width:clamp(560px,58vw,800px);height:clamp(560px,58vw,800px);border-radius:50%;top:clamp(-220px,-12vw,-120px);left:50%;transform:translateX(-50%);background:radial-gradient(circle,rgba(139,92,246,0.09) 0%,transparent 65%);animation:breathe 8s ease-in-out infinite}
.iodev-p1-cc .iodev-ambient-cc::after{content:'';position:absolute;width:clamp(320px,32vw,500px);height:clamp(320px,32vw,500px);border-radius:50%;bottom:clamp(-140px,-7vw,-60px);right:clamp(-140px,-7vw,-60px);background:radial-gradient(circle,rgba(6,214,160,0.05) 0%,transparent 60%);animation:breathe 10s ease-in-out infinite 3s}

@keyframes breathe{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(1.1)}}

.iodev-p1-cc .iodev-noise-cc{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.4;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E")}

.iodev-watermark-wrap-cc{--watermark-size:clamp(12rem,34vw,44rem);--watermark-spacing:-0.06em;position:absolute;inset:0;pointer-events:none;z-index:0;display:flex;align-items:center;justify-content:center;overflow:hidden}
.iodev-watermark-main-cc{font-size:var(--watermark-size);font-weight:400;letter-spacing:var(--watermark-spacing);line-height:1;white-space:nowrap;user-select:none;background:linear-gradient(90deg,rgba(168,130,255,0.16) 0%,rgba(139,92,246,0.12) 20%,rgba(80,160,200,0.10) 40%,rgba(6,214,160,0.12) 60%,rgba(56,189,248,0.14) 80%,rgba(120,100,255,0.16) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.iodev-watermark-ghost-cc{position:absolute;font-size:clamp(15rem,44vw,60rem);font-weight:400;letter-spacing:-0.04em;line-height:1;white-space:nowrap;user-select:none;background:linear-gradient(90deg,rgba(139,92,246,0.04) 0%,rgba(6,214,160,0.02) 50%,rgba(56,189,248,0.03) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;filter:blur(2px)}

.iodev-letter-glows-cc{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;z-index:2}
.iodev-letter-glows-cc::before,
.iodev-letter-glows-cc::after{
  content:attr(data-text);
  position:absolute;
  font-size:var(--watermark-size);
  font-weight:400;
  letter-spacing:var(--watermark-spacing);
  line-height:1;
  white-space:nowrap;
  user-select:none;
  -webkit-text-fill-color:transparent;
  background-clip:text;
  -webkit-background-clip:text;
  will-change:background-position,filter,opacity;
}

.iodev-letter-glows-cc::before{
  background-image:linear-gradient(108deg,transparent 0%,transparent 43%,rgba(255,255,255,0.03) 46.5%,rgba(196,173,255,0.28) 48.2%,rgba(255,255,255,0.96) 49.5%,rgba(255,255,255,1) 50%,rgba(140,233,221,0.72) 50.8%,rgba(56,189,248,0.26) 53.2%,transparent 57.5%,transparent 100%);
  background-size:210% 100%;
  background-repeat:no-repeat;
  animation:word-sweep 5.4s cubic-bezier(.22,1,.36,1) infinite;
  filter:drop-shadow(0 0 8px rgba(235,226,255,0.12)) drop-shadow(0 0 18px rgba(56,189,248,0.05));
}

.iodev-letter-glows-cc::after{
  background-image:linear-gradient(108deg,transparent 0%,transparent 44%,rgba(255,255,255,0.02) 47.8%,rgba(255,255,255,0.18) 49.5%,rgba(157,243,227,0.2) 52.6%,transparent 58.5%,transparent 100%);
  background-size:190% 100%;
  background-repeat:no-repeat;
  animation:word-sweep 5.4s cubic-bezier(.22,1,.36,1) infinite -.18s;
  filter:blur(.85px);
  opacity:.68;
}

@keyframes word-sweep{
  0%,14%{background-position:130% 50%;opacity:0}
  24%{opacity:.78}
  52%{background-position:50% 50%;opacity:1}
  76%{opacity:.82}
  100%{background-position:-40% 50%;opacity:0}
}

.iodev-hero-cc{position:relative;z-index:5;text-align:center;width:min(100%,900px);padding-inline:clamp(20px,4vw,32px)}
.iodev-masthead-cc{display:inline-flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;margin-bottom:18px;padding:8px 14px;border-radius:999px;border:1px solid rgba(255,255,255,0.05);background:rgba(255,255,255,0.018);backdrop-filter:blur(14px);opacity:0;animation:fadeDown 0.8s ease forwards}
.iodev-masthead-domain-cc{font-family:var(--font-mono);font-size:0.72rem;letter-spacing:0.18em;color:#e4e4e8;text-transform:lowercase}
.iodev-masthead-sep-cc{width:1px;height:12px;background:rgba(255,255,255,0.08)}
.iodev-masthead-note-cc{font-family:var(--font-mono);font-size:0.66rem;letter-spacing:0.12em;color:#71717a;text-transform:uppercase}
.iodev-masthead-link-cc{padding:3px 8px;border-radius:999px;border:1px solid rgba(56,189,248,0.16);background:rgba(56,189,248,0.08);font-family:var(--font-mono);font-size:0.56rem;letter-spacing:0.1em;color:#7dd3fc;text-transform:uppercase;text-decoration:none;transition:all .25s}
.iodev-masthead-link-cc:hover{border-color:rgba(56,189,248,0.35);background:rgba(56,189,248,0.14);color:#bae6fd}
.iodev-masthead-status-cc{padding:3px 8px;border-radius:999px;border:1px solid rgba(6,214,160,0.14);background:rgba(6,214,160,0.08);font-family:var(--font-mono);font-size:0.56rem;letter-spacing:0.1em;color:#83f1d5;text-transform:uppercase}
.iodev-hero-tag-cc{display:inline-flex;align-items:center;justify-content:center;gap:10px;max-width:100%;flex-wrap:wrap;text-align:center;font-family:var(--font-mono);font-size:0.75rem;letter-spacing:0.2em;text-transform:uppercase;color:#6a6a72;margin-bottom:clamp(24px,4vw,40px);padding:6px 16px;border-radius:100px;border:1px solid rgba(255,255,255,0.04);background:rgba(255,255,255,0.01);animation:fadeDown 0.8s ease forwards}
.iodev-hero-tag-cc .iodev-pulse-cc{width:5px;height:5px;border-radius:50%;background:#06d6a0;position:relative}
.iodev-hero-tag-cc .iodev-pulse-cc::after{content:'';position:absolute;inset:-3px;border-radius:50%;border:1px solid rgba(6,214,160,0.3);animation:ping 2s infinite}

@keyframes ping{0%{transform:scale(1);opacity:1}100%{transform:scale(2.5);opacity:0}}
@keyframes fadeDown{from{opacity:0;transform:translateY(-16px)}to{opacity:1;transform:translateY(0)}}

.iodev-hero-cc h1{font-size:clamp(3.25rem,11vw,8.5rem);line-height:0.92;letter-spacing:-0.04em;margin-bottom:28px;opacity:0;animation:fadeUp 0.9s ease forwards;animation-delay:0.15s;text-wrap:balance}

@keyframes fadeUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}

.iodev-hero-cc h1 .iodev-accent-cc{display:inline-block;background:linear-gradient(135deg,#8b5cf6 0%,#06d6a0 60%,#38bdf8 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;background-size:200% 200%;animation:gradient-shift 6s ease infinite}

@keyframes gradient-shift{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}

.iodev-hero-brand-cc{font-family:var(--font-mono);font-size:0.8125rem;color:#8b5cf6;letter-spacing:clamp(0.16em,1.1vw,0.35em);text-transform:uppercase;margin-bottom:20px;opacity:0;animation:fadeUp 0.9s ease forwards;animation-delay:0.3s}
.iodev-hero-desc-cc{font-family:var(--font-mono);font-size:0.875rem;color:#52525b;max-width:min(100%,34rem);margin:0 auto clamp(32px,5vw,48px);line-height:2;opacity:0;animation:fadeUp 0.9s ease forwards;animation-delay:0.4s;text-wrap:pretty}
.iodev-hero-tags-cc{display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(6px,1.4vw,10px);margin-bottom:clamp(32px,5vw,48px);opacity:0;animation:fadeUp 0.9s ease forwards;animation-delay:0.55s}
.iodev-hero-tags-cc .iodev-htag-cc{font-family:var(--font-mono);font-size:0.6875rem;padding:5px 14px;border-radius:6px;color:#6a6a72;letter-spacing:0.08em;border:1px solid rgba(255,255,255,0.04);background:rgba(255,255,255,0.01);transition:all .3s;cursor:default}
.iodev-hero-tags-cc .iodev-htag-cc:hover{border-color:rgba(139,92,246,0.2);color:#a1a1aa;background:rgba(139,92,246,0.03)}
.iodev-hero-tags-cc .iodev-htag-cc .iodev-dot-cc{display:inline-block;width:4px;height:4px;border-radius:50%;margin-right:6px;vertical-align:middle}
.iodev-hero-tags-cc .iodev-htag-cc .iodev-dot-cc.iodev-v-cc{background:#06d6a0}
.iodev-hero-tags-cc .iodev-htag-cc .iodev-dot-cc.iodev-p-cc{background:#8b5cf6}
.iodev-hero-tags-cc .iodev-htag-cc .iodev-dot-cc.iodev-b-cc{background:#38bdf8}

.iodev-terminal-cc{width:min(100%,580px);margin:0 auto;background:#0a0a0d;border:1px solid #18181c;border-radius:16px;overflow:hidden;box-shadow:0 0 0 1px rgba(255,255,255,0.015) inset,0 40px 110px rgba(0,0,0,0.58),0 0 70px rgba(139,92,246,0.035);text-align:left;opacity:0;animation:fadeUp 1s ease forwards;animation-delay:0.6s}
.iodev-terminal-bar-cc{padding:14px 18px;display:flex;align-items:center;gap:7px;flex-wrap:wrap;background:rgba(255,255,255,0.012);border-bottom:1px solid #18181c}
.iodev-terminal-bar-cc i{width:10px;height:10px;border-radius:50%;display:block}
.iodev-terminal-bar-cc i:nth-child(1){background:#ff5f57}
.iodev-terminal-bar-cc i:nth-child(2){background:#febc2e}
.iodev-terminal-bar-cc i:nth-child(3){background:#28c840}
.iodev-terminal-bar-cc .iodev-title-cc{margin-left:auto;font-family:var(--font-mono);font-size:0.625rem;color:#3f3f46;letter-spacing:0.05em}
.iodev-terminal-body-cc{padding:22px 24px;font-family:var(--font-mono);font-size:clamp(0.7rem,1.1vw,0.75rem);line-height:2.05}
.iodev-t-p-cc{color:#06d6a0}
.iodev-t-c-cc{color:#d4d4d8}
.iodev-t-o-cc{color:#52525b}
.iodev-t-h-cc{color:#8b5cf6}
.iodev-t-k-cc{color:#f43f5e}
.iodev-t-a-cc{color:#38bdf8}
.iodev-cursor-cc{display:inline-block;width:7px;height:13px;background:#8b5cf6;vertical-align:middle;animation:blink 1s step-end infinite;margin-left:2px}

@keyframes blink{0%,100%{opacity:1}50%{opacity:0}}

.iodev-tl-cc{overflow:hidden;white-space:nowrap;width:0;animation:type .5s steps(36) forwards}
.iodev-tl-cc:nth-child(2){animation-delay:.5s}
.iodev-tl-cc:nth-child(3){animation-delay:1s}
.iodev-tl-cc:nth-child(4){animation-delay:1.5s}
.iodev-tl-cc:nth-child(5){animation-delay:2s}
.iodev-tl-cc:nth-child(6){animation-delay:2.5s}

@keyframes type{to{width:100%}}

.iodev-scroll-cue-cc{position:absolute;bottom:clamp(18px,4vh,32px);left:50%;transform:translateX(-50%);z-index:6;display:flex;flex-direction:column;align-items:center;gap:10px;opacity:0;animation:fadeUp 0.8s ease forwards;animation-delay:1.2s}
.iodev-scroll-cue-cc span{font-family:var(--font-mono);font-size:0.625rem;color:#3f3f46;letter-spacing:0.15em}
.iodev-scroll-cue-cc .iodev-line-cc{width:1px;height:32px;background:linear-gradient(to bottom,#3f3f46,transparent);animation:scroll-pulse 2s ease-in-out infinite}

@keyframes scroll-pulse{0%,100%{opacity:.3;transform:scaleY(1)}50%{opacity:1;transform:scaleY(1.3)}}

.iodev-p2-cc{min-height:100vh;min-height:100svh;position:relative;display:flex;flex-direction:column;overflow:visible;scroll-snap-align:none;content-visibility:auto;contain-intrinsic-size:1080px}
.iodev-p2-cc::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent 0%,rgba(139,92,246,0.2) 50%,transparent 100%);z-index:2}
.iodev-p2-cc::after{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 60% 40% at 50% 100%,rgba(139,92,246,0.04),transparent 70%)}

.iodev-showcase-head-cc{padding:clamp(22px,3.6vw,34px) clamp(20px,5vw,48px) 0;position:relative;z-index:1}
.iodev-showcase-head-cc .iodev-label-cc{font-family:var(--font-mono);font-size:0.625rem;color:#8b5cf6;letter-spacing:0.25em;text-transform:uppercase;margin-bottom:12px}
.iodev-showcase-head-cc h2{font-size:clamp(2rem,4vw,3rem);letter-spacing:-0.03em;line-height:1.15;margin-bottom:8px}
.iodev-showcase-head-cc p{font-size:0.9375rem;color:#52525b;line-height:1.7;max-width:480px;text-wrap:pretty}

.iodev-canvas-cc{flex:1;padding:clamp(12px,2.6vw,20px) clamp(20px,5vw,48px) clamp(14px,2.6vw,18px);position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);grid-template-rows:auto auto auto;gap:clamp(10px,1.5vw,12px);min-height:0;contain:layout paint}

.iodev-ui-window-cc{background:#0c0c10;border:1px solid #18181c;border-radius:14px;overflow:hidden;position:relative;min-width:0;box-shadow:0 12px 48px rgba(0,0,0,0.34),0 0 0 1px rgba(255,255,255,0.015) inset;transition:transform .38s cubic-bezier(.16,1,.3,1),box-shadow .38s,border-color .3s}
.iodev-ui-window-cc:hover{transform:translateY(-3px);box-shadow:0 22px 70px rgba(0,0,0,0.4),0 0 0 1px rgba(255,255,255,0.022) inset,0 0 34px rgba(139,92,246,0.03);border-color:rgba(139,92,246,0.11)}

.iodev-win-bar-cc{padding:10px 14px;display:flex;align-items:center;gap:6px;flex-wrap:wrap;background:rgba(255,255,255,0.01);border-bottom:1px solid #18181c;transition:background .3s}
.iodev-ui-window-cc:hover .iodev-win-bar-cc{background:rgba(255,255,255,0.018)}
.iodev-win-bar-cc .iodev-dots-cc{display:flex;gap:5px}
.iodev-win-bar-cc .iodev-dots-cc span{width:8px;height:8px;border-radius:50%;transition:box-shadow .3s}
.iodev-ui-window-cc:hover .iodev-win-bar-cc .iodev-dots-cc span:nth-child(1){box-shadow:0 0 6px rgba(255,95,87,0.4)}
.iodev-ui-window-cc:hover .iodev-win-bar-cc .iodev-dots-cc span:nth-child(2){box-shadow:0 0 6px rgba(254,188,46,0.4)}
.iodev-ui-window-cc:hover .iodev-win-bar-cc .iodev-dots-cc span:nth-child(3){box-shadow:0 0 6px rgba(40,200,64,0.4)}
.iodev-win-bar-cc .iodev-dots-cc span:nth-child(1){background:#ff5f57}
.iodev-win-bar-cc .iodev-dots-cc span:nth-child(2){background:#febc2e}
.iodev-win-bar-cc .iodev-dots-cc span:nth-child(3){background:#28c840}
.iodev-win-bar-cc .iodev-title-cc{margin-left:auto;font-family:var(--font-mono);font-size:0.5625rem;color:#3f3f46;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.iodev-win-bar-cc .iodev-title-start-cc{margin-left:8px}
.iodev-win-bar-cc .iodev-tabs-cc{display:flex;flex-wrap:wrap;gap:6px;margin-left:12px;min-width:0}
.iodev-win-bar-cc .iodev-tab-cc{padding:3px 10px;font-family:var(--font-mono);font-size:0.5625rem;color:#3f3f46;border-bottom:1px solid transparent;cursor:pointer;transition:all .25s;border-radius:3px 3px 0 0}
.iodev-win-bar-cc .iodev-tab-cc.iodev-active-cc{color:#a1a1aa;border-bottom-color:#8b5cf6}
.iodev-win-bar-cc .iodev-tab-cc:hover:not(.iodev-active-cc){color:#71717a;background:rgba(255,255,255,0.02)}

.iodev-ui-window-cc[data-tooltip]{position:relative}
.iodev-ui-window-cc[data-tooltip]::after{content:attr(data-tooltip);position:absolute;top:-32px;left:50%;transform:translateX(-50%) translateY(4px);font-family:var(--font-mono);font-size:0.5625rem;color:#a1a1aa;background:#1a1a1f;border:1px solid #27272a;padding:4px 10px;border-radius:6px;white-space:nowrap;opacity:0;pointer-events:none;transition:all .3s;z-index:10;box-shadow:0 4px 12px rgba(0,0,0,0.4)}
.iodev-ui-window-cc[data-tooltip]:hover::after{opacity:1;transform:translateX(-50%) translateY(0)}

.iodev-w-design-cc{grid-column:1;grid-row:1/3}
.iodev-w-design-cc .iodev-win-body-cc{padding:clamp(10px,1.8vw,12px);height:calc(100% - 38px);display:flex;flex-direction:column;gap:8px}
.iodev-design-toolbar-cc{display:flex;align-items:center;gap:8px;padding:6px 10px;border-radius:8px;background:rgba(255,255,255,0.015);border:1px solid rgba(255,255,255,0.03)}
.iodev-design-toolbar-cc .iodev-tool-cc{width:24px;height:24px;border-radius:6px;background:rgba(255,255,255,0.03);display:flex;align-items:center;justify-content:center;font-size:0.5625rem;color:#52525b;cursor:pointer;transition:all .2s}
.iodev-design-toolbar-cc .iodev-tool-cc.iodev-active-cc{background:rgba(139,92,246,0.15);color:#8b5cf6}
.iodev-design-toolbar-cc .iodev-tool-cc:hover:not(.iodev-active-cc){background:rgba(255,255,255,0.06);color:#a1a1aa}
.iodev-design-toolbar-cc .iodev-sep-cc{width:1px;height:14px;background:#1e1e24}
.iodev-design-toolbar-cc .iodev-zoom-cc{margin-left:auto;font-family:var(--font-mono);font-size:0.5625rem;color:#3f3f46}

.iodev-design-canvas-cc{flex:1;min-height:clamp(220px,26vw,320px);border-radius:10px;position:relative;overflow:hidden;background:linear-gradient(rgba(255,255,255,0.012) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,0.012) 1px,transparent 1px);background-size:20px 20px;border:1px solid rgba(255,255,255,0.02);--canvas-pad:clamp(12px,1.8vw,16px);--canvas-gap:clamp(10px,1.4vw,12px);--sidebar-w:clamp(86px,18%,108px);--card-w:clamp(132px,26%,182px);--header-h:clamp(34px,6vw,40px);--btn-w:clamp(68px,14%,78px);--btn-h:clamp(24px,4.5vw,28px)}

.iodev-d-el-cc{position:absolute;border-radius:8px;border:1px solid;transition:all .4s cubic-bezier(.16,1,.3,1)}
.iodev-d-el-cc:hover{transform:scale(1.03);box-shadow:0 0 20px rgba(139,92,246,0.06)}
.iodev-d-header-cc{top:var(--canvas-pad);left:var(--canvas-pad);right:var(--canvas-pad);height:var(--header-h);background:rgba(255,255,255,0.02);border-color:rgba(255,255,255,0.05);display:flex;align-items:center;padding:0 clamp(10px,2vw,14px);gap:8px}
.iodev-d-header-cc .iodev-logo-dot-cc{width:16px;height:16px;border-radius:4px;background:rgba(139,92,246,0.3)}
.iodev-d-header-cc .iodev-nav-items-cc{display:flex;gap:6px;margin-left:auto}
.iodev-d-header-cc .iodev-nav-item-cc{width:clamp(24px,7vw,36px);height:6px;border-radius:3px;background:rgba(255,255,255,0.06)}
.iodev-d-sidebar-cc{top:calc(var(--canvas-pad) + var(--header-h) + var(--canvas-gap));left:var(--canvas-pad);width:var(--sidebar-w);bottom:var(--canvas-pad);background:rgba(255,255,255,0.015);border-color:rgba(255,255,255,0.04);padding:clamp(8px,2vw,12px);display:flex;flex-direction:column;gap:6px}
.iodev-d-sidebar-cc .iodev-side-item-cc{height:10px;border-radius:4px;background:rgba(255,255,255,0.04);transition:background .3s}
.iodev-d-sidebar-cc .iodev-side-item-cc.iodev-active-cc{background:rgba(139,92,246,0.2)}
.iodev-d-sidebar-cc .iodev-side-item-cc:hover{background:rgba(255,255,255,0.08)}
.iodev-d-sidebar-cc .iodev-spacer-cc{flex:1}
.iodev-d-card-cc{top:calc(var(--canvas-pad) + var(--header-h) + var(--canvas-gap));left:calc(var(--canvas-pad) + var(--sidebar-w) + var(--canvas-gap));width:var(--card-w);height:clamp(98px,26%,124px);background:rgba(255,255,255,0.02);border-color:rgba(255,255,255,0.05);padding:clamp(10px,2vw,12px);display:flex;flex-direction:column;gap:6px}
.iodev-d-card-cc .iodev-card-bar-cc{height:4px;border-radius:2px;background:rgba(139,92,246,0.2);width:60%}
.iodev-d-card-cc .iodev-card-line-cc{height:3px;border-radius:2px;background:rgba(255,255,255,0.04)}
.iodev-d-card-cc .iodev-card-line-cc:nth-child(3){width:80%}
.iodev-d-card-cc .iodev-card-line-cc:nth-child(4){width:65%}
.iodev-d-btn-cc{top:calc(var(--canvas-pad) + var(--header-h) + var(--canvas-gap) + clamp(116px,31%,144px));left:calc(var(--canvas-pad) + var(--sidebar-w) + var(--canvas-gap));width:var(--btn-w);height:var(--btn-h);background:rgba(139,92,246,0.15);border-color:rgba(139,92,246,0.25);display:flex;align-items:center;justify-content:center;font-family:var(--font-mono);font-size:0.4375rem;color:rgba(139,92,246,0.6);transition:all .3s}
.iodev-d-btn-cc:hover{background:rgba(139,92,246,0.25);border-color:rgba(139,92,246,0.4)}
.iodev-d-chart-cc{top:calc(var(--canvas-pad) + var(--header-h) + var(--canvas-gap));left:calc(var(--canvas-pad) + var(--sidebar-w) + var(--canvas-gap) + var(--card-w) + var(--canvas-gap));right:var(--canvas-pad);bottom:var(--canvas-pad);background:rgba(255,255,255,0.015);border-color:rgba(255,255,255,0.04);padding:clamp(10px,2vw,14px);display:flex;flex-direction:column}
.iodev-d-chart-cc .iodev-chart-title-cc{font-family:var(--font-mono);font-size:0.5rem;color:#3f3f46;margin-bottom:10px}
.iodev-d-chart-cc .iodev-bars-cc{flex:1;display:flex;align-items:flex-end;gap:clamp(3px,0.5vw,4px)}
.iodev-d-chart-cc .iodev-cbar-cc{flex:1;border-radius:3px 3px 0 0;background:linear-gradient(to top,rgba(139,92,246,0.25),rgba(6,214,160,0.15));transition:height .6s cubic-bezier(.16,1,.3,1),opacity .3s}
.iodev-d-chart-cc:hover .iodev-cbar-cc{opacity:0.9}
.iodev-d-chart-cc .iodev-cbar-cc:hover{opacity:1;box-shadow:0 0 8px rgba(139,92,246,0.15)}
.iodev-d-el-cc .iodev-handle-cc{position:absolute;width:5px;height:5px;border:1px solid rgba(139,92,246,0.4);background:#0c0c10;opacity:0;transition:opacity .3s}
.iodev-d-el-cc:hover .iodev-handle-cc{opacity:1}
.iodev-d-el-cc .iodev-handle-cc.iodev-tl-cc{top:-3px;left:-3px}
.iodev-d-el-cc .iodev-handle-cc.iodev-tr-cc{top:-3px;right:-3px}
.iodev-d-el-cc .iodev-handle-cc.iodev-bl-cc{bottom:-3px;left:-3px}
.iodev-d-el-cc .iodev-handle-cc.iodev-br-cc{bottom:-3px;right:-3px}

.iodev-w-code-cc{grid-column:2;grid-row:1;align-self:start}
.iodev-w-code-cc .iodev-win-body-cc{padding:0;min-height:clamp(166px,15vw,208px);display:grid;grid-template-columns:clamp(28px,4vw,32px) minmax(0,1fr);font-family:var(--font-mono);font-size:clamp(0.6rem,0.74vw,0.66rem)}
.iodev-code-gutter-cc{padding:10px 0;text-align:right;border-right:1px solid #18181c;color:#27272a;user-select:none}
.iodev-code-gutter-cc span{display:block;padding:0 6px;line-height:1.58;transition:color .2s}
.iodev-code-area-cc{padding:10px 12px;line-height:1.58;overflow:auto}
.iodev-code-area-cc{white-space:pre}
.iodev-code-area-cc .iodev-k-cc{color:#c084fc}
.iodev-code-area-cc .iodev-f-cc{color:#60a5fa}
.iodev-code-area-cc .iodev-s-cc{color:#34d399}
.iodev-code-area-cc .iodev-c-cc{color:#27272a;font-style:italic}
.iodev-code-area-cc .iodev-t-cc{color:#38bdf8}
.iodev-code-area-cc .iodev-n-cc{color:#fb923c}
.iodev-code-area-cc .iodev-p-cc{color:#f472b6}

.iodev-w-components-cc{grid-column:2;grid-row:2;align-self:start}
.iodev-w-components-cc .iodev-win-body-cc{padding:10px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;align-content:start}
.iodev-comp-card-cc{border-radius:8px;padding:10px;background:rgba(255,255,255,0.015);border:1px solid rgba(255,255,255,0.03);transition:all .3s cubic-bezier(.16,1,.3,1);cursor:pointer}
.iodev-comp-card-cc:hover{border-color:rgba(139,92,246,0.25);background:rgba(139,92,246,0.04);transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,0.3)}
.iodev-comp-preview-cc{height:40px;border-radius:4px;margin-bottom:6px;background:rgba(255,255,255,0.02);display:flex;align-items:center;justify-content:center;overflow:hidden;transition:background .3s}
.iodev-comp-card-cc:hover .iodev-comp-preview-cc{background:rgba(255,255,255,0.035)}
.iodev-comp-name-cc{font-family:var(--font-mono);font-size:0.5rem;color:#52525b;transition:color .3s}
.iodev-comp-card-cc:hover .iodev-comp-name-cc{color:#a1a1aa}
.iodev-mini-btn-cc{padding:3px 10px;border-radius:4px;background:rgba(139,92,246,0.15);font-family:var(--font-mono);font-size:0.4375rem;color:rgba(139,92,246,0.5)}
.iodev-mini-btn-cc.iodev-alt-cc{background:rgba(6,214,160,0.15);color:rgba(6,214,160,0.5)}
.iodev-mini-input-cc{width:70%;height:10px;border-radius:3px;border:1px solid rgba(255,255,255,0.06);background:rgba(255,255,255,0.02)}
.iodev-mini-toggle-cc{width:24px;height:12px;border-radius:6px;background:rgba(6,214,160,0.2);position:relative}
.iodev-mini-toggle-cc::after{content:'';position:absolute;top:2px;right:2px;width:8px;height:8px;border-radius:50%;background:rgba(6,214,160,0.6)}
.iodev-mini-avatar-cc{width:20px;height:20px;border-radius:50%;background:rgba(244,63,94,0.15);border:1px solid rgba(244,63,94,0.2)}
.iodev-mini-card-cc{width:80%;height:24px;border-radius:4px;background:rgba(255,255,255,0.02);border:1px solid rgba(255,255,255,0.04)}
.iodev-mini-progress-cc{width:80%;height:4px;border-radius:2px;background:rgba(255,255,255,0.04);position:relative;overflow:hidden}
.iodev-mini-progress-cc::after{content:'';position:absolute;left:0;top:0;bottom:0;width:60%;border-radius:2px;background:linear-gradient(90deg,rgba(139,92,246,0.3),rgba(6,214,160,0.2))}
.iodev-mini-badge-cc{padding:2px 8px;border-radius:10px;background:rgba(245,158,11,0.12);border:1px solid rgba(245,158,11,0.15);font-family:var(--font-mono);font-size:0.375rem;color:rgba(245,158,11,0.5)}
.iodev-mini-tabs-cc{display:flex;gap:2px}
.iodev-mini-tabs-cc span{width:16px;height:3px;border-radius:1px;background:rgba(255,255,255,0.06)}
.iodev-mini-tabs-cc span.iodev-active-cc{background:rgba(139,92,246,0.3)}

.iodev-stats-bar-cc{display:flex;align-items:center;justify-content:flex-start;gap:clamp(18px,4vw,48px);flex-wrap:wrap;padding:clamp(14px,3vw,18px) clamp(16px,4vw,24px);margin:0 clamp(20px,5vw,48px) clamp(16px,2.5vw,22px);background:#0a0a0d;border:1px solid #18181c;border-radius:14px;box-shadow:0 10px 40px rgba(0,0,0,0.3);transition:border-color .4s}
.iodev-stats-bar-cc:hover{border-color:rgba(139,92,246,0.08)}
.iodev-stat-item-cc{text-align:center;min-width:92px}
.iodev-stat-item-cc b{font-family:var(--font-mono);font-size:1.375rem;font-weight:400;background:linear-gradient(135deg,#8b5cf6,#06d6a0);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.iodev-stat-item-cc small{display:block;font-size:0.5625rem;color:#3f3f46;margin-top:2px;font-family:var(--font-mono);letter-spacing:0.05em}
.iodev-stat-sep-cc{width:1px;height:32px;background:#18181c}
.iodev-stats-cta-cc{display:flex;gap:10px;margin-left:auto;flex-wrap:wrap;justify-content:flex-end}
.iodev-btn-primary-cc{padding:10px 22px;min-height:42px;border-radius:8px;background:linear-gradient(135deg,#8b5cf6,#6366f1);color:#fff;font-family:var(--font-ui);font-size:0.875rem;border:none;cursor:pointer;transition:all .35s cubic-bezier(.16,1,.3,1);font-weight:600;white-space:nowrap;position:relative;overflow:hidden}
.iodev-btn-primary-cc::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,#a78bfa,#818cf8);opacity:0;transition:opacity .3s}
.iodev-btn-primary-cc:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(139,92,246,0.3)}
.iodev-btn-primary-cc:hover::before{opacity:1}
.iodev-btn-primary-cc span{position:relative;z-index:1}
.iodev-btn-sec-cc{padding:10px 22px;min-height:42px;border-radius:8px;background:transparent;color:#a1a1aa;border:1px solid #1e1e24;font-family:var(--font-ui);font-size:0.875rem;cursor:pointer;transition:all .3s;font-weight:600;white-space:nowrap}
.iodev-btn-sec-cc:hover{border-color:#8b5cf6;color:#c4b5fd;transform:translateY(-2px)}

.iodev-site-footer-cc{padding:clamp(20px,4vw,24px) 24px 20px;text-align:center;position:relative;border-top:1px solid rgba(255,255,255,0.02)}
.iodev-footer-copy-cc{font-family:var(--font-mono);font-size:0.8125rem;color:#3f3f46;letter-spacing:0.06em;line-height:1.6}
.iodev-footer-copy-cc .iodev-brand-cc{background:linear-gradient(135deg,#8b5cf6,#06d6a0);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:500}
.iodev-footer-copy-cc .iodev-brand-cc{text-decoration:none}
.iodev-footer-copy-cc .iodev-year-cc{color:#52525b}

.iodev-leader-inline-cc{position:relative;margin:0 clamp(20px,5vw,48px) clamp(14px,2.5vw,20px);padding:clamp(16px,2.4vw,22px);border-radius:16px;border:1px solid #1b1b22;background:#0a0a0e;display:grid;grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);gap:clamp(14px,2vw,24px);box-shadow:0 14px 48px rgba(0,0,0,0.32);contain:layout paint}
.iodev-leader-inline-cc::before{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(120% 80% at 0% 0%,rgba(56,189,248,0.08),transparent 45%),radial-gradient(120% 80% at 100% 100%,rgba(139,92,246,0.08),transparent 45%)}
.iodev-leader-inline-head-cc{position:relative;z-index:1;align-self:center}
.iodev-leader-inline-head-cc .iodev-label-cc{font-family:var(--font-mono);font-size:0.625rem;color:#38bdf8;letter-spacing:0.22em;text-transform:uppercase;margin-bottom:10px}
.iodev-leader-inline-head-cc h3{font-size:clamp(1.35rem,2.2vw,1.95rem);letter-spacing:-0.02em;line-height:1.18;margin-bottom:10px}
.iodev-leader-inline-head-cc p{font-size:0.875rem;color:#60606b;line-height:1.78;max-width:36ch}

.iodev-leader-inline-card-cc{position:relative;z-index:1;background:rgba(255,255,255,0.015);border:1px solid rgba(255,255,255,0.05);border-radius:14px;padding:clamp(12px,1.8vw,16px);display:grid;grid-template-columns:clamp(102px,13vw,136px) minmax(0,1fr);gap:clamp(12px,1.8vw,16px);align-items:center}
.iodev-leader-avatar-shell-cc{position:relative;width:100%;aspect-ratio:1;border-radius:18px;display:flex;align-items:center;justify-content:center;background:linear-gradient(145deg,#121219,#0b0b0f);border:1px solid rgba(255,255,255,0.08);overflow:hidden}
.iodev-leader-avatar-ring-cc{position:absolute;inset:7px;border-radius:14px;border:1px solid rgba(139,92,246,0.25);box-shadow:inset 0 0 32px rgba(56,189,248,0.08),0 0 20px rgba(139,92,246,0.14)}
.iodev-leader-avatar-cc{position:relative;z-index:1;display:block;width:calc(100% - 22px);height:calc(100% - 22px);border-radius:12px;object-fit:cover;filter:grayscale(1) contrast(1.06) brightness(1.03);background:#efefef}
.iodev-leader-badge-cc{position:absolute;z-index:2;right:8px;bottom:8px;padding:3px 7px;border-radius:999px;border:1px solid rgba(255,255,255,0.16);background:rgba(8,10,16,0.9);font-family:var(--font-mono);font-size:0.52rem;letter-spacing:0.08em;color:#d1d5db;text-transform:uppercase;box-shadow:0 4px 12px rgba(0,0,0,0.35)}
.iodev-leader-inline-content-cc{display:flex;flex-direction:column;gap:8px}
.iodev-leader-name-cc{font-size:clamp(1.15rem,1.8vw,1.55rem);line-height:1.1;letter-spacing:-0.015em}
.iodev-leader-role-cc{font-family:var(--font-mono);font-size:0.75rem;letter-spacing:0.14em;text-transform:uppercase;color:#8b5cf6}
.iodev-leader-bio-cc{font-size:0.8125rem;color:#71717a;line-height:1.82}
.iodev-leader-tags-cc{display:flex;flex-wrap:wrap;gap:8px}
.iodev-leader-tags-cc span{padding:4px 9px;border-radius:999px;border:1px solid rgba(255,255,255,0.06);background:rgba(255,255,255,0.015);font-family:var(--font-mono);font-size:0.56rem;color:#a1a1aa;letter-spacing:0.05em}
.iodev-leader-contact-cc{display:flex;flex-wrap:wrap;gap:8px}
.iodev-leader-contact-cc a,.iodev-leader-contact-cc span{padding:4px 9px;border-radius:8px;border:1px solid rgba(255,255,255,0.07);background:rgba(255,255,255,0.012);font-family:var(--font-mono);font-size:0.58rem;color:#8a8a93;letter-spacing:0.05em;text-decoration:none}
.iodev-leader-contact-cc a:hover{border-color:rgba(56,189,248,0.28);color:#7dd3fc;background:rgba(56,189,248,0.09)}

.iodev-reveal-cc{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s cubic-bezier(.16,1,.3,1)}
.iodev-reveal-cc.iodev-visible-cc{opacity:1;transform:translateY(0)}
.iodev-reveal-delay-1-cc{transition-delay:.1s}
.iodev-reveal-delay-2-cc{transition-delay:.2s}
.iodev-reveal-delay-3-cc{transition-delay:.3s}

@media(min-width:1440px){
  .iodev-p1-cc{padding-block:56px 84px}
  .iodev-hero-cc{width:min(100%,1040px)}
  .iodev-masthead-cc{gap:14px;margin-bottom:22px;padding:10px 18px}
  .iodev-masthead-domain-cc{font-size:0.8rem}
  .iodev-masthead-note-cc{font-size:0.72rem}
  .iodev-masthead-status-cc{font-size:0.6rem;padding:4px 10px}
  .iodev-hero-tag-cc{gap:12px;font-size:0.875rem;padding:8px 20px;border-radius:999px}
  .iodev-hero-tag-cc .iodev-pulse-cc{width:6px;height:6px}
  .iodev-hero-brand-cc{font-size:0.96rem;letter-spacing:0.22em;margin-bottom:24px}
  .iodev-hero-desc-cc{max-width:42rem;font-size:1rem;line-height:1.95;margin-bottom:56px}
  .iodev-hero-tags-cc{gap:12px;margin-bottom:56px}
  .iodev-hero-tags-cc .iodev-htag-cc{font-size:0.8rem;padding:7px 16px}
  .iodev-hero-tags-cc .iodev-htag-cc .iodev-dot-cc{width:5px;height:5px;margin-right:8px}
  .iodev-terminal-cc{width:min(100%,680px);border-radius:18px}
  .iodev-terminal-bar-cc{padding:16px 20px;gap:9px}
  .iodev-terminal-bar-cc i{width:12px;height:12px}
  .iodev-terminal-bar-cc .iodev-title-cc{font-size:0.72rem;letter-spacing:0.08em}
  .iodev-terminal-body-cc{padding:24px 28px;font-size:0.84rem;line-height:2.15}
  .iodev-cursor-cc{width:8px;height:15px}
  .iodev-scroll-cue-cc{gap:12px}
  .iodev-scroll-cue-cc span{font-size:0.72rem;letter-spacing:0.22em}
  .iodev-scroll-cue-cc .iodev-line-cc{height:40px}
  .iodev-showcase-head-cc .iodev-label-cc{font-size:0.72rem;letter-spacing:0.28em}
  .iodev-showcase-head-cc h2{font-size:clamp(2.4rem,3vw,3.4rem)}
  .iodev-showcase-head-cc p{font-size:1rem;max-width:560px}
  .iodev-canvas-cc{gap:14px}
  .iodev-win-bar-cc{padding:12px 16px;gap:8px}
  .iodev-win-bar-cc .iodev-dots-cc span{width:10px;height:10px}
  .iodev-win-bar-cc .iodev-title-cc{font-size:0.66rem}
  .iodev-win-bar-cc .iodev-tab-cc{font-size:0.66rem;padding:4px 12px}
  .iodev-w-design-cc .iodev-win-body-cc{gap:10px}
  .iodev-design-toolbar-cc{padding:8px 12px;gap:10px}
  .iodev-design-toolbar-cc .iodev-tool-cc{width:28px;height:28px;font-size:0.66rem}
  .iodev-design-toolbar-cc .iodev-zoom-cc{font-size:0.66rem}
  .iodev-d-chart-cc .iodev-chart-title-cc{font-size:0.6rem}
  .iodev-w-code-cc .iodev-win-body-cc{font-size:0.75rem}
  .iodev-w-components-cc .iodev-win-body-cc{gap:8px}
  .iodev-comp-card-cc{padding:12px}
  .iodev-comp-preview-cc{height:48px;margin-bottom:8px}
  .iodev-comp-name-cc{font-size:0.62rem}
  .iodev-mini-btn-cc{font-size:0.54rem;padding:4px 12px}
  .iodev-mini-badge-cc{font-size:0.48rem;padding:3px 9px}
  .iodev-stats-bar-cc{padding:20px 26px}
  .iodev-stat-item-cc b{font-size:1.6rem}
  .iodev-stat-item-cc small{font-size:0.68rem}
  .iodev-btn-primary-cc,.iodev-btn-sec-cc{font-size:0.96rem;padding:12px 24px;min-height:46px}
  .iodev-footer-copy-cc{font-size:0.9rem}
}

@media(min-width:1680px){
  .iodev-hero-cc{width:min(100%,1120px)}
  .iodev-masthead-domain-cc{font-size:0.84rem}
  .iodev-masthead-note-cc{font-size:0.75rem}
  .iodev-hero-tag-cc{font-size:0.92rem}
  .iodev-hero-desc-cc{font-size:1.06rem;max-width:46rem}
  .iodev-hero-tags-cc .iodev-htag-cc{font-size:0.84rem}
  .iodev-terminal-cc{width:min(100%,740px)}
  .iodev-terminal-body-cc{font-size:0.88rem}
  .iodev-showcase-head-cc p{font-size:1.04rem}
  .iodev-win-bar-cc .iodev-title-cc,.iodev-win-bar-cc .iodev-tab-cc{font-size:0.7rem}
  .iodev-w-code-cc .iodev-win-body-cc{font-size:0.79rem}
  .iodev-stat-item-cc b{font-size:1.72rem}
  .iodev-btn-primary-cc,.iodev-btn-sec-cc{font-size:1rem}
}

@media(max-width:1180px){
  .iodev-canvas-cc{grid-template-columns:1fr;grid-template-rows:auto auto auto auto}
  .iodev-w-design-cc{grid-column:1;grid-row:1;min-height:clamp(260px,44vw,360px)}
  .iodev-w-code-cc{grid-column:1;grid-row:2}
  .iodev-w-components-cc{grid-column:1;grid-row:3}
  .iodev-ui-window-cc[data-tooltip]::after{display:none}
  .iodev-watermark-ghost-cc{display:none}
  .iodev-letter-glows-cc{display:none}
  .iodev-leader-inline-cc{grid-template-columns:1fr}
  .iodev-leader-inline-head-cc p{max-width:unset}
}

@media(max-width:820px){
  html{scroll-snap-type:y proximity}
  .iodev-p1-cc{padding-block:32px 72px}
  .iodev-terminal-bar-cc .iodev-title-cc{margin-left:0;width:100%}
  .iodev-tl-cc{white-space:normal;width:auto;animation:none}
  .iodev-cursor-cc{display:none}
  .iodev-w-components-cc .iodev-win-body-cc{grid-template-columns:repeat(2,minmax(0,1fr))}
  .iodev-stat-sep-cc{display:none}
  .iodev-stats-cta-cc{margin-left:0;width:100%;justify-content:flex-start}
  .iodev-scroll-cue-cc{display:none}
  .iodev-leader-inline-card-cc{grid-template-columns:minmax(0,1fr) 112px;align-items:start;column-gap:10px;row-gap:8px}
  .iodev-leader-inline-content-cc{display:contents}
  .iodev-leader-avatar-shell-cc{grid-column:2;grid-row:1 / span 2;justify-self:end;align-self:start;width:112px;max-width:none}
  .iodev-leader-name-cc{grid-column:1;grid-row:1}
  .iodev-leader-role-cc{grid-column:1;grid-row:2}
  .iodev-leader-bio-cc{grid-column:1 / -1;grid-row:3}
  .iodev-leader-tags-cc{grid-column:1 / -1;grid-row:4}
  .iodev-leader-contact-cc{grid-column:1 / -1;grid-row:5}
}

@media(max-width:640px){
  .iodev-watermark-wrap-cc{--watermark-size:clamp(9rem,30vw,14rem);--watermark-spacing:-0.045em}
  .iodev-masthead-cc{gap:8px;margin-bottom:14px;padding:7px 10px}
  .iodev-masthead-domain-cc{font-size:0.64rem;letter-spacing:0.14em}
  .iodev-masthead-note-cc{font-size:0.58rem;letter-spacing:0.08em}
  .iodev-masthead-status-cc{font-size:0.5rem;padding:2px 7px}
  .iodev-hero-cc h1{font-size:clamp(2.75rem,16vw,4.75rem)}
  .iodev-hero-desc-cc{line-height:1.8}
  .iodev-design-canvas-cc{min-height:210px;--sidebar-w:84px;--card-w:126px}
  .iodev-hero-tags-cc .iodev-htag-cc{font-size:0.625rem;padding:4px 10px}
  .iodev-terminal-body-cc{padding:16px 18px;font-size:0.66rem}
  .iodev-w-code-cc .iodev-win-body-cc{min-height:154px}
  .iodev-design-toolbar-cc{flex-wrap:wrap}
  .iodev-design-toolbar-cc .iodev-zoom-cc{margin-left:0;width:100%;text-align:right}
  .iodev-d-chart-cc{display:none}
  .iodev-footer-copy-cc{letter-spacing:0.03em}
  .iodev-leader-inline-cc{padding:14px}
  .iodev-leader-inline-card-cc{grid-template-columns:minmax(0,1fr) 100px;padding:12px;gap:10px}
  .iodev-leader-avatar-shell-cc{width:100px}
  .iodev-leader-role-cc{letter-spacing:0.1em}
}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;scroll-snap-type:none}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .iodev-reveal-cc{opacity:1;transform:none}
}

@media(max-width:480px){
  .iodev-masthead-sep-cc{display:none}
  .iodev-hero-tag-cc{font-size:0.68rem;letter-spacing:0.12em;padding:6px 12px}
  .iodev-hero-brand-cc{font-size:0.6875rem;letter-spacing:0.14em}
  .iodev-d-sidebar-cc{display:none}
  .iodev-d-card-cc{left:var(--canvas-pad);right:var(--canvas-pad);width:auto;top:calc(var(--canvas-pad) + var(--header-h) + var(--canvas-gap));height:clamp(92px,32%,120px)}
  .iodev-d-btn-cc{left:var(--canvas-pad);top:auto;bottom:var(--canvas-pad)}
  .iodev-w-components-cc .iodev-win-body-cc{grid-template-columns:repeat(2,minmax(0,1fr))}
  .iodev-stats-bar-cc{justify-content:center}
  .iodev-stats-cta-cc{justify-content:center}
  .iodev-btn-primary-cc,.iodev-btn-sec-cc{width:100%}
  .iodev-leader-inline-card-cc{grid-template-columns:minmax(0,1fr) 92px}
  .iodev-leader-avatar-shell-cc{width:92px}
  .iodev-leader-inline-head-cc h3{font-size:1.2rem}
  .iodev-leader-tags-cc span{font-size:0.52rem}
  .iodev-leader-contact-cc a,.iodev-leader-contact-cc span{font-size:0.52rem}
}