
  @font-face{
    font-family:"LYS Sans";
    font-style:normal;
    font-weight:400;
    font-display:swap;
    src:url(/fonts/lys-sans-400.woff2) format('woff2');
    unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
  }
  @font-face{
    font-family:"LYS Sans";
    font-style:normal;
    font-weight:700;
    font-display:swap;
    src:url(/fonts/lys-sans-700.woff2) format('woff2');
    unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
  }
  :root{
    --bg:#ffffff;
    --ink:#111111;
    --ink-soft:#555555;
    --ink-faint:#999999;
    --line:#e2e2e2;
    --line-strong:#cfcfcf;
    --accent:#111111;
    --sans:"LYS Sans",-apple-system,BlinkMacSystemFont,"Helvetica Neue",Helvetica,Arial,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;
    --sans-helvetica:"LYS Sans","Helvetica Neue",Helvetica,Arial,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;
    --active-font-family:var(--sans);
    --content-max-width:640px;
    --ui-font-style:normal;
    --mono:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace;
    --content-font-size:15px;
    --content-letter-spacing:0em;
    --content-font-weight:400;
    --content-text-align:left;
    --page-padding:32px;
    --frame-gap:28px;
    --frame-cols:2;
    --detail-margin:32px;
    --caption-font-size:12px;
    --frame-title-size:14px;
    --text-list-title-size:21px;
    --text-list-top-space:40px;
    --text-list-item-gap:22px;
    --contact-font-size:23px;
    --contact-top-space:24px;
    --photo-gap:16px;
  }
  *{box-sizing:border-box;margin:0;padding:0;}
  html,body{background:var(--bg);color:var(--ink); overflow-x:hidden;}
  body{font-family:var(--active-font-family);line-height:1.6;-webkit-font-smoothing:antialiased;min-height:100%;}
  a{color:inherit;text-decoration:none;}
  button{font-family:var(--active-font-family);cursor:pointer;}
  img{max-width:100%;display:block;}
  ::selection{background:#111;color:#fff;}

  .shell{max-width:1120px;margin:0 auto;padding:0 var(--page-padding);}

  /* ---------- header ---------- */
  header.site-head{
    border-bottom:1px solid var(--line);
    padding:26px 0;
    position:fixed; top:0; left:0; right:0; width:100%; background:rgba(255,255,255,.92); backdrop-filter:blur(6px); z-index:50;
  }
  body{padding-top:var(--header-height,90px);}
  .head-grid{display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:12px;}
  .head-spacer{grid-column:1;}
  .head-center{grid-column:2; justify-self:center; display:flex; align-items:center; gap:8px;}
  .site-name{
    font-size:19px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; white-space:nowrap;
    font-style:var(--ui-font-style);
  }
  .site-name-edit{
    background:none;border:1px solid var(--line-strong); border-radius:4px; width:22px;height:22px;
    font-size:11px; color:var(--ink-soft); display:none; align-items:center; justify-content:center; margin-left:8px;
  }
  .master-on .style-clickable{cursor:pointer; transition:outline-color .15s;}
  .master-on .style-clickable:hover{outline:1px dashed var(--line-strong); outline-offset:6px;}
  .master-on .site-name-edit{display:inline-flex;}
  nav.site-nav{
    grid-column:3; justify-self:end;
    display:flex; gap:26px;
  }
  nav.site-nav a{
    font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-soft);
    padding-bottom:3px; border-bottom:1px solid transparent; font-style:var(--ui-font-style);
  }
  nav.site-nav a:hover{color:var(--ink);}
  nav.site-nav a.active{color:var(--ink); border-bottom-color:var(--ink);}

  @media (max-width:640px){
    .head-grid{grid-template-columns:1fr; text-align:center; gap:14px;}
    .head-spacer{display:none;}
    .head-center{grid-column:1; justify-self:center;}
    nav.site-nav{grid-column:1; justify-self:center; gap:16px; flex-wrap:wrap; justify-content:center;}
  }

  /* ---------- page ---------- */
  main{min-height:60vh; padding:64px 0 120px;}
  .page-title{font-size:13px; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-faint); margin-bottom:36px;}

  /* ---------- CV ---------- */
  .cv-wrap{max-width:var(--content-max-width); position:relative;}
  .cv-text{font-size:var(--content-font-size); letter-spacing:var(--content-letter-spacing); font-weight:var(--content-font-weight); text-align:var(--content-text-align); color:var(--ink); white-space:pre-wrap; line-height:1.9;}
  .edit-fab{
    display:none; align-items:center; gap:6px; background:var(--ink); color:#fff; border:none;
    font-size:11px; letter-spacing:.08em; text-transform:uppercase; padding:9px 14px; border-radius:100px;
    margin-bottom:24px; font-style:var(--ui-font-style);
  }
  .master-on .edit-fab{display:inline-flex;}
  .edit-fab:hover{background:#000;}

  .grid-bleed{
    width:100vw; position:relative; left:50%; right:50%;
    margin-left:-50vw; margin-right:-50vw;
  }
  /* ---------- WORKS / TEXT grid ---------- */
  .col-grid{
    display:grid; grid-template-columns:repeat(var(--frame-cols),1fr); gap:var(--frame-gap);
  }
  @media (max-width:640px){ .col-grid{grid-template-columns:1fr;} }

  .frame{
    position:relative; aspect-ratio:3/2; background:#fafafa; border:1px solid var(--line);
    overflow:hidden; cursor:pointer;
  }
  .frame img{width:100%;height:100%;object-fit:cover;}
  .frame .placeholder-label{
    position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
    font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-faint);
  }
  .frame .hover-title{
    position:absolute; inset:0; background:rgba(255,255,255,.44);
    display:flex; align-items:center; justify-content:center; text-align:center; padding:16px;
    opacity:0; transition:opacity .25s ease;
  }
  .frame:hover .hover-title{opacity:1;}
  .frame.empty .hover-title{display:none;}
  .hover-title span{font-size:var(--frame-title-size); letter-spacing:.04em; font-weight:600; text-shadow:0 1px 4px rgba(255,255,255,.85), 0 0 12px rgba(255,255,255,.6);}

  /* ---------- SHOP ---------- */
  .shop-grid{
    display:grid; grid-template-columns:repeat(var(--frame-cols),1fr); gap:var(--frame-gap) calc(var(--frame-gap) + 8px);
  }
  @media (max-width:640px){ .shop-grid{grid-template-columns:repeat(2,1fr);} }
  .shop-card{position:relative; display:block; color:inherit;}
  .shop-thumb{
    position:relative; background:#fafafa; border:1px solid var(--line); overflow:hidden; aspect-ratio:1/1;
  }
  .shop-thumb img{width:100%; height:100%; object-fit:cover; display:block; transition:opacity .25s ease;}
  .shop-card:hover .shop-thumb img{opacity:.82;}
  .shop-thumb .placeholder-label{
    position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
    font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-faint);
  }
  .shop-sold-badge{
    position:absolute; left:0; bottom:0; padding:5px 10px; background:var(--ink); color:#fff;
    font-size:10px; letter-spacing:.14em;
  }
  .shop-info{padding:12px 2px 0;}
  .shop-name{font-size:var(--content-font-size); letter-spacing:.01em; line-height:1.45;}
  .shop-spec{font-size:var(--caption-font-size); color:var(--ink-soft); line-height:1.5; margin-top:4px;}
  .shop-edition{font-size:var(--caption-font-size); color:var(--ink-faint); margin-top:2px; font-family:var(--mono);}
  .shop-price{font-size:var(--content-font-size); margin-top:8px; letter-spacing:.02em;}
  .shop-price.sold{color:var(--ink-faint);}

  .buy-box{margin:36px auto 0; max-width:var(--content-max-width); padding:0 var(--detail-margin);}
  .buy-row{display:flex; gap:10px; flex-wrap:wrap;}
  .buy-btn{
    flex:1 1 200px; display:flex; align-items:center; justify-content:center; gap:8px;
    padding:15px 18px; border:1px solid var(--ink); background:var(--ink); color:#fff;
    font-size:14px; letter-spacing:.04em; text-align:center; transition:opacity .18s ease;
  }
  .buy-btn:hover{opacity:.82;}
  .buy-btn.alt{background:transparent; color:var(--ink);}
  .buy-btn .cur{font-size:12px; opacity:.72;}
  .buy-note{font-size:11px; color:var(--ink-faint); margin-top:14px; line-height:1.7;}
  .buy-soldout{
    padding:15px 18px; border:1px solid var(--line); color:var(--ink-faint);
    font-size:13px; letter-spacing:.12em; text-align:center;
  }
  .shop-specs-line{text-align:center; color:var(--ink-soft); font-size:var(--caption-font-size); margin-bottom:8px; line-height:1.7;}

  .frame-editctl{position:absolute; top:8px; right:8px; display:none; gap:6px; z-index:5;}
  .master-on .frame-editctl{display:flex;}
  .frame-editctl button{
    width:26px;height:26px;border-radius:5px;border:1px solid var(--line-strong); background:#fff; color:var(--ink);
    font-size:12px; display:flex; align-items:center; justify-content:center;
  }
  .frame-editctl button:hover{background:var(--ink); color:#fff; border-color:var(--ink);}

  .frame.add-tile{
    display:flex; align-items:center; justify-content:center; border:1.5px dashed var(--line-strong); background:#fff;
  }
  .frame.add-tile:hover{border-color:var(--ink);}
  .frame.add-tile span{font-size:26px; color:var(--ink-faint); font-weight:300;}

  .empty-collection{color:var(--ink-faint); font-size:13px; padding:20px 0;}

  /* ---------- text list (essays / reviews) ---------- */
  .text-list-wrap{max-width:760px; padding-top:var(--text-list-top-space);}
  .text-list-item{
    display:flex; align-items:baseline; justify-content:space-between; gap:20px;
    padding:var(--text-list-item-gap) 0;
    text-decoration:none; position:relative;
  }
  .text-list-title{
    font-size:var(--text-list-title-size); font-weight:600; letter-spacing:-.005em; color:var(--ink);
    transition:opacity .18s ease; font-style:var(--ui-font-style);
  }
  .text-list-item:hover .text-list-title{opacity:.5;}
  .text-list-right{display:flex; align-items:center; gap:14px; flex-shrink:0;}
  .text-list-arrow{
    font-size:15px; color:var(--ink-faint); opacity:0; transform:translateX(-6px);
    transition:opacity .18s ease, transform .18s ease;
  }
  .text-list-item:hover .text-list-arrow{opacity:1; transform:translateX(0);}
  .text-list-editctl{display:none; gap:6px;}
  .master-on .text-list-editctl{display:flex;}
  .text-list-editctl button{
    width:26px;height:26px;border-radius:5px;border:1px solid var(--line-strong); background:#fff; color:var(--ink);
    font-size:12px; display:flex; align-items:center; justify-content:center;
  }
  .text-list-editctl button:hover{background:var(--ink); color:#fff; border-color:var(--ink);}
  .text-list-add{
    display:none; align-items:center; gap:10px; padding:22px 0; cursor:pointer; color:var(--ink-faint);
    font-size:14px; letter-spacing:.04em;
  }
  .master-on .text-list-add{display:flex;}
  .text-list-add:hover{color:var(--ink);}
  .text-list-add span:first-child{font-size:18px; font-weight:300;}

  /* ---------- detail page ---------- */
  .detail-back{font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-soft); display:inline-block; margin-bottom:28px; font-style:var(--ui-font-style);}
  .detail-back:hover{color:var(--ink);}
  .detail-head{position:relative; margin-bottom:8px; padding:0 0 8px;}
  .detail-title{font-size:26px; font-weight:700; letter-spacing:.01em; font-style:var(--ui-font-style); text-align:center !important;}
  .detail-actions{display:none; gap:8px; position:absolute; top:0; right:0;}
  .master-on .detail-actions{display:flex;}
  .detail-actions button{
    font-size:11px; letter-spacing:.06em; text-transform:uppercase; padding:8px 12px; border-radius:5px;
    border:1px solid var(--line-strong); background:#fff; color:var(--ink); font-style:var(--ui-font-style);
  }
  .detail-actions button:hover{background:var(--ink); color:#fff; border-color:var(--ink);}
  .detail-actions button.danger:hover{background:#c0392b; border-color:#c0392b;}
  .detail-desc{color:var(--ink-soft); font-size:var(--content-font-size); letter-spacing:var(--content-letter-spacing); font-weight:var(--content-font-weight); text-align:var(--content-text-align); line-height:1.85; white-space:pre-wrap; margin:20px 0 48px; padding:0 var(--detail-margin);}

  .photo-rows-wrap{
    display:flex; flex-direction:column; gap:var(--frame-gap);
    padding:0 var(--detail-margin) var(--detail-margin);
  }
  .photo-grid{
    display:grid; grid-template-columns:repeat(var(--row-cols,1),1fr); align-items:start; gap:var(--photo-gap);
  }
  .photo-cell{position:relative; overflow:hidden; background:#fafafa; border:1px solid var(--line); width:100%; cursor:pointer;}
  .photo-cell img{width:100%; height:auto; object-fit:cover; display:block;}

  /* rows with 2+ photos: match every photo's height, let width follow its own ratio */
  .photo-grid.multi{
    display:flex; flex-wrap:wrap; align-items:stretch; justify-content:flex-start;
  }
  .photo-grid.multi .photo-cell{
    width:auto; height:var(--photo-row-height,380px); flex:0 0 auto;
  }
  .photo-grid.multi .photo-cell img{
    width:auto; height:100%; object-fit:cover;
  }
  .photo-grid.multi .photo-cell.add-tile{
    height:var(--photo-row-height,380px); width:calc(var(--photo-row-height,380px) * 0.75); aspect-ratio:auto;
  }
  @media (max-width:640px){
    .photo-grid.multi{ --photo-row-height:220px; }
  }
  .photo-caption{
    position:absolute; left:0; right:0; bottom:0; padding:14px 12px;
    background:linear-gradient(to top, rgba(0,0,0,.36), transparent);
    color:#fff; font-size:var(--caption-font-size); letter-spacing:.02em; opacity:0; transition:opacity .2s ease;
    text-shadow:0 1px 3px rgba(0,0,0,.6); text-align:center;
  }
  .photo-cell:hover .photo-caption{opacity:1;}
  .photo-editctl{position:absolute; top:8px; right:8px; display:none; gap:6px;}
  .master-on .photo-editctl{display:flex;}
  .photo-editctl button{
    width:24px;height:24px;border-radius:5px;border:none; background:rgba(255,255,255,.92); color:#111; font-size:11px;
    display:flex; align-items:center; justify-content:center;
  }
  .photo-editctl button:hover{background:var(--ink); color:#fff;}
  .photo-cell.add-tile{
    aspect-ratio:3/2; display:flex; align-items:center; justify-content:center; border:1.5px dashed var(--line-strong);
  }
  .photo-cell.add-tile span{font-size:24px; color:var(--ink-faint); font-weight:300;}

  /* master-only insert bar between photo rows */
  .row-insert{
    display:flex; align-items:center; justify-content:center; height:22px; margin:-8px 0; cursor:pointer;
    position:relative; opacity:.35; transition:opacity .15s;
  }
  .row-insert::before{
    content:""; position:absolute; left:0; right:0; top:50%; height:1px; border-top:1px dashed var(--line-strong);
  }
  .row-insert span{
    position:relative; background:#fff; padding:0 8px; font-size:16px; font-weight:300; color:var(--ink-faint); line-height:1;
  }
  .row-insert:hover{opacity:1;}
  .row-insert:hover span{color:var(--ink);}

  /* ---------- next works (bottom of detail page) ---------- */
  .next-works-section{margin-top:72px; padding-top:36px; border-top:1px solid var(--line);}
  .next-works-label{font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-faint); margin-bottom:22px;}
  .next-works-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:var(--frame-gap);}
  @media (max-width:640px){ .next-works-grid{grid-template-columns:1fr;} }

  /* ---------- contact ---------- */
  .contact-wrap{max-width:480px; padding-top:var(--contact-top-space);}
  .contact-block{
    padding:20px 0;
  }
  .contact-label{
    font-size:10.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-faint); margin-bottom:8px;
  }
  .contact-value{
    font-size:var(--contact-font-size); font-weight:600; letter-spacing:-.005em; color:var(--ink); display:inline-block;
    text-decoration:none; transition:opacity .18s ease;
  }
  .contact-value:hover{opacity:.5;}
  .contact-empty{color:var(--ink-faint); font-size:13px;}

  /* ---------- shared position/align utility ---------- */
  .align-left{margin-left:0; margin-right:auto; text-align:left;}
  .align-center{margin-left:auto; margin-right:auto; text-align:center;}
  .align-right{margin-left:auto; margin-right:0; text-align:right;}

  /* ---------- footer ---------- */
  footer{border-top:1px solid var(--line); padding:22px 0; font-size:11px; color:var(--ink-faint); letter-spacing:.03em;}
  footer .shell{display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px;}

  /* ---------- modals ---------- */
  .overlay{position:fixed; inset:0; background:rgba(0,0,0,.45); display:none; align-items:center; justify-content:center; z-index:200; padding:24px;}
  .overlay.show{display:flex;}
  .modal{background:#fff; border:1px solid var(--line-strong); border-radius:8px; width:100%; max-width:460px; max-height:88vh; overflow-y:auto; box-shadow:0 24px 60px rgba(0,0,0,.2);}
  .modal.wide{max-width:640px;}

  /* ---------- design panel: fixed to the left so edits stay visible ---------- */
  #designModal{
    justify-content:flex-start; align-items:stretch; background:transparent; padding:0; pointer-events:none;
  }
  #designModal .modal{
    pointer-events:auto; width:340px; max-width:340px; height:100vh; max-height:100vh;
    border-radius:0; border-width:0 1px 0 0; box-shadow:8px 0 32px rgba(0,0,0,.18);
  }
  @media (max-width:640px){
    #designModal .modal{ width:88vw; max-width:340px; }
  }

  /* ---------- lightbox ---------- */
  #photoLightbox{background:rgba(10,10,10,.96); padding:0; touch-action:pan-y; overscroll-behavior:contain;}
  #photoLightbox img{-webkit-user-drag:none; user-select:none;}
  #photoLightbox .lb-stage{
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    max-width:min(92vw,1100px); max-height:88vh;
  }
  #photoLightbox img{max-width:100%; max-height:80vh; object-fit:contain; display:block; box-shadow:0 20px 60px rgba(0,0,0,.5);}
  .lb-caption{color:#f2f2f2; font-size:13px; margin-top:16px; text-align:center; max-width:640px;}
  .lb-counter{color:rgba(255,255,255,.45); font-size:11px; letter-spacing:.08em; margin-top:8px; font-family:var(--active-font-family);}
  .lb-close{
    position:absolute; top:20px; right:24px; background:none; border:none; color:#fff; font-size:22px; z-index:2; opacity:.75;
  }
  .lb-close:hover{opacity:1;}
  .lb-nav{
    position:absolute; top:50%; transform:translateY(-50%); background:rgba(255,255,255,.08); border:none; color:#fff;
    width:52px; height:52px; border-radius:50%; font-size:30px; line-height:1; display:flex; align-items:center; justify-content:center;
    opacity:.75; z-index:2;
  }
  .lb-nav:hover{opacity:1; background:rgba(255,255,255,.18);}
  .lb-prev{left:16px;}
  .lb-next{right:16px;}
  @media (max-width:640px){
    .lb-nav{width:42px; height:42px; font-size:24px;}
    .lb-prev{left:6px;} .lb-next{right:6px;}
    .lb-close{top:14px; right:14px;}
  }

  .modal-head{padding:20px 22px 0; display:flex; align-items:center; justify-content:space-between;}
  .modal-head h2{font-size:15px; letter-spacing:.06em; text-transform:uppercase; font-weight:700;}
  .modal-close{background:none;border:none;color:var(--ink-faint);font-size:20px;line-height:1;padding:4px;}
  .modal-close:hover{color:var(--ink);}
  .modal-body{padding:18px 22px 22px;}
  .field{margin-bottom:14px;}
  .field label{display:block; font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-faint); margin-bottom:7px;}
  .field input[type=text], .field input[type=password], .field input[type=email], .field textarea{
    width:100%; background:#fff; border:1px solid var(--line-strong); border-radius:5px;
    color:var(--ink); padding:10px 11px; font-family:var(--active-font-family); font-size:14px; outline:none;
  }
  .field input:focus, .field textarea:focus{border-color:var(--ink);}
  .field textarea{resize:vertical; min-height:70px;}
  .field textarea.tall{min-height:280px; font-size:14px; line-height:1.8;}
  .field-hint{font-size:11px; color:var(--ink-faint); margin-top:6px;}

  .imgdrop{border:1.5px dashed var(--line-strong); border-radius:6px; padding:18px; text-align:center; cursor:pointer; color:var(--ink-faint); font-size:12.5px; position:relative; overflow:hidden;}
  .imgdrop.hasimg{padding:0; border-style:solid;}
  .imgdrop img{width:100%; max-height:220px; object-fit:cover; display:block;}
  .imgdrop:hover{border-color:var(--ink);}

  .btnrow{display:flex; gap:10px; margin-top:6px; flex-wrap:wrap;}
  .btn{font-size:11.5px; letter-spacing:.05em; text-transform:uppercase; padding:11px 18px; border-radius:5px; border:1px solid var(--line-strong); background:#fff; color:var(--ink); transition:.15s; font-style:var(--ui-font-style);}
  .btn:hover{border-color:var(--ink);}
  .btn.primary{background:var(--ink); border-color:var(--ink); color:#fff;}
  .btn.primary:hover{background:#000;}
  .btn.danger{color:#c0392b; border-color:rgba(192,57,43,.35);}
  .btn.danger:hover{background:rgba(192,57,43,.08);}
  .btn.ghost{border-color:transparent; color:var(--ink-faint);}
  .btn:disabled{opacity:.4; cursor:not-allowed;}

  .status-msg{font-size:11px; margin-top:12px; padding:9px 11px; border-radius:5px; display:none;}
  .status-msg.show{display:block;}
  .status-msg.ok{background:#eef7ee; color:#2e7d32;}
  .status-msg.err{background:#fdecea; color:#c0392b;}

  .linkrow{display:flex; gap:8px; margin-bottom:8px;}
  .linkrow input{flex:1;}
  .linkrow button{width:34px; border-radius:5px; border:1px solid var(--line-strong); background:#fff; color:#c0392b;}

  .design-section-label{font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-faint); margin-bottom:14px; padding-bottom:8px; border-bottom:1px solid var(--line);}
  .design-hint{text-transform:none; letter-spacing:0; font-size:11px;}
  .range-val{float:right; color:var(--ink-soft); font-size:11px; text-transform:none; letter-spacing:0;}
  .field input[type=range]{width:100%; accent-color:#111; height:4px;}
  .segbtns{display:flex; gap:6px; flex-wrap:wrap;}
  .segbtns button{
    font-size:11.5px; padding:8px 13px; border-radius:5px; border:1px solid var(--line-strong); background:#fff; color:var(--ink-soft);
  }
  .segbtns button.active{background:var(--ink); color:#fff; border-color:var(--ink);}
  .segbtns button:hover{border-color:var(--ink);}

  #pwModal .modal{max-width:320px;}
  #pwInput{text-align:center; letter-spacing:.4em; font-family:var(--mono); font-size:20px;}
  .shake{animation:shake .4s;}
  @keyframes shake{10%,90%{transform:translateX(-2px)}20%,80%{transform:translateX(4px)}30%,50%,70%{transform:translateX(-8px)}40%,60%{transform:translateX(8px)}}

  /* ---------- master toolbar ---------- */
  #masterbar{
    position:fixed; right:20px; bottom:20px; z-index:150;
    background:#111; border-radius:8px; padding:8px; display:none; gap:6px; align-items:center;
    box-shadow:0 12px 32px rgba(0,0,0,.28); flex-wrap:wrap; max-width:calc(100vw - 40px);
  }
  #masterbar.show{display:flex;}
  #masterbar .tag{font-size:10px; letter-spacing:.1em; color:#fff; padding:6px 10px; text-transform:uppercase;}
  #masterbar button.icon{width:34px;height:34px;border-radius:6px;border:1px solid #333; background:#1c1c1c; color:#fff; font-size:14px; display:flex; align-items:center; justify-content:center;}
  #masterbar button.icon:hover{background:#333;}
  #masterbar .sep{width:1px; height:20px; background:#333;}

  #masterbar button.icon{position:relative;}
  .unpub-dot{
    position:absolute; top:-3px; right:-3px; width:9px; height:9px; border-radius:50%;
    background:var(--ink); border:2px solid #fff; display:none;
  }
  .unpub-dot.show{display:block;}

:root{--content-font-size: 12px; --content-letter-spacing: 0em; --content-font-weight: 400; --content-text-align: left; --page-padding: 32px; --frame-gap: 4px; --frame-cols: 2; --detail-margin: 32px; --active-font-family: var(--sans); --content-max-width: 640px; --ui-font-style: normal; --caption-font-size: 15px; --frame-title-size: 20px; --text-list-title-size: 15px; --text-list-top-space: 64px; --text-list-item-gap: 16px; --contact-font-size: 17px; --contact-top-space: 120px; --photo-gap: 4px; --header-height: 83px;}
a.photo-cell{display:block;}.photo-cell{cursor:zoom-in;}.static-page .detail-desc{margin-top:20px;}.static-page .frame{cursor:pointer;}@media print{header.site-head,footer{display:none}}
