:root {
  --app-bg:#f4eee9;
  --app-card:#fffaf6;
  --app-ink:#2a211e;
  --app-muted:#786b66;
  --app-line:rgba(72,51,45,.16);
  --app-accent:#7b3f49;
  --app-sans:"Instrument Sans","Helvetica Neue",Arial,sans-serif;
  --app-serif:"Bodoni Moda",Didot,"Times New Roman",serif;
  --app-shadow:0 16px 42px rgba(53,34,29,.07);
}
body.page-studio { background:var(--app-bg); }
body.page-studio .faian-site-header,
body.page-studio .faian-site-footer { display:none; }
body.page-studio #content { min-height:100vh; }
.faian-studio-app,
.faian-app-login { font-family:var(--app-sans); color:var(--app-ink); }

.faian-app-login {
  width:min(460px,calc(100% - 32px));
  margin:8vh auto;
  padding:34px;
  background:var(--app-card);
  border:1px solid var(--app-line);
  box-shadow:var(--app-shadow);
}
.faian-app-login h1 { margin:9px 0 12px; font:400 48px/.95 var(--app-serif); letter-spacing:-.04em; }
.faian-app-login p { color:var(--app-muted); }
.faian-app-login label { display:block; margin:15px 0 6px; font-size:11px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; }
.faian-app-login input[type=text],
.faian-app-login input[type=password] { width:100%; min-height:50px; border:1px solid var(--app-line); border-radius:0; padding:0 13px; background:#fff; }
.faian-app-login input[type=submit] { width:100%; min-height:52px; margin-top:18px; border:0; border-radius:0; background:var(--app-ink); color:#fff; font-size:11px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; }
.faian-app-kicker { margin:0; color:var(--app-muted); font-size:10px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; }

.faian-app-loading { min-height:100vh; display:grid; place-items:center; color:var(--app-muted); }
.faian-studio-app { min-height:100vh; padding-bottom:92px; background:var(--app-bg); }
.faian-app-topbar {
  position:sticky; top:0; z-index:20;
  min-height:66px;
  display:flex; align-items:center; justify-content:space-between; gap:20px;
  padding:0 max(18px,env(safe-area-inset-left));
  background:rgba(244,238,233,.93);
  border-bottom:1px solid var(--app-line);
  -webkit-backdrop-filter:blur(18px);
  backdrop-filter:blur(18px);
}
.faian-app-brand { display:flex; align-items:baseline; gap:8px; }
.faian-app-brand strong { font-size:14px; letter-spacing:.18em; }
.faian-app-brand span { font:italic 400 13px/1 var(--app-serif); }
.faian-app-link { border:0; background:transparent; color:var(--app-ink); padding:0; font-size:11px; font-weight:600; letter-spacing:.06em; text-decoration:none; }
.faian-app-link.button-link { cursor:pointer; }
.faian-app-view { width:min(900px,100%); margin:0 auto; padding:34px 18px 42px; }
.faian-app-heading { max-width:670px; margin-bottom:28px; }
.faian-app-heading h1 { margin:10px 0 0; font:400 clamp(44px,8vw,68px)/.98 var(--app-serif); letter-spacing:-.045em; }
.faian-app-heading > p:last-child { margin:13px 0 0; max-width:580px; color:var(--app-muted); font-size:14px; line-height:1.55; }

.faian-app-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.faian-stat { padding:18px; background:var(--app-card); border:1px solid var(--app-line); }
.faian-stat strong { display:block; font:400 42px/1 var(--app-serif); }
.faian-stat span { display:block; margin-top:5px; color:var(--app-muted); font-size:9px; font-weight:600; letter-spacing:.13em; text-transform:uppercase; }
.faian-app-section { margin-top:28px; }
.faian-app-section-head { display:flex; align-items:end; justify-content:space-between; gap:12px; margin-bottom:11px; }
.faian-app-section h2,
.faian-form-card h2 { margin:0; font:400 29px/1 var(--app-serif); letter-spacing:-.025em; }
.faian-app-card,
.faian-form-card { background:var(--app-card); border:1px solid var(--app-line); box-shadow:0 8px 24px rgba(53,34,29,.03); }
.faian-app-card { padding:17px; }
.faian-app-card + .faian-app-card { margin-top:9px; }
.faian-muted-copy { margin:0; color:var(--app-muted); font-size:13px; }

.faian-order-row,
.faian-painting-row { display:flex; gap:13px; align-items:center; }
.faian-order-row > div:first-child,
.faian-painting-row > div:nth-child(2) { flex:1; min-width:0; }
.faian-order-row h3,
.faian-painting-row h3 { margin:0 0 4px; font:400 21px/1.1 var(--app-serif); }
.faian-order-row p,
.faian-painting-row p { margin:0; color:var(--app-muted); font-size:12px; }
.faian-row-end { display:grid; justify-items:end; gap:5px; }
.faian-painting-thumb { width:66px; height:78px; flex:0 0 auto; object-fit:cover; background:#e7ddd6; }
.faian-pill { display:inline-flex; align-items:center; min-height:24px; padding:0 8px; border:1px solid var(--app-line); font-size:8px; font-weight:600; letter-spacing:.09em; text-transform:uppercase; white-space:nowrap; }
.faian-pill.is-sold { color:var(--app-accent); border-color:rgba(123,63,73,.30); }

.faian-app-button {
  display:inline-flex; justify-content:center; align-items:center;
  min-height:50px; padding:0 18px;
  border:1px solid var(--app-ink); border-radius:0;
  font-size:10px; font-weight:600; letter-spacing:.13em; text-transform:uppercase;
}
.faian-app-button.primary { background:var(--app-ink); color:#fff; }
.faian-app-button.secondary { background:transparent; color:var(--app-ink); }
.faian-app-button.full { width:100%; }
.faian-app-button:disabled { opacity:.55; cursor:wait; }

.faian-app-bottomnav {
  position:fixed; z-index:50; left:50%; bottom:max(12px,env(safe-area-inset-bottom)); transform:translateX(-50%);
  width:min(520px,calc(100% - 24px)); min-height:62px;
  display:grid; grid-template-columns:repeat(4,1fr);
  padding:6px;
  background:rgba(255,250,246,.96); border:1px solid var(--app-line); box-shadow:var(--app-shadow);
  -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px);
}
.faian-app-navbtn {
  position:relative; border:0; background:transparent; color:var(--app-muted);
  font-size:9px; font-weight:600; letter-spacing:.11em; text-transform:uppercase;
}
.faian-nav-dot { display:block; width:4px; height:4px; margin:0 auto 6px; border-radius:50%; background:transparent; }
.faian-app-navbtn.is-active { color:var(--app-ink); }
.faian-app-navbtn.is-active .faian-nav-dot { background:var(--app-accent); }

.faian-form { display:grid; gap:15px; }
.faian-form-card { padding:20px; }
.faian-card-heading { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:17px; }
.faian-card-heading > span { color:var(--app-muted); font-size:9px; letter-spacing:.08em; text-transform:uppercase; }
.faian-field-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:13px; }
.faian-field { display:block; }
.faian-field.full { grid-column:1/-1; }
.faian-field > span { display:block; margin-bottom:6px; font-size:10px; font-weight:600; letter-spacing:.07em; text-transform:uppercase; }
.faian-field input,
.faian-field textarea,
.faian-field select { width:100%; min-height:50px; border:1px solid var(--app-line); border-radius:0; padding:10px 12px; background:#fff; color:var(--app-ink); outline:none; }
.faian-field textarea { min-height:120px; resize:vertical; line-height:1.5; }
.faian-field input:focus,
.faian-field textarea:focus,
.faian-field select:focus { border-color:var(--app-accent); box-shadow:0 0 0 2px rgba(123,63,73,.07); }
.faian-photo-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:9px; }
.faian-photo-input { position:relative; min-height:180px; display:grid; place-items:center; overflow:hidden; text-align:center; border:1px solid var(--app-line); background:#f9f3ef; }
.faian-photo-input input { position:absolute; inset:0; opacity:0; cursor:pointer; z-index:3; }
.faian-photo-input strong { display:block; font:400 22px/1.05 var(--app-serif); }
.faian-photo-input small { display:block; margin-top:6px; color:var(--app-muted); font-size:10px; }
.faian-photo-input img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.faian-photo-input .faian-photo-copy { position:relative; z-index:2; padding:12px; }
.faian-photo-input.has-image::after { content:""; position:absolute; inset:0; background:rgba(35,24,21,.28); z-index:1; }
.faian-photo-input.has-image .faian-photo-copy { color:#fff; }
.faian-photo-input.has-image small { color:rgba(255,255,255,.82); }
.faian-form-actions { display:grid; grid-template-columns:1fr 1.4fr; gap:9px; }
.faian-toast { position:fixed; left:50%; bottom:86px; transform:translateX(-50%); max-width:calc(100% - 30px); padding:12px 15px; background:var(--app-ink); color:#fff; font-size:12px; z-index:90; box-shadow:var(--app-shadow); }
.faian-empty { padding:30px 18px; text-align:center; color:var(--app-muted); }

@media(max-width:620px){
  .faian-app-view { padding-top:28px; }
  .faian-app-grid { grid-template-columns:repeat(3,1fr); }
  .faian-stat { padding:14px 10px; }
  .faian-stat strong { font-size:34px; }
  .faian-stat span { font-size:8px; }
  .faian-field-grid,
  .faian-photo-grid { grid-template-columns:1fr; }
  .faian-form-actions { grid-template-columns:1fr; }
  .faian-card-heading { align-items:start; flex-direction:column; gap:6px; }
  .faian-painting-row { align-items:flex-start; }
  .faian-painting-row .faian-pill { margin-left:auto; }
}

/* v0.4.2 — editable Works inventory + protected destructive actions */
.faian-painting-button {
  width:100%;
  appearance:none;
  text-align:left;
  color:inherit;
  font:inherit;
  cursor:pointer;
  transition:border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.faian-painting-button:hover,
.faian-painting-button:focus-visible {
  border-color:rgba(123,63,73,.38);
  box-shadow:0 10px 28px rgba(53,34,29,.07);
  outline:none;
}
.faian-painting-summary { flex:1; min-width:0; }
.faian-work-edit-cue { display:inline-block; margin-top:7px; color:var(--app-accent); font-size:9px; font-weight:600; letter-spacing:.09em; text-transform:uppercase; }
.faian-edit-back { margin-bottom:22px; }
.faian-edit-photo-slot { display:grid; gap:8px; min-width:0; }
.faian-remove-photo {
  display:flex; align-items:flex-start; gap:8px;
  color:var(--app-muted); font-size:10px; line-height:1.35;
  cursor:pointer;
}
.faian-remove-photo input { margin-top:1px; accent-color:var(--app-accent); }
.faian-danger-zone {
  margin-top:32px;
  padding:20px;
  display:flex; align-items:center; justify-content:space-between; gap:24px;
  border:1px solid rgba(142,58,58,.28);
  background:rgba(255,248,246,.66);
}
.faian-danger-zone h2 { margin:5px 0 5px; font:400 28px/1 var(--app-serif); }
.faian-danger-zone p:not(.faian-app-kicker) { margin:0; max-width:560px; color:var(--app-muted); font-size:12px; line-height:1.5; }
.faian-app-button.danger { border-color:#8e3a3a; color:#7a3030; background:transparent; }
.faian-app-button.danger.solid { background:#7a3030; color:#fff; border-color:#7a3030; }
.faian-app-button.danger:disabled { opacity:.38; cursor:not-allowed; }
body.faian-modal-open { overflow:hidden; }
.faian-delete-modal[hidden] { display:none; }
.faian-delete-modal {
  position:fixed; z-index:200; inset:0;
  display:grid; place-items:center;
  padding:20px;
  background:rgba(35,24,21,.52);
  -webkit-backdrop-filter:blur(5px); backdrop-filter:blur(5px);
}
.faian-delete-dialog {
  width:min(520px,100%);
  padding:26px;
  background:var(--app-card);
  border:1px solid rgba(79,53,46,.22);
  box-shadow:0 28px 80px rgba(35,24,21,.26);
}
.faian-delete-dialog h2 { margin:8px 0 12px; font:400 35px/1.02 var(--app-serif); letter-spacing:-.025em; }
.faian-delete-dialog > p:not(.faian-app-kicker) { margin:0; color:var(--app-muted); font-size:13px; line-height:1.55; }
.faian-delete-check {
  display:flex; gap:10px; align-items:flex-start;
  margin:20px 0;
  padding:14px;
  border:1px solid rgba(142,58,58,.20);
  background:rgba(142,58,58,.045);
  font-size:12px; line-height:1.45;
  cursor:pointer;
}
.faian-delete-check input { margin-top:2px; accent-color:#7a3030; }
.faian-delete-actions { display:grid; grid-template-columns:1fr 1.25fr; gap:9px; }

@media(max-width:620px){
  .faian-danger-zone { align-items:stretch; flex-direction:column; }
  .faian-danger-zone .faian-app-button { width:100%; }
  .faian-delete-actions { grid-template-columns:1fr; }
}

/* ===== v0.5.0 — mobile-first gallery organizer + sizing override ===== */
.faian-app-bottomnav { grid-template-columns: repeat(5, 1fr); }
.faian-home-actions { display:grid; grid-template-columns:1fr 1fr; gap:9px; }

.faian-size-override {
  padding:16px;
  border:1px solid var(--app-line);
  background:rgba(249,243,239,.58);
}
.faian-size-override-head { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; }
.faian-size-override-head p { margin:5px 0 0; max-width:590px; color:var(--app-muted); font-size:12px; line-height:1.45; text-transform:none; letter-spacing:0; }
.faian-field-label { display:block; font-size:10px; font-weight:600; letter-spacing:.07em; text-transform:uppercase; }
.faian-switch { position:relative; flex:0 0 auto; width:50px; height:30px; cursor:pointer; }
.faian-switch input { position:absolute; opacity:0; pointer-events:none; }
.faian-switch span { position:absolute; inset:0; border-radius:999px; background:#e1d6cf; border:1px solid rgba(79,53,46,.15); transition:.18s ease; }
.faian-switch span::after { content:""; position:absolute; width:22px; height:22px; top:3px; left:3px; border-radius:50%; background:#fff; box-shadow:0 2px 7px rgba(53,34,29,.16); transition:.18s ease; }
.faian-switch input:checked + span { background:var(--app-ink); }
.faian-switch input:checked + span::after { transform:translateX(20px); }
.faian-size-override-panel { margin-top:16px; padding-top:15px; border-top:1px solid var(--app-line); }
.faian-size-override-panel[hidden] { display:none !important; }
.faian-size-override-panel > p { margin:10px 0 0; color:var(--app-muted); font-size:11px; line-height:1.45; }
.faian-range { width:100%; min-height:34px; padding:0; accent-color:var(--app-ink); }
.faian-range-line { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:12px; margin-bottom:7px; color:var(--app-muted); font-size:9px; letter-spacing:.06em; text-transform:uppercase; }
.faian-range-line > :last-child { text-align:right; }
.faian-range-line strong { color:var(--app-ink); font-size:13px; letter-spacing:0; }

.faian-gallery-size-panel { margin-bottom:18px; }
.faian-gallery-size-panel .faian-card-heading { align-items:flex-start; margin-bottom:10px; }
.faian-gallery-size-panel .faian-card-heading > div { flex:1; }
.faian-gallery-size-panel .faian-card-heading strong { font:400 32px/1 var(--app-serif); }
.faian-global-range { margin:8px 0 2px; }
.faian-organizer-note { display:flex; gap:12px; align-items:flex-start; margin:0 0 28px; padding:13px 15px; border:1px solid var(--app-line); background:rgba(255,250,246,.64); color:var(--app-muted); }
.faian-organizer-note > span { color:var(--app-accent); font-size:20px; line-height:1; }
.faian-organizer-note p { margin:0; font-size:11px; line-height:1.5; }
.faian-organizer-group { margin-top:30px; }
.faian-organizer-group .faian-app-section-head { align-items:flex-start; }
.faian-organizer-group .faian-app-section-head h2 { margin-bottom:5px; }
.faian-layout-list { display:grid; gap:12px; }
.faian-layout-card { padding:14px; border:1px solid var(--app-line); background:var(--app-card); box-shadow:0 8px 24px rgba(53,34,29,.035); transition:box-shadow .16s ease, transform .16s ease, opacity .16s ease; }
.faian-layout-card.is-dragging { z-index:5; opacity:.82; box-shadow:0 18px 45px rgba(53,34,29,.15); transform:scale(1.012); }
.faian-layout-card-top { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:11px; margin-bottom:12px; }
.faian-drag-handle { display:inline-flex; flex-direction:column; justify-content:center; align-items:center; min-width:48px; min-height:48px; padding:4px 7px; border:1px solid var(--app-line); background:#fff; color:var(--app-muted); font:600 8px/1 var(--app-sans); letter-spacing:.08em; text-transform:uppercase; touch-action:none; cursor:grab; }
.faian-drag-handle span { margin-bottom:4px; color:var(--app-ink); font-size:20px; font-weight:400; line-height:.7; }
.faian-drag-handle:active { cursor:grabbing; }
.faian-layout-title { min-width:0; }
.faian-layout-title strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font:400 20px/1.05 var(--app-serif); }
.faian-layout-title span { display:block; margin-top:4px; color:var(--app-muted); font-size:9px; letter-spacing:.03em; }
.faian-layout-stepper { display:grid; grid-template-columns:1fr 1fr; border:1px solid var(--app-line); }
.faian-layout-stepper button { width:34px; height:42px; padding:0; border:0; border-right:1px solid var(--app-line); background:#fff; color:var(--app-ink); font-size:16px; }
.faian-layout-stepper button:last-child { border-right:0; }

.faian-wall-snap { position:relative; height:154px; overflow:hidden; border:1px solid rgba(79,53,46,.14); background:linear-gradient(rgba(255,255,255,.18),rgba(255,255,255,.18)), #efc9b6; }
.faian-wall-snap::before { content:""; position:absolute; inset:0; background:repeating-linear-gradient(90deg, transparent 0, transparent calc(33.333% - 1px), rgba(93,65,56,.14) calc(33.333% - 1px), rgba(93,65,56,.14) 33.333%); pointer-events:none; }
.faian-wall-snap::after { content:"SNAP GRID"; position:absolute; left:8px; bottom:6px; color:rgba(67,44,38,.42); font-size:7px; font-weight:600; letter-spacing:.16em; }
.faian-wall-guide { position:absolute; top:0; bottom:0; width:1px; background:rgba(90,61,53,.18); pointer-events:none; }
.faian-wall-guide.guide-one { left:33.333%; }
.faian-wall-guide.guide-two { left:66.666%; }
.faian-wall-art { --organizer-global:1; position:absolute; top:50%; width:clamp(54px, calc(72px * var(--organizer-global)), 104px); aspect-ratio:var(--thumb-ratio, .8); transform:translateY(-50%); transition:left .16s ease, right .16s ease, transform .16s ease, width .16s ease; box-shadow:0 8px 14px rgba(66,42,34,.22); background:#fff; overflow:hidden; }
.faian-wall-art img { width:100%; height:100%; object-fit:cover; display:block; }
.faian-wall-art > span { display:grid; place-items:center; height:100%; font-size:8px; text-transform:uppercase; }
.faian-wall-art.align-left { left:8%; right:auto; }
.faian-wall-art.align-center { left:50%; right:auto; transform:translate(-50%,-50%); }
.faian-wall-art.align-right { right:8%; left:auto; }
.faian-snap-controls { display:grid; grid-template-columns:auto repeat(3,1fr); align-items:center; gap:6px; margin-top:10px; }
.faian-snap-controls > span { padding-right:4px; color:var(--app-muted); font-size:8px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; }
.faian-snap-controls button { min-height:38px; padding:0 8px; border:1px solid var(--app-line); background:#fff; color:var(--app-muted); font-size:9px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; }
.faian-snap-controls button.is-active { background:var(--app-ink); border-color:var(--app-ink); color:#fff; }
.faian-layout-savebar { position:sticky; z-index:30; bottom:82px; margin:28px 0 8px; padding:8px; background:rgba(255,250,246,.92); border:1px solid var(--app-line); box-shadow:0 12px 35px rgba(53,34,29,.10); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); }

@media(max-width:620px){
  .faian-app-bottomnav { width:calc(100% - 16px); bottom:max(8px,env(safe-area-inset-bottom)); }
  .faian-app-navbtn { font-size:7px; letter-spacing:.06em; }
  .faian-home-actions { grid-template-columns:1fr; }
  .faian-size-override-head { gap:12px; }
  .faian-layout-card { padding:11px; }
  .faian-layout-card-top { grid-template-columns:auto minmax(0,1fr); }
  .faian-layout-stepper { grid-column:1/-1; grid-template-columns:1fr 1fr; }
  .faian-layout-stepper button { width:auto; height:36px; }
  .faian-wall-snap { height:142px; }
  .faian-snap-controls { grid-template-columns:repeat(3,1fr); }
  .faian-snap-controls > span { grid-column:1/-1; }
  .faian-layout-savebar { bottom:78px; }
}

/* ===== FAIAN Studio v0.6.0 — direct-manipulation gallery organizer ===== */
.faian-organizer-toolbar {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin:22px 0 12px;
}
.faian-organizer-toolbar > div:first-child { min-width:0; }
.faian-organizer-toolbar strong { display:block; font-size:12px; }
.faian-organizer-toolbar span { display:block; margin-top:3px; color:var(--app-muted); font-size:10px; }
.faian-preview-toggle { display:grid; grid-template-columns:1fr 1fr; flex:0 0 auto; border:1px solid var(--app-line); background:#fff; }
.faian-preview-toggle button { min-width:64px; min-height:40px; padding:0 10px; border:0; border-right:1px solid var(--app-line); background:#fff; color:var(--app-muted); font-size:9px; font-weight:600; letter-spacing:.07em; text-transform:uppercase; }
.faian-preview-toggle button:last-child { border-right:0; }
.faian-preview-toggle button.is-active { background:var(--app-ink); color:#fff; }

.faian-mini-device {
  --mini-page-width:100%;
  width:var(--mini-page-width);
  max-width:100%;
  margin:0 auto;
  overflow:hidden;
  border:1px solid rgba(76,51,43,.28);
  background-color:#f9c4aa;
  background-image:var(--mini-wall);
  background-repeat:repeat-y;
  background-position:top center;
  background-size:100% auto;
  box-shadow:0 22px 54px rgba(53,34,29,.10);
  color:#2b2724;
  transition:width .24s ease;
}
.faian-mini-device.is-phone { --mini-page-width:min(390px,100%); }
.faian-mini-site-header {
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  min-height:48px;
  padding:0 4.5%;
  border-bottom:1px solid rgba(96,77,68,.20);
  background:rgba(255,244,236,.72);
  font-family:Georgia,serif;
  font-size:7px;
  letter-spacing:.05em;
}
.faian-mini-site-header > span:last-child { text-align:right; }
.faian-mini-site-header strong { font-size:13px; font-weight:500; letter-spacing:.09em; }
.faian-mini-site-header em { display:block; margin-top:1px; color:#716a63; font:normal 6px/1 Arial,sans-serif; letter-spacing:.22em; text-align:center; text-transform:uppercase; }
.faian-mini-intro { padding:8% 7% 7%; text-align:center; }
.faian-mini-intro small,
.faian-mini-section-heading > span { color:#716a63; font:600 6px/1 Arial,sans-serif; letter-spacing:.18em; text-transform:uppercase; }
.faian-mini-intro h2 { margin:6px 0 0; font:500 clamp(30px,7vw,58px)/.9 Georgia,serif; letter-spacing:-.03em; }
.faian-mini-intro p { width:min(76%,520px); margin:10px auto 0; color:#5f5751; font-size:7px; line-height:1.55; }
.faian-mini-device.is-phone .faian-mini-intro h2 { font-size:38px; }
.faian-mini-device.is-phone .faian-mini-intro p { width:88%; font-size:7px; }

.faian-mini-section { padding:2% 5.5% 9%; }
.faian-mini-section-heading { padding-top:8px; border-top:1px solid rgba(96,77,68,.22); }
.faian-mini-section-heading strong { display:block; margin-top:5px; font:500 clamp(18px,3vw,32px)/1 Georgia,serif; }
.faian-mini-section-heading small { display:block; margin-top:5px; color:#716a63; font-size:6px; }
.faian-mini-divider { height:1px; margin:0 5.5%; background:rgba(96,77,68,.24); }
.faian-mini-section.is-unavailable { padding-top:7%; }
.faian-mini-grid {
  position:relative;
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  grid-auto-flow:row;
  align-items:start;
  gap:clamp(24px,5vw,54px) 0;
  min-height:96px;
  margin-top:7%;
  padding:10px 0 14px;
  background-image:repeating-linear-gradient(90deg, transparent 0, transparent calc(8.3333% - 1px), rgba(83,57,48,.11) calc(8.3333% - 1px), rgba(83,57,48,.11) 8.3333%);
  background-size:100% 100%;
}
.faian-mini-grid::before,
.faian-mini-grid::after { content:""; position:absolute; left:0; right:0; height:1px; border-top:1px dashed rgba(83,57,48,.13); pointer-events:none; }
.faian-mini-grid::before { top:33.333%; }
.faian-mini-grid::after { top:66.666%; }
.faian-mini-empty { grid-column:1/-1; padding:24px 0; color:#786b66; font-size:8px; text-align:center; }
.faian-mini-art {
  grid-column:var(--mini-start,4) / span var(--mini-span,5);
  position:relative;
  z-index:2;
  min-width:0;
  padding:0;
  border:0;
  background:transparent;
  color:#2b2724;
  text-align:left;
  touch-action:pan-y;
  cursor:grab;
  -webkit-user-select:none;
  user-select:none;
  transition:opacity .12s ease, filter .12s ease;
}
.faian-mini-art:focus-visible { outline:2px solid var(--app-accent); outline-offset:4px; }
.faian-mini-art-frame {
  position:relative;
  display:block;
  width:100%;
  aspect-ratio:var(--mini-ratio,.8);
  overflow:hidden;
  background:#fff7f1;
  border:1px solid rgba(70,45,38,.20);
  box-shadow:0 7px 11px rgba(57,36,30,.28), 0 1px 1px rgba(45,28,23,.40);
}
.faian-mini-art-frame::after { content:""; position:absolute; inset:0; pointer-events:none; box-shadow:inset 0 1px 1px rgba(255,255,255,.55), inset 0 -1px 2px rgba(45,28,23,.20); }
.faian-mini-art img { width:100%; height:100%; object-fit:cover; display:block; pointer-events:none; }
.faian-mini-placeholder { display:grid; place-items:center; height:100%; color:#786b66; font-size:7px; text-transform:uppercase; }
.faian-mini-art-label {
  position:absolute;
  z-index:4;
  left:50%;
  top:calc(100% + 5px);
  max-width:130%;
  transform:translateX(-50%);
  overflow:hidden;
  opacity:0;
  padding:3px 5px;
  background:rgba(255,250,246,.94);
  border:1px solid rgba(72,51,45,.14);
  color:#2a211e;
  font-size:6px;
  line-height:1.2;
  text-overflow:ellipsis;
  white-space:nowrap;
  pointer-events:none;
}
.faian-mini-art.is-selected { z-index:8; }
.faian-mini-art.is-selected .faian-mini-art-frame { outline:2px solid var(--app-accent); outline-offset:2px; }
.faian-mini-art.is-selected .faian-mini-art-label { opacity:1; }
.faian-mini-art.is-dragging { opacity:.22; cursor:grabbing; }
.faian-mini-device.is-phone .faian-mini-grid { gap:34px 0; }
.faian-mini-device.is-phone .faian-mini-section { padding-left:5%; padding-right:5%; }
.faian-mini-device.is-phone .faian-mini-section-heading strong { font-size:22px; }
.faian-mini-device.is-phone .faian-mini-art-label { font-size:6px; }
.faian-mini-footer { display:flex; justify-content:space-between; gap:20px; padding:20px 5.5%; border-top:1px solid rgba(96,77,68,.20); background:rgba(255,247,241,.16); color:#716a63; font-size:6px; }
.faian-mini-footer strong { color:#2b2724; letter-spacing:.08em; }

.faian-layout-selection {
  position:sticky;
  z-index:28;
  bottom:134px;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
  margin:16px 0 0;
  padding:10px;
  border:1px solid var(--app-line);
  background:rgba(255,250,246,.95);
  box-shadow:0 14px 34px rgba(53,34,29,.10);
  -webkit-backdrop-filter:blur(12px);
  backdrop-filter:blur(12px);
}
.faian-layout-selection > div:first-child { min-width:0; }
.faian-layout-selection strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:11px; }
.faian-layout-selection span { display:block; margin-top:2px; color:var(--app-muted); font-size:8px; }
.faian-layout-nudges { display:grid; grid-template-columns:repeat(4,38px); border:1px solid var(--app-line); }
.faian-layout-nudges button { width:38px; height:38px; padding:0; border:0; border-right:1px solid var(--app-line); background:#fff; color:var(--app-ink); font-size:16px; }
.faian-layout-nudges button:last-child { border-right:0; }
.faian-layout-nudges button:disabled { opacity:.28; cursor:not-allowed; }
.faian-drag-ghost {
  position:fixed !important;
  z-index:100000 !important;
  margin:0 !important;
  pointer-events:none !important;
  opacity:.82 !important;
  transform:rotate(.4deg) scale(1.025);
  filter:drop-shadow(0 15px 18px rgba(44,28,23,.25));
  cursor:grabbing;
}
.faian-drag-ghost .faian-mini-art-label { display:none; }

@media(max-width:620px){
  .faian-organizer-toolbar { align-items:flex-end; }
  .faian-preview-toggle button { min-width:58px; min-height:38px; }
  .faian-mini-device.is-wide { width:100%; }
  .faian-mini-site-header { min-height:40px; }
  .faian-mini-site-header strong { font-size:11px; }
  .faian-mini-intro { padding-top:9%; }
  .faian-mini-grid { gap:30px 0; padding-top:8px; }
  .faian-layout-selection { bottom:132px; grid-template-columns:1fr; }
  .faian-layout-nudges { grid-template-columns:repeat(4,1fr); }
  .faian-layout-nudges button { width:auto; min-width:0; }
  .faian-layout-savebar { bottom:78px; }
}
