/* Personal Video Editing page. These rules do not change the other skill pages. */
.creative-lab.lab-subpage .editing-personal { --world-accent:#b6a5ff; padding:130px clamp(22px,7vw,110px) 100px; overflow:clip; }
.creative-lab.lab-subpage .editing-personal::after,
.creative-lab.lab-subpage .editing-personal .detail-content::before,
.creative-lab.lab-subpage .editing-personal h1::after { content:none; }
.editing-personal > section { max-width:1200px; width:100%; margin-left:auto; margin-right:auto; }
.editing-personal .world-hero { padding:0 0 78px; }
.editing-personal .back-link { display:inline-block; margin-bottom:38px; }
.editing-personal .detail-icon { margin-bottom:28px; }
.creative-lab.lab-subpage .editing-personal h1 { max-width:none; margin:0; font-size:clamp(56px,9vw,120px); line-height:.97; letter-spacing:-.065em; }
.editing-lead { max-width:875px; margin-top:30px; color:#bbb8cb; font-size:clamp(17px,1.5vw,21px); line-height:1.75; }
.editing-lead p { margin:0 0 18px; }
.editing-since { display:flex; align-items:center; gap:11px; margin-top:27px; color:#c5b9fa; font-size:10px; letter-spacing:.16em; font-weight:700; }
.editing-since > span { width:20px; height:1px; background:currentColor; }
.editing-since p { margin:0; }
.editing-personal .editing-method { grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); align-items:start; gap:clamp(28px,5vw,64px); padding:clamp(24px,4vw,56px); background:linear-gradient(135deg,#181426,#0e0e18 68%); }
.editing-method .edit-visual { position:sticky; top:110px; min-height:0; background:linear-gradient(145deg,#30204566,#0a0b14 70%); }
.editing-method .edit-preview { min-height:265px; background:linear-gradient(135deg,#8570dd22,transparent 70%),repeating-linear-gradient(90deg,transparent 0 57px,#ffffff08 58px 59px); }
.editing-method .edit-preview::after { inset:30px; border-color:#b6a5ff55; }
.editing-method .edit-preview strong { bottom:33px; right:32px; font-size:clamp(32px,4.5vw,59px); letter-spacing:-.055em; line-height:1; text-align:left; }
.editing-method-copy { min-width:0; }
.editing-label { margin:0 0 18px; color:#b9aaf5; font-size:10px; font-weight:800; letter-spacing:.17em; line-height:1.6; }
.editing-personal :is(.editing-method,.editing-collaborations,.editing-projects,.editing-closing) h2 { margin:0; color:#f4f2ff; font-size:clamp(30px,3.8vw,49px); line-height:1.12; letter-spacing:-.05em; }
.editing-personal .editing-method h2 { font-size:clamp(29px,3.2vw,42px); }
.editing-steps { list-style:none; counter-reset:editing-step; padding:0; margin:34px 0 0; }
.editing-steps li { position:relative; counter-increment:editing-step; border-top:1px solid #383348; padding:22px 0 24px 44px; }
.editing-steps li::before { content:"0" counter(editing-step); position:absolute; left:0; top:27px; color:#b6a5ff; font:11px/1.5 Consolas,monospace; }
.editing-steps h3 { margin:0 0 10px; font-size:19px; letter-spacing:-.025em; line-height:1.3; }
.editing-steps p,.editing-method-note { margin:0; color:#bab5c9; font-size:15px; line-height:1.8; }
.editing-method-note { padding-left:18px; border-left:2px solid #9b88e2; }
.editing-collaborations { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:clamp(30px,6vw,90px); padding-top:105px; }
.editing-prose { color:#bcb7ca; font-size:16px; line-height:1.85; }
.editing-prose p { margin:0 0 20px; }
.editing-prose p:last-child { margin-bottom:0; }
.editing-projects { padding-top:95px; }
.editing-projects-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:32px; }
.editing-projects-heading > p { max-width:320px; margin:0; color:#aaa4ba; font-size:14px; line-height:1.75; }
.editing-gallery { display:grid; gap:30px; margin-top:38px; }
.editing-gallery figure { margin:0; min-width:0; border:1px solid #444056; background:#101018; }
.editing-image-link { display:block; overflow:hidden; line-height:0; cursor:zoom-in; }
.editing-gallery img { display:block; width:100%; height:auto; object-fit:contain; }
.editing-gallery figcaption { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; border-top:1px solid #393347; padding:16px 20px; }
.editing-gallery figcaption > span { color:#a99dd2; font:10px/1.5 Consolas,monospace; letter-spacing:.12em; }
.editing-gallery figcaption a { display:inline-flex; align-items:center; gap:16px; padding:5px 0; color:#e1d9ff; font-size:12px; font-weight:600; text-decoration:none; }
.editing-gallery figcaption a:hover { color:#b9a7ff; text-decoration:underline; }
.editing-gallery figure:focus-within { border-color:#baa7ff; }
.editing-closing { margin-top:100px; padding-top:48px; border-top:1px solid #42374f; }
.editing-closing h2 { max-width:760px; }
.editing-closing .editing-prose { max-width:850px; margin-top:28px; }
.editing-personal :is(a,button):focus-visible,.editing-viewer :is(a,button,[tabindex]):focus-visible { outline:2px solid #b6a5ff; outline-offset:5px; }

/* Native dialog supplies modal focus containment and Escape support. */
.editing-viewer { box-sizing:border-box; width:min(1600px,94vw); max-width:94vw; max-height:92dvh; margin:auto; padding:0; border:1px solid #84749f; color:#f2edff; background:#111019; box-shadow:10px 10px 0 #7563a129; font-family:Inter,Arial,sans-serif; }
.editing-viewer[open] { display:flex; flex-direction:column; }
.editing-viewer::backdrop { background:#05050bed; backdrop-filter:blur(8px); }
.editing-viewer-toolbar { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; flex-shrink:0; gap:14px; padding:16px 20px; border-bottom:1px solid #393347; }
.editing-viewer-toolbar h2 { margin:0; color:#efeaff; font-size:17px; line-height:1.4; letter-spacing:-.02em; }
.editing-viewer-toolbar > div { display:flex; align-items:center; gap:9px; }
.editing-viewer-toolbar :is(button,a) { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:40px; padding:8px 13px; border:1px solid #655878; color:#e1d6ff; background:#201b2e; font:600 11px/1.4 Inter,Arial,sans-serif; text-decoration:none; cursor:pointer; }
.editing-viewer-toolbar button:hover,.editing-viewer-toolbar a:hover { border-color:#b9a2f8; background:#312540; }
.editing-viewer-toolbar #editing-viewer-close { min-width:40px; font-size:27px; line-height:1; }
.editing-viewer-canvas { min-height:0; overflow:auto; overscroll-behavior:contain; background:#08090c; }
.editing-viewer-canvas img { display:block; width:100%; height:auto; max-width:100%; }
.editing-viewer-canvas.is-zoomed { min-height:280px; height:65dvh; }
.editing-viewer-canvas.is-zoomed img { width:auto; max-width:none; height:auto; }
.editing-viewer > p { flex-shrink:0; margin:0; padding:14px 20px; color:#aaa1ba; font-size:12px; line-height:1.6; border-top:1px solid #393347; }
.editing-viewer [hidden] { display:none !important; }
@media (max-width:900px) {
  .editing-personal .editing-method { grid-template-columns:1fr; }
  .editing-method .edit-visual { position:relative; top:auto; max-width:420px; width:100%; }
  .editing-projects-heading { display:block; }
  .editing-projects-heading > p { max-width:560px; margin-top:22px; }
}
@media (max-width:700px) {
  .creative-lab.lab-subpage .editing-personal { padding:105px 22px 65px; }
  .creative-lab.lab-subpage .editing-personal h1 { font-size:clamp(52px,14vw,88px); }
  .editing-personal .world-hero { padding-bottom:54px; }
  .editing-personal .editing-method { padding:22px; gap:34px; }
  .editing-method .edit-preview { min-height:190px; }
  .editing-method .edit-preview strong { font-size:39px; right:22px; bottom:25px; }
  .editing-method .edit-preview::after { inset:22px; }
  .editing-method .edit-tracks { gap:7px; padding:15px; }
  .editing-steps li { padding-left:32px; }
  .editing-steps li::before { font-size:10px; }
  .editing-steps h3 { font-size:18px; }
  .editing-collaborations { grid-template-columns:1fr; gap:25px; padding-top:70px; }
  .editing-projects { padding-top:70px; }
  .editing-gallery { gap:22px; margin-top:26px; }
  .editing-gallery figcaption { padding:12px; gap:8px; }
  .editing-gallery figcaption a { min-height:32px; }
  .editing-closing { margin-top:70px; padding-top:35px; }
  .editing-prose { font-size:15px; }
  .editing-viewer { width:96vw; max-width:96vw; max-height:94dvh; }
  .editing-viewer-toolbar { padding:13px; gap:10px; }
  .editing-viewer-toolbar h2 { width:100%; font-size:16px; }
  .editing-viewer-toolbar > div { width:100%; justify-content:space-between; gap:5px; }
  .editing-viewer-toolbar :is(button,a) { min-height:44px; padding:7px 9px; font-size:10px; }
  .editing-viewer > p { padding:12px 13px; font-size:11px; }
}