/* Scoped native portfolio, shared by WordPress and Studio iframe. */
.studio-portfolio{--sp-accent:#58f5e2;--sp-secondary:#9d78ff;position:relative;isolation:isolate;color:#edf5ff;background:radial-gradient(ellipse at 90% 8%,#673db827,transparent 42%),radial-gradient(ellipse at 2% 28%,#00b7b31a,transparent 38%),#060b16;font:16px/1.7 Inter,"Noto Sans TC",system-ui,sans-serif;overflow:hidden}.studio-portfolio *{box-sizing:border-box}.studio-portfolio [hidden]{display:none!important}.studio-portfolio a{color:inherit;text-decoration:none}.studio-portfolio button,.studio-portfolio input{font:inherit}.studio-portfolio button{cursor:pointer}.studio-portfolio :focus-visible{outline:2px solid var(--sp-accent);outline-offset:5px}.studio-portfolio::before{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(#8aafef08 1px,transparent 1px),linear-gradient(90deg,#8aafef08 1px,transparent 1px);background-size:64px 64px;mask-image:linear-gradient(#000,transparent 65%)}.sp-shell{max-width:1368px;margin:auto;padding:64px 44px 48px}.sp-hero{display:grid;grid-template-columns:1.1fr 1fr;gap:32px;align-items:center;min-height:580px;padding-bottom:72px}.sp-eyebrow{font:11px/1.6 ui-monospace,monospace;letter-spacing:2px;color:var(--sp-accent);margin:0 0 28px}.sp-signal{display:inline-block;width:6px;height:6px;background:var(--sp-accent);box-shadow:0 0 14px var(--sp-accent);margin-right:8px}.sp-slash{opacity:.45;margin:0 8px}.studio-portfolio .sp-hero-title{font-size:76px;line-height:1.16;letter-spacing:-4px;font-weight:800;margin:0 0 30px;color:#f4f7ff}.sp-hero-title::first-line{color:var(--sp-accent)}.studio-portfolio .sp-intro{font-size:16px;color:#a4b3ca;line-height:1.95;margin:0 0 32px;max-width:500px}.sp-explore{display:inline-flex;align-items:center;justify-content:space-between;gap:46px;border:1px solid #58f5e266;background:#58f5e20c;border-radius:3px;padding:12px 20px;transition:.2s}.sp-explore:hover{background:#58f5e225;box-shadow:0 0 30px #58f5e21a}.sp-explore span:last-child{font-size:24px;color:var(--sp-accent)}.sp-hero-meta{display:flex;gap:30px;margin-top:40px;font:10px ui-monospace,monospace;letter-spacing:1.5px;color:#7b8ba5}.sp-hero-meta b{font-size:20px;color:#edf5ff;font-weight:400;letter-spacing:0;margin-right:8px}.sp-visual{position:relative;border:1px solid #8c9ec528;background:linear-gradient(135deg,#78adff05,#0000);border-radius:4px;aspect-ratio:1;max-width:530px;width:100%;justify-self:end;clip-path:polygon(0 0,calc(100% - 26px) 0,100% 26px,100% 100%,26px 100%,0 calc(100% - 26px))}.sp-visual-top,.sp-visual-bottom{position:absolute;left:24px;right:24px;display:flex;justify-content:space-between;font:9px ui-monospace,monospace;letter-spacing:2px;color:#8395b5}.sp-visual-top{top:24px}.sp-visual-bottom{bottom:24px}.sp-barcode{color:var(--sp-accent);font-size:18px;line-height:9px}.sp-orbit{position:absolute;inset:14%;display:grid;place-items:center;perspective:700px}.sp-orbit-grid{position:absolute;inset:-9%;background:radial-gradient(circle,#58f5e21a 1px,transparent 1px);background-size:14px 14px;mask-image:radial-gradient(circle,#000,transparent 68%)}.sp-ring{position:absolute;border:1px solid #58f5e247;border-radius:50%;width:95%;height:95%;box-shadow:inset 0 0 30px #58f5e208,0 0 20px #58f5e208}.sp-ring-outer{transform:rotateX(58deg) rotateZ(-32deg);border-top:2px solid var(--sp-accent);animation:sp-orbit-a 25s linear infinite}.sp-ring-mid{width:77%;height:77%;transform:rotateY(55deg) rotateZ(30deg);border-left:2px solid var(--sp-secondary);border-color:#9d78ff66}.sp-ring-inner{width:60%;height:60%;border-style:dashed;transform:rotateX(15deg)}.sp-orbit-axis{position:absolute;background:#8b9eb11c}.sp-axis-x{width:130%;height:1px;transform:rotate(-23deg)}.sp-axis-y{height:130%;width:1px;transform:rotate(-23deg)}.sp-orbit-core{position:relative;display:flex;flex-direction:column;align-items:center;gap:10px}.sp-orbit-core strong{font-size:28px;letter-spacing:5px;color:#f4f7ff;text-shadow:0 0 22px #58f5e255}.sp-orbit-core small{font:7px ui-monospace,monospace;letter-spacing:2px;color:#a1adca}.sp-core-cube{display:block;width:52px;height:52px;transform:rotate(30deg) skewY(-12deg);border:1px solid var(--sp-accent);background:linear-gradient(135deg,#58f5e24d,#9d78ff1a);box-shadow:10px -10px 0 #58f5e20c,-10px 10px 0 #9d78ff0c,0 0 60px #58f5e233;margin-bottom:18px}.sp-coordinate{position:absolute;font:8px ui-monospace,monospace;letter-spacing:2px;color:#a6b9d7;background:#0a1121;padding:4px 7px;border:1px solid #91a8d122}.sp-coord-a{top:4%;left:0}.sp-coord-b{top:20%;right:-12%}.sp-coord-c{bottom:5%;right:0}.sp-coord-d{bottom:24%;left:-10%}.sp-satellite{position:absolute;top:10%;left:50%;height:6px;width:6px;border-radius:50%;background:var(--sp-accent);box-shadow:0 0 20px var(--sp-accent)}.sp-workspace{scroll-margin-top:24px;border-top:1px solid #7e9ccd26;padding-top:44px}.sp-section-heading{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:28px}.sp-section-heading .sp-eyebrow{margin-bottom:10px;color:#8293af}.studio-portfolio h2{font-size:34px;line-height:1.4;letter-spacing:-1px;color:#f1f6ff;margin:0}.sp-heading-dot{color:var(--sp-accent);margin-left:6px}.sp-section-note{font-size:12px;color:#7c8eac;margin:0 0 6px}.sp-controls{display:flex;align-items:center;justify-content:space-between;gap:18px}.sp-filters{display:flex;gap:6px;flex-wrap:wrap}.studio-portfolio .sp-filter{display:flex;align-items:center;gap:10px;background:transparent;color:#9baac2;border:1px solid transparent;border-radius:4px;padding:10px 14px;font-size:13px;white-space:nowrap;transition:.2s}.studio-portfolio .sp-filter:hover{color:#fff;background:#98b4e20a}.studio-portfolio .sp-filter[aria-pressed=true]{background:#58f5e210;border-color:#58f5e259;color:var(--sp-accent)}.sp-filter-count{font:10px ui-monospace,monospace;opacity:.65}.sp-search{display:flex;align-items:center;gap:8px;border:1px solid #8fa4c52e;background:#10182888;border-radius:4px;min-width:240px;padding:9px 12px;color:#8a9ab4}.sp-search-icon{font-size:24px;line-height:1}.studio-portfolio .sp-search input{background:transparent;color:#edf5ff;width:100%;min-width:0;border:0;box-shadow:none;padding:0;font-size:12px;outline:none}.sp-search:focus-within{border-color:var(--sp-accent)}.sp-search input::placeholder{color:#6e809f}.studio-portfolio .sp-clear{padding:0 3px;color:#b5c6e1;background:none;border:0;font-size:20px;line-height:1}.sp-results-line{display:flex;justify-content:space-between;gap:16px;margin:26px 0 16px;font:10px ui-monospace,monospace;letter-spacing:1px;color:#6e819f}.sp-results-line [role=status]{letter-spacing:.3px}.sp-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.sp-project-card{margin:0;border:1px solid #8ca8cf29;background:linear-gradient(140deg,#111e30,#0a111f);border-radius:8px;overflow:hidden;min-width:0;transition:transform .25s,border-color .25s,box-shadow .25s}.sp-project-card:hover{transform:translateY(-4px);border-color:#58f5e26b;box-shadow:0 12px 40px #0005}.sp-card-link{display:flex;height:100%;flex-direction:column}.sp-card-media{position:relative;height:210px;overflow:hidden;background:radial-gradient(circle at 50% 40%,#263a52,#0b1120);display:grid;place-items:center;border-bottom:1px solid #7a9ac222}.sp-card-media img{position:absolute;inset:0;width:100%;height:100%;min-height:0;object-fit:contain;transition:transform .5s}.sp-project-card:hover .sp-card-media img{transform:scale(1.025)}.sp-card-number{position:absolute;top:14px;left:14px;background:#060b16cc;color:#a5bbd8;border:1px solid #b1c9e52e;padding:3px 9px;font:10px ui-monospace,monospace}.sp-card-scanline{position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,transparent,var(--sp-accent),transparent);opacity:.5}.sp-no-image{font-size:72px;color:var(--sp-accent)}.sp-card-body{padding:24px;display:flex;flex-direction:column;flex:1}.sp-card-topline{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.sp-card-category{font-size:10px;letter-spacing:2px;color:var(--sp-accent)}.sp-card-arrow{font-size:20px;color:#7a8da9}.studio-portfolio .sp-card-body h3{font-size:21px;line-height:1.45;color:#edf4ff;margin:0 0 12px;font-weight:650;letter-spacing:-.5px;overflow-wrap:anywhere}.studio-portfolio .sp-card-summary{font-size:13px;line-height:1.85;color:#94a5be;margin:0 0 20px}.sp-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto;margin-bottom:24px}.sp-tags span{font:10px ui-monospace,monospace;padding:4px 8px;color:#96aaca;border:1px solid #8facd529;border-radius:3px}.sp-card-cta{display:flex;justify-content:space-between;border-top:1px solid #8aa5c920;padding-top:14px;font-size:11px;color:#b5c6de}.sp-card-cta span{color:var(--sp-accent)}.sp-featured{grid-column:span 2}.sp-featured .sp-card-link{display:grid;grid-template-columns:1.1fr 1fr}.sp-featured .sp-card-media{height:100%;min-height:360px;border-right:1px solid #7a9ac222;border-bottom:0}.sp-featured .sp-card-body{padding:30px}.sp-featured .sp-card-body h3{font-size:28px}.studio-portfolio:not([data-active-filter=all]) .sp-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.studio-portfolio:not([data-active-filter=all]) .sp-featured{grid-column:auto}.studio-portfolio:not([data-active-filter=all]) .sp-featured .sp-card-link{display:flex}.studio-portfolio:not([data-active-filter=all]) .sp-featured .sp-card-media{height:240px;min-height:0;border-right:0}.studio-portfolio:not([data-active-filter=all]) .sp-featured .sp-card-body h3{font-size:21px}.sp-empty{text-align:center;padding:72px 20px;border:1px dashed #8da9d231;border-radius:8px;background:#0c152380}.sp-empty-symbol{display:block;color:var(--sp-accent);font-size:40px}.studio-portfolio .sp-empty h3{color:#d7e6ff;font-size:22px;margin:16px 0 8px}.sp-empty p{font-size:13px;color:#8a9ebc;margin:0}.sp-endnote{display:flex;align-items:center;gap:16px;border-top:1px solid #8ba6cf26;margin-top:64px;padding-top:28px}.sp-end-mark{font-size:24px;color:var(--sp-accent)}.sp-endnote p{font-size:14px;letter-spacing:1px;color:#aebbd0;margin:0}.sp-end-code{margin-left:auto;color:#61738f;font:9px ui-monospace,monospace;letter-spacing:1px}.sp-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@keyframes sp-orbit-a{from{transform:rotateX(58deg) rotateZ(-32deg)}to{transform:rotateX(58deg) rotateZ(328deg)}}
@media(max-width:1024px){.sp-shell{padding:48px 28px}.sp-hero{min-height:500px}.studio-portfolio .sp-hero-title{font-size:58px;letter-spacing:-3px}.sp-orbit-core strong{font-size:22px;letter-spacing:3px}.sp-orbit-core small{font-size:6px}.sp-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.sp-featured{grid-column:span 2}.sp-controls{align-items:stretch;flex-direction:column}.sp-search{max-width:380px}.sp-visual-top,.sp-visual-bottom{left:14px;right:14px;font-size:7px}.sp-hero-meta{gap:16px}}
@media(max-width:600px){.sp-shell{padding:36px 20px}.sp-hero{grid-template-columns:1fr;gap:36px;padding-bottom:40px;min-height:0}.studio-portfolio .sp-hero-title{font-size:46px;letter-spacing:-2px;margin-bottom:24px}.studio-portfolio .sp-intro{font-size:14px}.sp-hero .sp-eyebrow{font-size:9px;letter-spacing:1.5px;margin-bottom:24px}.sp-hero-meta{margin-top:28px}.sp-visual{max-width:360px;justify-self:center}.sp-orbit-core strong{font-size:24px}.sp-section-heading{display:block}.sp-section-note{margin-top:12px}.studio-portfolio h2{font-size:29px}.studio-portfolio .sp-filter{padding:8px 9px;gap:7px;font-size:12px}.sp-filters{gap:4px}.sp-search{max-width:none;min-width:0}.sp-grid,.studio-portfolio:not([data-active-filter=all]) .sp-grid{grid-template-columns:1fr}.sp-featured{grid-column:auto}.sp-featured .sp-card-link{display:flex}.sp-featured .sp-card-media{height:230px;min-height:0;border-right:0}.sp-featured .sp-card-body{padding:24px}.sp-featured .sp-card-body h3{font-size:23px}.sp-card-media{height:220px}.sp-results-line{font-size:9px;letter-spacing:0}.sp-endnote{flex-wrap:wrap;margin-top:40px}.sp-end-code{width:100%;margin-left:40px}.sp-hero-meta{font-size:8px}.sp-coordinate{font-size:7px}.sp-workspace{padding-top:32px}}
@media(prefers-reduced-motion:reduce){.studio-portfolio *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}