.dc-hardware{position:relative;isolation:isolate;width:100%;margin:0;line-height:0}
.dc-hardware__plate{display:block;width:100%;height:auto;position:relative;z-index:0;pointer-events:none}
.dc-hardware__display{position:absolute;z-index:1;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#ffffff50 transparent;background:#0d0c10;line-height:0;outline-offset:5px}
.dc-hardware__display img{display:block;width:100%;height:auto;max-height:none;object-fit:initial}
.dc-hardware--laptop{aspect-ratio:3/2}
.dc-hardware--laptop .dc-hardware__display{left:15.49%;top:10.94%;width:69.01%;height:63.77%;border-radius:.5%}
.dc-hardware--phone{aspect-ratio:1086/1448}
.dc-hardware--phone .dc-hardware__display{left:24.86%;top:8.77%;width:50.28%;height:82.94%;border-radius:10% / 4.55%}
.dc-device-figure{margin:0;min-width:0}
.dc-device-figure>figcaption{display:flex;justify-content:space-between;gap:25px;align-items:start;font:11px/1.7 var(--dc-ui,Arial,sans-serif);color:inherit;margin:8px 0 0;padding:0 20px}
.dc-device-figure>figcaption>a{white-space:nowrap;border-bottom:1px solid currentColor}
.dc-device-figure .dc-view-source{position:absolute;width:1px;height:1px;clip-path:inset(50%);overflow:hidden}
.dc-device-stage{background:#e5e3dc;padding:10px 0 20px;border-radius:14px}
.dc-case--herstartup .dc-device-stage{background:#ddd3f2}
.dc-portal-band .dc-device-stage{background:#c9b6f0}
.dc-device-pair{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;align-items:start}
.dc-device-pair .dc-hardware--phone{width:min(100%,620px);margin:auto}
.dc-device-pair .dc-device-figure>figcaption{padding-inline:15%;margin-top:15px;flex-direction:column;gap:8px}
.dc-device-stage .dc-device-figure>figcaption{margin-inline:13%;padding:0}
.dc-detail-spread{display:grid;grid-template-columns:1.15fr .85fr;gap:30px;align-items:start;margin-top:45px}
.dc-detail-spread .dc-figure figcaption{line-height:1.7}
.dc-task-heading{margin:0 0 24px!important;font-size:24px!important;line-height:1.3!important;letter-spacing:-.03em}
.dc-task-intro{font-size:14px;line-height:1.85;margin:0 0 30px}
.dc-screen-panel--mobile{width:min(100%,650px)}
.dc-screen-panel--mobile .dc-device-figure>figcaption{margin-inline:18%}
.dc-screen-panel--desktop .dc-device-stage{padding-top:0}
.dc-native-full{margin-top:38px}
.dc-native-full summary{display:flex;justify-content:space-between;align-items:center;font-size:12px;padding:18px 0;border-block:1px solid var(--dc-line);cursor:pointer;list-style:none}
.dc-native-full summary::after{content:'+';font-size:20px}
.dc-native-full[open] summary::after{content:'−'}
.dc-native-full>.dc-figure{margin-top:24px}
.dc-code-display{overflow:hidden;line-height:normal}
.dc-code-display iframe{display:block;border:0;max-width:none;position:absolute;left:0;top:0;transform-origin:top left;background:white}
.dc-project-links{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:-20px 0 48px;color:var(--t-bright,#fff)}
.dc-project-links>a{display:inline-flex;align-items:center;justify-content:center;padding:14px 23px;border:1px solid currentColor;border-radius:40px;font-size:13px;line-height:1.4}
.dc-project-links>a:first-child{background:var(--t-bright,#fff);color:var(--t-dark,#111)}
.dc-live-cover{border-radius:24px;background:#e5e3dd;padding:55px 0 24px;overflow:hidden;color:#111}
.dc-case--herstartup .dc-live-cover{background:#ddd0fa;color:#241637}
.dc-live-cover__head{display:flex;justify-content:space-between;align-items:center;gap:35px;padding:0 7%}
.dc-live-cover__head>img{display:block;width:240px;height:auto;max-height:110px;object-fit:contain}
.dc-live-cover__head>p{font:400 27px/1.3 var(--dc-ui);letter-spacing:-.035em;color:inherit;margin:0;text-align:right}
.dc-live-cover__desktop{max-width:1150px;margin:auto}
.dc-live-cover .dc-device-figure>figcaption{margin-inline:16%;padding:0;font-size:11px}
.dc-live-cover__mobile{display:none}
@media(max-width:700px){
 .dc-device-stage{margin-inline:-18px;border-radius:7px;padding-bottom:18px}
 .dc-device-stage .dc-hardware--laptop{width:112%;margin-left:-6%}
 .dc-device-figure>figcaption{font-size:10px;gap:15px}
 .dc-device-stage .dc-device-figure>figcaption{margin-inline:8%}
 .dc-device-pair{grid-template-columns:1fr;gap:40px;margin-inline:-20px}
 .dc-device-pair .dc-hardware--phone{width:130%;margin-left:-15%;max-width:none}
 .dc-device-pair .dc-device-figure>figcaption{margin-top:-10px;padding-inline:20%;font-size:11px}
 .dc-detail-spread{grid-template-columns:1fr;gap:36px}
 .dc-screen-panel--mobile .dc-hardware--phone{width:130%;margin-left:-15%}
 .dc-screen-panel--mobile .dc-device-figure>figcaption{margin-inline:12%;padding:0}
 .dc-project-links{margin-top:-10px;margin-bottom:35px;gap:10px}.dc-project-links>a{font-size:11px;padding:12px 17px}
 .dc-live-cover{padding-top:30px;border-radius:16px;padding-bottom:32px}
 .dc-live-cover__head{display:block;padding-inline:30px}.dc-live-cover__head>img{width:180px;max-height:80px}.dc-live-cover__head>p{font-size:24px;text-align:left;margin:25px 0 0}
 .dc-live-cover__desktop{display:none}.dc-live-cover__mobile{display:block;width:155%;margin-left:-27.5%;margin-top:20px}
 .dc-live-cover .dc-device-figure>figcaption{margin-inline:26%;font-size:10px;flex-direction:column;gap:8px}
}