.generated-result { --lb-bg:var(--bg,#faf8f4); --lb-card:var(--white,#fdfdfd); --lb-sel:var(--accent-soft,#f0ede8); --lb-line:var(--line,#e6e2dc); --lb-ink:var(--ink,#41464d); --lb-gold:#ae9876; --lb-ambient:#ece6db; }
:root[data-theme="dark"] .generated-result {--lb-ambient:#2a2530;--lb-gold:#c9b38f}
.lb-board { position: relative; aspect-ratio: 3 / 4; border-radius: 18px;
  background: radial-gradient(ellipse at 60% 40%, var(--lb-amb1, var(--lb-ambient)), var(--lb-amb2, var(--lb-sel)) 62%, var(--lb-card) 84%); }
/* إضاءة بحسب المناسبة — فرق خفيف مقصود */
.lb-board.lb-amb-evening { --lb-amb1: #eee3cd; --lb-amb2: #e3d7c0; }
.lb-board.lb-amb-work    { --lb-amb1: #e9e9e6; --lb-amb2: #e0e0dc; }
.lb-dark .lb-board.lb-amb-evening, :root[data-theme="dark"] .lb-board.lb-amb-evening { --lb-amb1: #322a38; --lb-amb2: #262030; }
.lb-dark .lb-board.lb-amb-work,    :root[data-theme="dark"] .lb-board.lb-amb-work    { --lb-amb1: #272731; --lb-amb2: #201f29; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .lb-board.lb-amb-evening { --lb-amb1: #322a38; --lb-amb2: #262030; }
  :root:not([data-theme="light"]) .lb-board.lb-amb-work    { --lb-amb1: #272731; --lb-amb2: #201f29; }
}

.lb-p { position: absolute; }
.lb-p img, .lb-p svg.lb-ph { transform: rotate(var(--lb-tilt, 0deg)); }
.lb-p img { width: 100%; height: 100%; display: block; object-fit: contain;
  filter: drop-shadow(0 5px 8px rgba(40,34,26,.14)); }
.lb-p svg.lb-ph { width: 100%; height: 100%; display: block; overflow: visible; }
.lb-p.lb-back img,  .lb-p.lb-back svg.lb-ph  { filter: drop-shadow(0 3px 5px rgba(40,34,26,.10)); }
.lb-p.lb-front img, .lb-p.lb-front svg.lb-ph { filter: drop-shadow(0 8px 14px rgba(40,34,26,.18)); }
/* صورة الحلي: قصّة مؤطرة، لا قص خلفية ولا ميلان */
.lb-p.lb-framed img { object-fit: cover; border-radius: 10px; border: 1px solid var(--lb-line);
  filter: none; box-shadow: 0 3px 8px rgba(40,34,26,.12); transform: none; }
.lb-p.lb-picked img { filter: drop-shadow(0 0 0 var(--lb-gold)) drop-shadow(0 0 3px var(--lb-gold)) drop-shadow(0 5px 8px rgba(40,34,26,.14)); }

.lb-badge { position: absolute; z-index: 20; width: 24px; height: 24px; border-radius: 50%;
  border: 1px solid var(--lb-line); background: var(--lb-card); color: var(--lb-ink);
  display: grid; place-items: center; font-size: 12px; padding: 0; cursor: pointer;
  box-shadow: 0 2px 6px rgba(40,34,26,.16); }
.lb-badge.lb-mini { width: 18px; height: 18px; font-size: 10px; }
.lb-badge.lb-on { background: var(--lb-ink); color: var(--lb-bg); border-color: var(--lb-ink); }
.lb-more { position: absolute; z-index: 20; border: 1px solid var(--lb-gold); background: var(--lb-sel);
  color: var(--lb-ink); border-radius: 999px; padding: 1px 10px; font-size: 12.5px; font-weight: 500; cursor: pointer; }

/* السحب بين الإطلالات */
.lb-deck { display: flex; gap: 10px; overflow-x: auto; scroll-snap-type: x mandatory;
  padding: 4px 2px 10px; scrollbar-width: none; overscroll-behavior-x: contain; }
.lb-deck::-webkit-scrollbar { display: none; }
.lb-card { flex: 0 0 84%; scroll-snap-align: center; background: var(--lb-card);
  border: 1px solid var(--lb-line); border-radius: 24px; padding: 9px; box-shadow: 0 8px 22px rgba(40,34,26,.07); }
.lb-dots { display: flex; justify-content: center; gap: 6px; margin-top: 6px; }
.lb-dots span { width: 6px; height: 6px; border-radius: 50%; background: var(--lb-line); transition: width .2s; }
.lb-dots span.lb-on { background: var(--lb-ink); width: 16px; border-radius: 6px; }
@media (prefers-reduced-motion: reduce) { .lb-dots span { transition: none; } }

/* ورقة «+N» الافتراضية (يمكن استبدالها عبر onMore) */
.lb-sheet { border: 1px solid var(--lb-line); border-radius: 16px; background: var(--lb-card);
  color: var(--lb-ink); padding: 8px 12px; margin-top: 8px; font-size: 13px; }
.lb-sheet .lb-row { display: flex; justify-content: space-between; align-items: center;
  padding: 5px 0; border-top: 1px solid var(--lb-line); gap: 10px; }
.lb-sheet .lb-row:first-child { border-top: 0; }
.lb-sheet button { border: 1px solid var(--lb-line); background: var(--lb-sel); color: var(--lb-ink);
  border-radius: 999px; padding: 3px 12px; font-size: 12px; cursor: pointer; }

/* Integration: isolate presentation from old tile rules and preserve mobile scale. */
.generated-result .lb-board {width:100%;min-height:0;overflow:visible;isolation:isolate}
.generated-result .lb-p.deck-piece {position:absolute;display:block;border:0;padding:0;margin:0;background:none;border-radius:0;min-width:0;min-height:0;overflow:visible;box-shadow:none}
.lb-art {position:absolute;inset:0;display:block;transform:rotate(var(--lb-tilt,0deg));filter:drop-shadow(0 5px 8px rgba(40,34,26,.14))}
.lb-art.lb-cropped{overflow:hidden}
.lb-p .lb-art img{transform:none;filter:none;object-fit:contain;background:none}
.lb-back .lb-art{filter:drop-shadow(0 3px 5px rgba(40,34,26,.10))}
.lb-front .lb-art{filter:drop-shadow(0 8px 14px rgba(40,34,26,.18))}
.lb-framed .lb-art{transform:none;filter:none;border:1px solid var(--lb-line);border-radius:10px;overflow:hidden;background:var(--lb-card);box-shadow:0 3px 8px rgba(40,34,26,.12)}
.lb-framed .lb-art img{object-fit:contain;border:0;border-radius:0;box-shadow:none}
.lb-p.swap-target .lb-badge{background:var(--lb-ink);color:var(--lb-card)}
.lb-p.swap-target .lb-art{filter:drop-shadow(0 0 3px var(--lb-gold))}
.lb-badge{font:500 14px/1 system-ui;touch-action:manipulation}
.lb-badge:focus-visible,.lb-more:focus-visible{outline:2px solid var(--lb-ink);outline-offset:3px}
.lb-more{white-space:nowrap}
.lb-all-sheet {width:min(92vw,430px);max-height:82dvh;overflow:auto;border:1px solid var(--lb-line);border-radius:22px;background:var(--lb-card);color:var(--lb-ink);padding:16px;margin:auto}
.lb-all-sheet::backdrop{background:#0007;backdrop-filter:blur(3px)}
.lb-all-sheet header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.lb-all-sheet h2{font-size:18px;margin:0}.lb-close{width:40px;height:40px;padding:0;border-radius:50%;display:grid;place-items:center;font:26px/1 system-ui;background:var(--lb-sel);color:var(--lb-ink);border:1px solid var(--lb-line)}
.lb-all-row{display:grid;grid-template-columns:64px 1fr auto;gap:12px;align-items:center;border-top:1px solid var(--lb-line);padding:10px 0;font-size:13px}.lb-thumb{position:relative;height:70px}.lb-thumb .lb-art{transform:none;filter:none}.lb-list-swap{font:inherit;padding:8px 12px;border-radius:20px;border:1px solid var(--lb-line);background:var(--lb-sel);color:var(--lb-ink)}
.lb-guide{position:absolute;border:1px dashed #ae9876;background:#ae987614;display:grid;place-items:center;font-size:10px;pointer-events:none;z-index:12;color:var(--lb-ink);text-align:center}.lb-scheme .lb-p{visibility:hidden}
.generated-result .lb-result-shell {background:var(--lb-card);border:1px solid var(--lb-line);border-radius:24px;padding:9px;box-shadow:0 8px 22px #28221a12;min-width:0}
.generated-result .lb-deck{direction:rtl;padding:4px 0 10px;gap:10px;margin:0;border:0;min-width:0;position:relative}
.generated-result .lb-card{min-width:288px;box-sizing:border-box;padding:9px;max-width:100%;margin:0;position:relative}
.generated-result .lb-deck.lb-single .lb-card{flex-basis:100%;min-width:0;border:0;box-shadow:none;padding:0;background:transparent}
.generated-result .lb-dots button{display:block;width:6px;height:6px;border:0;border-radius:50%;background:var(--lb-line);padding:0;transition:width .2s;cursor:pointer}
.generated-result .lb-dots button[aria-current="true"]{width:16px;border-radius:6px;background:var(--lb-ink)}
.generated-result .lb-dots button:before{content:"";display:block;width:20px;height:24px;transform:translate(7px,-9px)}
.generated-result .lb-result-shell .deck-meta{padding:16px 6px 6px}
@media(max-width:350px){#generation-panel .lb-result-shell{padding:4px;border-radius:18px}.generated-result .lb-card{min-width:278px;padding:4px}}
@media(prefers-reduced-motion:reduce){.generated-result .lb-dots button{transition:none}}

/* Inspect original photo independently of the swap control. */
.generated-result .lb-inspect{position:absolute;inset:0;width:100%;height:100%;padding:0;border:0;border-radius:8px;background:transparent;box-shadow:none;cursor:zoom-in;min-width:0;min-height:0;overflow:visible;color:inherit}
.lb-inspect:focus-visible,.lb-thumb-inspect:focus-visible{outline:2px solid var(--lb-ink);outline-offset:3px}
.lb-thumb-inspect{padding:0;border:0;background:transparent;cursor:zoom-in;color:inherit;min-width:0}
.lb-photo-sheet{width:min(94vw,520px);max-height:90dvh;padding:16px;overflow:auto}
.lb-photo-sheet header h2{font-size:16px;line-height:1.6}
.lb-photo-sheet .lb-close{flex:0 0 40px}
.lb-photo-full{height:min(66dvh,620px);display:grid;place-items:center;background:var(--lb-sel);border-radius:16px;padding:12px;overflow:hidden}
.lb-photo-full img{display:block;width:100%;height:100%;min-height:0;object-fit:contain;transform:none;filter:none}
.lb-photo-full svg{max-width:100%;max-height:100%}

/* Compact result controls: keep 44px tap targets, give the board more width. */
#stylist-stage-result:has(.lb-result) .stage-topbar{padding-top:0;min-height:44px;gap:6px}
.generated-result:has(.lb-result) .deck-actions{max-width:none;margin:8px 0 0;gap:6px;align-items:stretch}
.generated-result:has(.lb-result) .deck-action{padding:0;gap:0;display:block}
.generated-result:has(.lb-result) .deck-action .circle-button{width:100%;height:100%;min-height:44px;margin:0;padding:4px 8px;display:flex;align-items:center;justify-content:center;gap:6px;border-radius:14px;box-shadow:none;font-family:inherit;font-size:12px;font-weight:600;line-height:1.4}
.generated-result:has(.lb-result) .deck-action .circle-button svg{width:18px;height:18px;flex:0 0 18px}
.generated-result:has(.lb-result) .deck-action .circle-button span{font-size:12px;line-height:1.4;font-weight:600;min-width:0}
.generated-result .lb-result-shell .deck-meta{padding:2px 4px 2px}
.generated-result .lb-result-shell .deck-meta-top h2{font-size:16px}
.generated-result .lb-result-shell .deck-save{width:44px;height:44px;border:0;background:transparent;box-shadow:none}
.generated-result .lb-result-shell .result-save-icon{font-size:22px}
.generated-result .lb-deck{padding-bottom:4px}
@media(max-width:600px){
 #stylist-page:has(#stylist-stage-result:not([hidden]) .lb-result){padding:4px 10px 0}
 .generated-result .lb-result-shell{padding:6px;border-radius:20px}
}

.generated-result .lb-result-shell .deck-save::before{inset:8px}

/* Share in the existing 44px top bar; the title keeps its natural 24px row. */
.generated-result .lb-result-shell .deck-meta-top{flex-wrap:nowrap}
#stylist-stage-result .result-share-icon{
  flex:0 0 44px;width:44px;height:44px;min-height:44px;padding:10px;
  border:0;border-radius:12px;background:transparent;color:var(--ink,#41464D);
  display:inline-flex;align-items:center;justify-content:center;cursor:pointer;
}
#stylist-stage-result .result-share-icon:hover{background:var(--accent-soft,#F0EDE8)}
#stylist-stage-result .result-share-icon:disabled{opacity:.5;cursor:progress}
#stylist-stage-result .result-share-icon svg{width:21px;height:21px;flex:0 0 21px}
.result-share-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}

#stylist-stage-result .result-top-actions{display:flex;align-items:center;gap:2px;flex:0 0 auto;margin-inline-start:auto}
#stylist-stage-result .result-top-actions .result-new-look{margin:0}

/* Keep the full-size 3:4 board while swiping; dots indicate other looks. */
.generated-result .lb-deck .lb-card{flex:0 0 100%;min-width:0;padding:0;border:0;box-shadow:none;background:transparent;scroll-snap-stop:always}
@media(max-width:850px){
 .main-content:has(#stylist-page.active #stylist-stage-result:not([hidden]) .lb-result){padding-bottom:calc(80px + max(8px,var(--safe-bottom,0px)))}
}

/* Saved looks share the result board, including photo inspection and overflow. */
html[data-graphite-review] #saved-grid .saved-board-preview{display:block;padding:6px 6px 0;margin:0;background:var(--paper)}
html[data-graphite-review] #saved-grid .saved-board-preview .lb-board{border-radius:18px}
html[data-graphite-review] #saved-grid .saved-board-preview .lb-all-row{grid-template-columns:64px 1fr}

html[data-graphite-review] #saved-grid:has(.saved-board-preview) .saved-look-heading{align-items:center;gap:6px}
html[data-graphite-review] #saved-grid:has(.saved-board-preview) .saved-look-heading h3{font-size:18px;line-height:1.4;min-width:0;overflow-wrap:anywhere}
html[data-graphite-review] #saved-grid .saved-look-tools{display:flex;align-items:center;gap:0;flex-shrink:0}
html[data-graphite-review] #saved-grid .saved-board-share{width:44px;height:44px;min-height:44px;padding:10px;border:0;background:transparent;color:var(--ink);border-radius:12px}
html[data-graphite-review] #saved-grid .saved-board-share:hover{background:var(--accent-soft)}
html[data-graphite-review] #saved-grid .saved-board-share:disabled{opacity:.5}
html[data-graphite-review] #saved-grid .saved-look-tools .favorite-saved-outfit{width:44px;height:44px;margin:0;flex-shrink:0}

/* Full conversation looks share the result/saved geometry, with a compact shell. */
#stylist-stage-chat .chat-look-card{width:100%;min-width:0;padding:8px;border-radius:18px}
#stylist-stage-chat .chat-look-board.generated-result{display:block;width:100%;min-height:0;padding:0;margin:0;border:0;background:none;box-shadow:none}
#stylist-stage-chat .chat-board-host{width:100%;min-width:0}
#stylist-stage-chat .chat-look-card .chat-look-title{padding:8px 4px 2px}
#stylist-stage-chat .chat-look-card .chat-look-actions{padding:4px 0 0;flex-wrap:wrap}
#stylist-stage-chat .chat-look-card .chat-look-actions button{min-height:44px;flex:1;justify-content:center}
#stylist-stage-chat .chat-look-card{animation:chat-message-in .18s ease-out}
@media(prefers-reduced-motion:reduce){#stylist-stage-chat .chat-look-card{animation:none}}

/* Shopping combinations are full boards, with the purchase candidate identified. */
.shop-board-list{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;margin-top:10px}
.shop-look-card.generated-result{padding:8px;border:1px solid var(--line);border-radius:18px;min-width:0;background:var(--white)}
.shop-look-caption{margin:8px 4px 2px;font-size:12px;line-height:1.6;color:var(--muted)}
.shop-board-host{width:100%;min-width:0}
html[data-shareboard-preview="ready"] body>*:not(#shareboard-preview-output){display:none!important}
#shareboard-preview-output{display:block;max-width:540px;margin:0 auto;padding:0;background:var(--paper)}
#shareboard-preview-output img{display:block;width:100%;height:auto}

@media(max-width:600px){
 .shop-page-form:has(.shop-board-list){padding:12px}
 .shop-page-form #shopping-result:has(.shop-board-list){padding:10px}
 .shop-board-list{margin-inline:-6px}
 .shop-look-card.generated-result{padding:4px}
}

#today-outfit:has(.legacy-home-board){display:block;min-height:0;height:auto;padding:0}
#recent-looks .read-only-board-host{padding:6px}
#lookreview-compare-thumbs:has(.planned-reference-board){display:block;width:100%;overflow:visible}
.planned-reference-board{width:100%;padding:4px}

/* Preserve compact commentary, with full text available on demand. */
.result-reason.is-expanded{-webkit-line-clamp:unset;display:block;overflow:visible}
.result-reason-more{display:block;min-height:44px;border:0;background:transparent;color:var(--ink);font-family:inherit;font-size:12px;line-height:1.4;font-weight:600;padding:4px 0;text-align:start;cursor:pointer}
.result-reason-more[hidden]{display:none}
