/* v1.2.0: shared visible-link skin, used by admin and public pages. */
.yhi-app .yhi-canvas,.yhi-admin #yhi-editor-stage { container-type:inline-size; isolation:isolate; }
.yhl-extension-fill { position:relative; height:0; background:#e9e8e4; pointer-events:none; }
.yhl-extension-fill::before { content:""; position:absolute; inset:0 7.5% 0 2.5%; background:linear-gradient(105deg,#f0f2f5,#e9edf2 75%,#eff1f5); border:1px solid rgba(160,170,178,.4); box-shadow:2px 4px 6px rgba(30,36,40,.18); }
.yhl-continuation { position:absolute; left:0; width:100%; pointer-events:none; z-index:1; font:12px/1.5 "Microsoft YaHei","PingFang SC",sans-serif; font-size:calc(13 * 100cqw / 1055); color:#4a535d; }
.yhl-continuation[hidden] { display:none!important; }
.yhl-continuation-header { position:absolute; top:calc(8 * 100cqw / 1055); left:8%; font-weight:600; letter-spacing:.07em; }
.yhl-continuation-footer { position:absolute; bottom:calc(12 * 100cqw / 1055); left:8%; right:12.5%; display:flex; justify-content:space-between; border-top:1px solid #555d67; padding-top:calc(7 * 100cqw / 1055); }
.yhi-app .yhi-hotspot.yhl-visual,.yhi-admin .yhi-editor-spot.yhl-visual { border:0; background:transparent; border-radius:0; font-family:"Microsoft YaHei","PingFang SC","Noto Sans CJK SC",sans-serif; font-weight:700; font-size:16px; font-size:calc(var(--yhl-font,25) * 100cqw / 1055); color:#080b0e; z-index:4; line-height:1.2; }
.yhl-visual .yhl-face { position:absolute; inset:0; display:flex; align-items:center; gap:.85em; overflow:hidden; }
.yhl-visual .yhl-badge { display:flex; flex:none; justify-content:center; align-items:center; font-family:"Arial Narrow","Roboto Condensed",Arial,sans-serif; color:#fff; font-weight:600; line-height:1; }
.yhl-visual .yhl-text { flex:1; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; letter-spacing:0; }
.yhl-directory .yhl-face { background:#eff1f5; padding:0 .25em 0 0; }
.yhl-directory .yhl-badge { height:85%; aspect-ratio:1; border-radius:50%; background:linear-gradient(110deg,rgba(255,255,255,.08),rgba(255,255,255,.24)),var(--yhl-color); border:1px solid white; font-size:1.17em; }
.yhl-directory .yhl-text { align-self:stretch; display:flex; align-items:center; border-bottom:1px solid #bfc5cf; }
.yhl-label .yhl-face,.yhl-custom .yhl-face { gap:.65em; padding-right:.55em; border-radius:0 .9em .9em 0; border:1px solid rgba(255,255,255,.8); background:linear-gradient(100deg,rgba(255,255,255,.02),rgba(255,255,255,.35)),var(--yhl-color); }
.yhl-label .yhl-badge,.yhl-custom .yhl-badge { width:18.5%; height:100%; border-radius:0 .5em .5em 0; background:var(--yhl-color); font-size:1.5em; }
.yhl-tab .yhl-face { justify-content:center; border-radius:0 .6em .6em 0; background:linear-gradient(105deg,rgba(0,0,0,.04),rgba(255,255,255,.22)),var(--yhl-color); box-shadow:2px 3px 6px rgba(30,35,40,.24),inset 1px 0 rgba(255,255,255,.5); border:1px solid rgba(255,255,255,.4); }
.yhl-tab .yhl-badge { width:100%; height:100%; }
.yhl-visual.yhl-wrap .yhl-text { white-space:normal; overflow-wrap:anywhere; }
.yhi-app .yhi-hotspot.yhl-visual:hover,.yhi-app .yhi-hotspot.yhl-visual:focus-visible,.yhi-app .yhi-hotspot.yhl-visual.is-linked { background:transparent; box-shadow:0 0 0 2px #fff,0 0 0 4px var(--yhl-color); border-radius:4px; z-index:6; }
.yhi-app.yhi-show-hotspots .yhi-hotspot.yhl-visual { outline:1px solid #1764a7; outline-offset:2px; }
.yhi-admin .yhi-editor-spot.yhl-visual { outline:1px dashed rgba(16,89,170,.65); outline-offset:1px; }
.yhi-admin .yhi-editor-spot.yhl-visual.is-selected { border:0; outline:2px solid #0063cc; box-shadow:0 0 0 4px white; z-index:8; }
.yhi-admin .yhl-face { pointer-events:none; }
.yhi-admin .yhl-visual .yhi-editor-tag { z-index:2; opacity:.85; }
.yhi-admin .yhl-visual .yhi-resize { z-index:3; }
/* Forms deliberately do not share the scaled canvas typography. */
.yhi-admin .yhl-new-panel { border:1px solid #b8cee7; border-left:4px solid #2271b1; background:#f4f8fe; border-radius:7px; padding:14px 16px; margin-top:14px; }
.yhi-admin .yhl-new-panel h3 { margin:0 0 8px; font-size:14px; }
.yhi-admin .yhl-new-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 16px; }
.yhi-admin .yhl-new-grid .yhi-field { margin:8px 0; }
.yhi-admin .yhl-inline-check { display:flex; gap:7px; align-items:center; margin:10px 0; font-size:12px; }
.yhi-admin .yhl-inline-check input { margin:0; }
.yhi-admin .yhl-settings { border-top:1px solid #e0e6ef; margin-top:12px; padding-top:4px; }
.yhi-admin .yhl-settings legend { font-weight:600; color:#214b78; font-size:12px; padding-top:12px; }
.yhi-admin .yhl-status { min-height:20px; color:#226447; font-size:12px; line-height:1.7; margin:8px 0; }
.yhi-admin .yhl-status.is-error { color:#a32b30; }
.yhi-admin #yhl-create { margin-right:6px; }
@media(max-width:600px) { .yhi-admin .yhl-new-grid { grid-template-columns:1fr; } }