.ugc-page .ugc-hero-glow{background:radial-gradient(ellipse at 75% 42%, color-mix(in oklch,var(--primary) 12%,transparent), transparent 66%);pointer-events:none}.ugc-page .ugc-panel{background:linear-gradient(145deg, color-mix(in oklch,var(--primary) 5%,var(--surface,#111)), var(--background));border:1px solid color-mix(in oklch,var(--primary) 22%,var(--border))}.ugc-page .ugc-hero-frame{aspect-ratio:4/5;border:1px solid color-mix(in oklch,var(--primary) 50%,transparent);max-width:340px;box-shadow:0 0 70px color-mix(in oklch,var(--primary) 12%,transparent), inset 0 0 25px color-mix(in oklch,var(--primary) 5%,transparent);border-radius:26px;margin-inline:auto;padding:12px;transform:rotate(3deg)}.ugc-page .ugc-hero-inner{background:radial-gradient(circle at 65% 35%, color-mix(in oklch,var(--primary) 27%,transparent), transparent 60%), linear-gradient(150deg,#25221d,#0d0d0e 70%);border-radius:16px;flex-direction:column;justify-content:space-between;height:100%;padding:20px;display:flex}.ugc-page .ugc-stage-tag{border:1px solid color-mix(in oklch,var(--primary) 55%,transparent);color:var(--primary);letter-spacing:.12em;border-radius:5px;padding:5px 9px;font-size:.65rem;font-weight:700;display:inline-block}.ugc-page .ugc-choice{border:1px solid var(--border);min-height:44px;color:var(--muted-foreground);border-radius:6px;justify-content:center;align-items:center;gap:8px;padding:10px 16px;font-size:.875rem;font-weight:600;transition:background .2s,border-color .2s,color .2s;display:inline-flex}.ugc-page .ugc-choice:hover,.ugc-page .ugc-choice[aria-pressed=true]{border-color:var(--primary);background:color-mix(in oklch,var(--primary) 14%,var(--background));color:var(--foreground)}.ugc-page .ugc-choice:focus-visible,.ugc-page .ugc-scene:focus-visible,.ugc-page .ugc-timeline-step:focus-visible{outline:2px solid var(--primary);outline-offset:3px}.ugc-page .ugc-phone{background:var(--background);border:2px solid color-mix(in oklch,var(--primary) 53%,var(--border));box-shadow:0 16px 60px #0008,0 0 60px color-mix(in oklch,var(--primary) 10%,transparent);border-radius:26px;padding:8px}.ugc-page .ugc-phone-top{color:var(--muted-foreground);letter-spacing:.04em;justify-content:space-between;align-items:center;gap:8px;padding:12px 10px 10px;font-size:9px;display:flex}.ugc-page .ugc-dot{background:var(--primary);border-radius:50%;width:7px;height:7px}.ugc-page .ugc-phone-screen{background:radial-gradient(circle at 50% 43%,color-mix(in oklch,var(--primary) 18%,transparent),transparent 65%),linear-gradient(155deg,#21201b,#0b0b0d);border-radius:13px;justify-content:center;align-items:center;min-height:350px;animation:.35s ease-out ugc-reveal;display:flex;position:relative;overflow:hidden}.ugc-page .ugc-phone-screen:after{content:"";opacity:.35;background:repeating-linear-gradient(0deg,transparent,transparent 28px,color-mix(in oklch,var(--primary) 10%,transparent) 29px);pointer-events:none;position:absolute;inset:0}.ugc-page .ugc-orbit{background:radial-gradient(circle,color-mix(in oklch,var(--primary) 19%,transparent),transparent);border-radius:50%;place-items:center;width:125px;height:125px;display:grid;position:absolute;top:18%;left:50%;transform:translate(-50%)}.ugc-page .ugc-orbit-ring{border:1px dashed color-mix(in oklch,var(--primary) 60%,transparent);border-radius:50%;animation:18s linear infinite ugc-spin;position:absolute;inset:0}.ugc-page .ugc-timeline{gap:5px;padding:14px 12px 0;display:flex}.ugc-page .ugc-timeline-step{background:color-mix(in oklch,var(--primary) 25%,var(--border));border-radius:10px;flex:1;height:6px}.ugc-page .ugc-timeline-step[aria-pressed=true]{background:var(--primary)}.ugc-page .ugc-detail{border:1px solid var(--border);background:var(--surface,#121212);border-radius:6px;padding:17px}.ugc-page .ugc-detail>span{color:var(--primary);letter-spacing:.09em;text-transform:uppercase;font-size:.7rem;font-weight:700;display:block}.ugc-page .ugc-detail p{color:var(--muted-foreground);margin-top:10px;font-size:.875rem;line-height:1.65}.ugc-page .ugc-scene{border:1px solid var(--border);text-align:left;border-radius:6px;flex-direction:column;align-items:start;gap:5px;min-height:68px;padding:12px;display:flex}.ugc-page .ugc-scene>span{color:var(--muted-foreground);font-size:.65rem}.ugc-page .ugc-scene>strong{font-size:.75rem}.ugc-page .ugc-scene[aria-pressed=true]{border-color:var(--primary);background:color-mix(in oklch,var(--primary) 12%,var(--background))}@keyframes ugc-spin{to{transform:rotate(360deg)}}@keyframes ugc-reveal{0%{opacity:.5;transform:translateY(4px)}to{opacity:1;transform:none}}@media (width<=639px){.ugc-page .ugc-hero-frame{max-width:260px;transform:none}.ugc-page .ugc-phone-screen{min-height:300px}}@media (prefers-reduced-motion:reduce){.ugc-page .ugc-orbit-ring,.ugc-page .ugc-phone-screen{animation:none}.ugc-page .ugc-choice{transition:none}}.web-development .web-art-frame{fill:var(--background);stroke:var(--primary);stroke-opacity:.55}.web-development .web-art-line{fill:none;stroke:var(--muted-foreground);stroke-width:2px;stroke-opacity:.5;stroke-linecap:round}.web-development .web-art-headline{stroke:var(--foreground);stroke-width:9px;stroke-linecap:round}.web-development .web-art-muted{fill:var(--secondary)}.web-development .web-art-dot{fill:var(--primary)}.web-development .web-art-button{fill:none;stroke:var(--primary-foreground);stroke-width:2px;stroke-linecap:round}.web-development .web-gold-stop{stop-color:var(--primary)}.web-development .web-light-stop{stop-color:var(--hero-gold-light)}.web-development .web-art-connector{fill:none;stroke:var(--primary);stroke-width:1.5px;stroke-dasharray:5 8;animation:12s linear infinite web-connection}.web-development .web-app-float{animation:7s ease-in-out infinite web-app-float}.web-development .web-concept-panel{animation:.3s ease-out web-concept-reveal}@keyframes web-connection{to{stroke-dashoffset:-130px}}@keyframes web-app-float{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}@keyframes web-concept-reveal{0%{opacity:.4;transform:translateY(4px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){.web-development .web-art-connector,.web-development .web-app-float,.web-development .web-concept-panel{animation:none}}
