/* Phone layout follows the task steps; desktop keeps the full workspace. */
#mobile-steps,.phone-only{display:none}
@media(max-width:700px),(max-width:1000px) and (max-height:500px),(max-width:1000px) and (pointer:coarse){
  :root{--phone-header:calc(68px + env(safe-area-inset-top,0px));-webkit-text-size-adjust:100%;text-size-adjust:100%}
  html{scroll-padding-top:calc(var(--phone-header) + 66px)}
  body{overflow-x:clip}
  header{height:var(--phone-header);padding:env(safe-area-inset-top,0px) max(16px,env(safe-area-inset-right,0px)) 0 max(16px,env(safe-area-inset-left,0px));position:sticky;top:0;z-index:5}
  .brand{gap:12px;font-size:20px}.brand img{width:68px;height:52px}.brand small{font-size:8px}.brand-divider{height:30px}.local{display:none}.header-right{gap:8px}
  .circle{width:46px;height:46px;flex-shrink:0}
  main{padding:22px max(14px,env(safe-area-inset-right,0px)) calc(20px + env(safe-area-inset-bottom,0px)) max(14px,env(safe-area-inset-left,0px))}
  .intro{padding-bottom:18px}.intro-note{display:none}.intro .eyebrow{font-size:9px;letter-spacing:1.7px;margin-bottom:10px}
  h1{font-size:36px;letter-spacing:-1.5px;line-height:1.04}.lead{font-size:14px;line-height:1.5;margin-top:12px;max-width:32rem}
  #mobile-steps{display:flex;gap:5px;padding:5px;background:#fff;border:1px solid var(--line);border-radius:999px;position:sticky;top:calc(var(--phone-header) + 6px);z-index:4;margin:0 0 16px;scroll-margin-top:calc(var(--phone-header) + 6px);box-shadow:0 4px 16px #00000009}
  #mobile-steps button{flex:1;min-width:0;min-height:44px;border:0;border-radius:999px;padding:9px 5px;font:inherit;font-size:14px;font-weight:650;color:var(--muted);background:white}
  #mobile-steps button[aria-pressed=true]{background:var(--red);color:white}
  .phone-only{display:flex}
  .workspace{display:flex;flex-direction:column;gap:16px;min-width:0}aside{display:contents}.panel,.viewer{width:100%;min-width:0;position:static;order:initial}
  .panel{padding:16px;border-radius:18px}.section-head{margin-bottom:16px;gap:10px}h2{font-size:18px;line-height:1.25}.step{font-size:12px}
  body[data-mobile-step="1"] #alignment-panel,body[data-mobile-step="1"] #viewer-panel,body[data-mobile-step="1"] #export-panel{display:none}
  body[data-mobile-step="2"] #images-panel,body[data-mobile-step="2"] #export-panel,body[data-mobile-step="3"] #images-panel,body[data-mobile-step="3"] #alignment-panel{display:none}
  body[data-mobile-step="2"] .intro,body[data-mobile-step="3"] .intro,body[data-mobile-step="2"] footer,body[data-mobile-step="3"] footer{display:none}
  #alignment-panel{order:0}#viewer-panel{order:1}#export-panel{order:2}
  .uploads{grid-template-columns:minmax(0,1fr);gap:14px}
  .image-card{display:grid;grid-template-columns:minmax(110px,.9fr) minmax(0,1.1fr);gap:8px 12px;padding:12px;border-radius:14px;align-items:start}
  .image-card .upload{grid-column:1;grid-row:1/5;display:block}.image-card .thumb{height:146px}
  .file-action{font-size:13px;line-height:1.3;min-height:44px;padding-top:12px}
  .image-title{grid-column:2;font-size:16px;line-height:24px;min-height:46px;padding:10px;margin:0;min-width:0}
  .image-caption{grid-column:2;font-size:16px;line-height:22px;min-height:88px;margin:0;padding:9px;resize:vertical;min-width:0}
  .file-name{grid-column:2;font-size:11px;margin:0;max-width:100%}.remove-image{grid-column:2;min-height:44px;font-size:13px;padding:6px 0}
  .primary,.secondary,.dark,.download{min-height:48px;font-size:15px;line-height:1.35;padding:12px 16px}
  aside .primary,aside .secondary,aside .dark{margin-top:12px}.text-button{min-height:44px;font-size:14px;line-height:1.4}.hint{font-size:13px;line-height:1.5}.body-copy{font-size:14px;line-height:1.55}
  #continue-align,#continue-export{width:100%}
  #alignment-panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px 12px}
  #alignment-panel .section-head{grid-column:1/-1;margin-bottom:2px}#alignment-panel .body-copy{display:none}
  .target-label{grid-column:1;align-self:center;font-size:14px;line-height:1.4;margin:0}
  #target-image{grid-column:2;margin:0;min-height:48px;font-size:16px;padding:10px;min-width:0}
  #auto,#points{width:100%;margin:0;min-height:52px;font-size:13px;padding:10px 8px;gap:6px}
  #alignment-state,#undo,#continue-export{grid-column:1/-1}.alignment-state{padding:0;font-size:13px;line-height:1.5}
  #undo{padding:5px 0}#continue-export{margin:0;font-size:14px;min-height:44px}
  .viewer-top{padding:16px;gap:12px}.viewer-top h2{font-size:18px;overflow-wrap:anywhere}.viewer-top .eyebrow{font-size:9px}
  .stage{min-height:0}.empty{padding:26px 16px}.empty svg{width:130px;height:110px}.empty h3{font-size:19px}.empty p{font-size:14px}.empty span{font-size:12px;margin-top:20px}
  #comparison{max-height:50svh;max-height:50dvh;touch-action:pan-y;user-select:none}
  .comparison-controls{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 12px;padding:12px 16px}
  .comparison-controls input{grid-column:1/-1;grid-row:1;width:100%;height:44px;margin:0;appearance:none;-webkit-appearance:none;background:transparent;touch-action:pan-y}
  .comparison-controls input::-webkit-slider-runnable-track{height:5px;border-radius:4px;background:#e6e6e6}.comparison-controls input::-webkit-slider-thumb{-webkit-appearance:none;width:28px;height:28px;border-radius:50%;background:var(--red);border:3px solid white;box-shadow:0 1px 5px #0003;margin-top:-11.5px}
  .comparison-controls input::-moz-range-track{height:5px;border-radius:4px;background:#e6e6e6}.comparison-controls input::-moz-range-thumb{width:24px;height:24px;border-radius:50%;background:var(--red);border:3px solid white}
  .comparison-controls>span{max-width:none;font-size:12px;letter-spacing:0;text-transform:none;grid-row:2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  #slider-start{grid-column:1}#slider-end{grid-column:2;text-align:right}.comparison-controls output{display:none}
  .sequence-option{padding:12px 16px 0;min-height:44px;font-size:14px;line-height:1.4;gap:10px}.sequence-option input{width:22px;height:22px;flex-shrink:0}
  .viewer-bottom{padding:12px 16px;font-size:12px;gap:14px}.viewer-bottom>span:first-child{max-width:none}.mini-logo{flex-shrink:0}
  #export-panel .body-copy{font-size:15px}#export-status{font-size:14px}.download{font-size:16px}
  footer{font-size:10px;line-height:1.6;padding:20px 0;gap:20px;letter-spacing:.4px}
  .notice{bottom:calc(16px + env(safe-area-inset-bottom,0px));font-size:14px;line-height:1.5;width:calc(100% - 32px);max-width:540px;padding:14px 16px}
  #help-dialog{width:calc(100vw - 24px);max-height:calc(100dvh - 24px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));overflow:auto;padding:32px 22px 22px;border-radius:20px}
  #help-dialog h2{font-size:28px;padding-right:24px}#help-dialog li,#help-dialog>p:not(.eyebrow){font-size:15px;line-height:1.6}.project-actions{display:flex;flex-direction:column;gap:10px}.project-actions>button,.project-actions>label{width:100%;min-height:48px}.project-actions .text-button{text-align:center}
  #editor{position:fixed;inset:0;margin:0;width:100%;max-width:none;height:100vh;height:100dvh;max-height:none;border-radius:0;display:flex;flex-direction:column;padding:env(safe-area-inset-top,0px) max(0px,env(safe-area-inset-right,0px)) env(safe-area-inset-bottom,0px) max(0px,env(safe-area-inset-left,0px))}
  #editor:not([open]){display:none}
  .editor-header{height:auto;min-height:64px;flex:none;padding:8px 12px;gap:10px}.editor-header h2{font-size:18px}.editor-header .eyebrow{display:none}.editor-header button{min-height:44px;font-size:12px;padding:10px 12px}
  .editor-layout{display:flex;flex-direction:column;flex:1;height:auto;min-height:0;padding:10px 12px;gap:8px;overflow:hidden}
  .editor-left{flex:1;min-height:0;display:flex;flex-direction:column}.editor-toolbar{display:flex;flex-direction:column;align-items:stretch;gap:4px;margin-bottom:8px;flex:none}
  .tabs{display:flex;width:100%;padding:3px}.tabs button{flex:1;max-width:none;min-width:0;min-height:42px;font-size:15px;padding:9px 12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .zoom-controls{display:flex;justify-content:center;gap:10px;font-size:14px}.zoom-controls button{min-height:44px;min-width:44px;padding:9px 12px;font-size:16px}.zoom-controls output{min-width:46px}#fit-view{font-size:14px}
  #point-viewport{flex:1;min-height:120px;overscroll-behavior:contain;border-radius:12px}
  .editor-left>.hint{font-size:11px;line-height:1.4;margin-top:6px;flex:none}
  .editor-side{display:flex;flex-direction:column;flex:0 0 auto;height:auto;min-height:0;gap:6px;overflow:hidden}
  .editor-side h3{font-size:14px;line-height:1.35;margin:0;min-height:20px;max-height:40px;overflow:auto}
  .editor-side>.body-copy,.pairs-heading{display:none}
  .editor-side>#start-pair{display:block;min-height:44px;padding:10px;background:var(--tint);border:1px solid #f7cbd0;border-radius:999px;font-size:14px;margin:0;text-align:center}
  #toggle-pairs{display:flex;min-height:44px;font-size:13px;margin:0;padding:8px 12px}
  .editor-side>#pair-list{display:none;flex:0 1 auto;min-height:0;max-height:120px;max-height:min(120px,18dvh);overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
  #editor[data-pairs-expanded=true] #pair-list{display:block}
  .pair-row{padding:5px 0;gap:6px;min-height:48px}.pair-row span{font-size:11px}.pair-row button:not(.delete){min-height:44px;max-width:105px;font-size:13px;padding:9px 12px}.pair-row button.delete{min-height:44px;min-width:44px;font-size:22px;padding:6px}
  .editor-side>.primary{margin:0;min-height:48px;font-size:15px;flex-shrink:0}.editor-side>.hint{margin:0;font-size:12px;line-height:1.4;max-height:35px;overflow:auto}.editor-side>.hint:empty{display:none}
  .marker{width:34px;height:34px;font-size:13px}
}
@media(max-width:700px) and (max-height:650px){.editor-left>.hint{display:none}.editor-header{min-height:56px}.editor-layout{padding-top:6px;gap:6px}.editor-toolbar{margin-bottom:4px}.editor-side>#pair-list{max-height:70px}.editor-side{gap:4px}}
@media(max-width:1000px) and (max-height:500px) and (orientation:landscape){
  :root{--phone-header:calc(56px + env(safe-area-inset-top,0px))}
  .brand img{height:46px}.brand{font-size:18px}.brand small{display:none}.intro{display:none}main{padding-top:12px}
  #mobile-steps{max-width:560px;margin-left:auto;margin-right:auto;margin-bottom:12px}
  .uploads{grid-template-columns:1fr 1fr}.image-card{grid-template-columns:minmax(100px,.9fr) minmax(0,1.1fr)}
  #comparison{max-height:62dvh}.viewer-top{padding:10px 16px}
  .editor-header{min-height:52px;padding:4px 12px}.editor-header h2{font-size:17px}
  .editor-layout{display:grid;grid-template-columns:minmax(0,1fr) 235px;gap:12px;padding:6px 12px}
  .editor-toolbar{flex-direction:row;gap:8px;align-items:center;margin-bottom:6px}.tabs{flex:1;min-width:0}.tabs button{font-size:13px;padding:8px}.zoom-controls{gap:0;flex-shrink:0}.zoom-controls button{padding:8px;min-width:44px}.zoom-controls output{min-width:40px}#fit-view{font-size:12px}
  .editor-left>.hint{display:none}.editor-side{height:100%;overflow:auto;gap:6px}.editor-side h3{flex-shrink:0}.editor-side>#pair-list{display:block;flex:1;max-height:none;min-height:30px}#toggle-pairs{display:none}.editor-side>#start-pair{font-size:12px;flex-shrink:0}.editor-side>.primary{font-size:13px}.pair-row button:not(.delete){font-size:11px;padding:8px;max-width:68px}
}
@media(max-width:700px),(max-width:1000px) and (max-height:500px),(max-width:1000px) and (pointer:coarse){body[data-mobile-step="3"] #export-panel{order:0}}
@media(max-width:700px),(max-width:1000px) and (max-height:500px),(max-width:1000px) and (pointer:coarse){.image-attribution{grid-column:1/-1;grid-row:auto;margin-top:4px}.image-attribution summary{min-height:44px;font-size:14px;padding:12px 0}.attribution-fields{gap:9px}.attribution-fields label{font-size:14px}.attribution-fields input,.attribution-fields textarea{font-size:16px;min-height:46px;padding:10px}.attribution-fields textarea{min-height:86px}}
@media(max-width:700px),(max-width:1000px) and (max-height:500px),(max-width:1000px) and (pointer:coarse){#geometry-mode{grid-column:2;margin:0;min-width:0;min-height:48px;padding:10px;font-size:16px}.geometry-note{grid-column:1/-1;font-size:13px;margin:0;line-height:1.45}}
/* Full-screen, photo-first point editing. One finger edits points; two move the photo. */
@media(max-width:700px),(max-width:1000px) and (max-height:500px),(max-width:1000px) and (pointer:coarse){
 #editor{overflow:hidden;overscroll-behavior:none;background:#171717}
 #editor .editor-header{display:flex;min-height:52px;height:52px;padding:4px 8px;gap:8px;background:white;border:0}
 #editor .editor-header h2{font-size:16px;letter-spacing:-.2px;white-space:nowrap}#editor .editor-header button{min-height:44px;padding:8px 12px;font-size:13px}#editor #editor-undo{padding:6px;font-size:23px;width:44px}
 #editor .editor-layout{position:relative;display:flex;flex:1;min-height:0;height:auto;padding:0;gap:0;overflow:hidden}
 #editor .editor-left{display:flex;flex:1;min-height:0;position:relative}
 #editor .editor-toolbar{display:block;flex:none;margin:0;padding:4px 6px;background:white}
 #editor #point-tabs{width:100%;padding:2px;gap:0;overflow:hidden;background:#f0f0f0;border-radius:12px}
 #editor #point-tabs button{flex:1 1 0;min-width:0;max-width:none;min-height:42px;padding:8px 3px;font-size:12px;line-height:1.2;white-space:nowrap;border-radius:10px}
 #editor #point-tabs button[aria-pressed=true]{background:#fff2f3;color:var(--red);box-shadow:inset 0 0 0 1px #e2001a66}
 #editor .zoom-controls{position:absolute;right:8px;bottom:8px;z-index:4;display:flex;background:#fffffff0;border-radius:999px;box-shadow:0 2px 12px #0003;gap:0;font-size:11px;padding:0 2px}
 #editor .zoom-controls button{min-width:40px;min-height:40px;padding:8px;font-size:16px}#editor .zoom-controls output{min-width:36px;font-size:11px}#editor #fit-view{font-size:11px;min-width:54px}
 #editor #point-viewport{flex:1;min-height:80px;border-radius:0;touch-action:none;-webkit-touch-callout:none;user-select:none;-webkit-user-select:none;overscroll-behavior:none;background:#171717}
 #editor #point-world,#editor #markers,#editor .marker{touch-action:none;-webkit-touch-callout:none;user-select:none;-webkit-user-select:none}
 #editor .editor-left>.hint{display:none}#editor #touch-help{display:block}
 #editor #point-loupe:not([hidden]){display:block}
 #editor .marker{width:44px;height:44px;background:transparent;border:0;box-shadow:none;color:#e2001a;z-index:1}
 #editor .marker.selected,#editor .marker.pending{background:transparent;box-shadow:none;z-index:2;color:#ff8a26}
 #editor .marker::before{inset:0;background:linear-gradient(white,white) center/3px 34px no-repeat,linear-gradient(white,white) center/34px 3px no-repeat;filter:drop-shadow(0 1px 1px #000);pointer-events:none}
 #editor .marker::after{content:"";position:absolute;inset:0;background:linear-gradient(currentColor,currentColor) center/1px 32px no-repeat,linear-gradient(currentColor,currentColor) center/32px 1px no-repeat;pointer-events:none}
 #editor .marker-number{display:grid;place-items:center;position:absolute;top:-3px;right:-3px;width:22px;height:22px;background:#e2001a;border:2px solid white;border-radius:50%;box-shadow:0 1px 4px #0006;color:white;font-size:11px;line-height:1;z-index:1}
 #editor .marker.selected .marker-number,#editor .marker.pending .marker-number{background:#c96500}#editor .marker.suggestion{color:#227f9d;border:0;opacity:1}#editor .marker.suggestion .marker-number{background:#227f9d}
 #editor .editor-side{display:none;position:absolute;z-index:10;left:6px;right:6px;bottom:6px;max-height:85%;height:auto;padding:12px;background:white;border-radius:16px;box-shadow:0 0 0 100vmax #0005;overflow:auto;gap:10px;min-height:0}
 #editor[data-mobile-panel=points] .editor-side,#editor[data-mobile-panel=more] .editor-side{display:flex;flex-direction:column}
 #editor .editor-side h3,#editor .editor-side>.body-copy,#editor .editor-side>#apply-points,#editor .editor-side>#toggle-pairs{display:none}
 #editor .editor-side>#mobile-panel-close{display:flex;min-height:44px;flex:none;align-self:flex-end;margin:0;font-size:13px}
 #editor .editor-side>.phone-gesture-help,#editor .editor-side>.auto-option,#editor .editor-side>#search-draft,#editor .editor-side>#suggest-point,#editor .editor-side>#point-suggestion{display:none}
 #editor .editor-side>#start-pair{display:block;min-height:44px;font-size:14px;margin:0;padding:10px;text-align:center;background:var(--tint)}
 #editor[data-mobile-panel=points] .pairs-heading{display:flex;flex:none;margin:0;padding:2px 0;font-size:11px}
 #editor[data-mobile-panel=points] #pair-list{display:block;flex:1 1 auto;overflow:auto;min-height:0;max-height:none;overscroll-behavior:contain}
 #editor[data-mobile-panel=points] .group-row{padding:10px 0}#editor .group-photo-buttons button{font-size:13px;min-height:44px}
 #editor[data-mobile-panel=more] .phone-gesture-help{display:block;font-size:14px;line-height:1.5;margin:0}
 #editor[data-mobile-panel=more] .auto-option{display:flex;font-size:13px;line-height:1.5;margin:0}
 #editor[data-mobile-panel=more] #search-draft,#editor[data-mobile-panel=more] #suggest-point:not([hidden]){display:flex;min-height:44px;font-size:13px;margin:0}
 #editor[data-mobile-panel=more] #point-suggestion:not(:empty){display:block;font-size:13px;max-height:none;margin:0}
 #editor[data-mobile-panel=more] #pair-list,#editor[data-mobile-panel=more] .pairs-heading{display:none}
 #editor #editor-status{display:block;font-size:12px;margin:0;max-height:60px}#editor #editor-status:empty{display:none}
 #editor .editor-mobile-dock{display:block;flex:none;background:white;padding:4px 8px 8px;border-top:1px solid var(--line)}
 #editor .mobile-instruction-row{display:flex;align-items:center;gap:6px;min-height:36px}#editor #mobile-point-instruction{flex:1;font-size:12px;line-height:1.3;margin:0;padding:3px 0;color:#444}
 #editor #mobile-new{width:40px;height:36px;min-width:40px;font-size:22px;line-height:1}
 #editor #mobile-editor-actions,#editor #mobile-confirm-actions{display:flex;gap:6px;align-items:center}
 #editor #mobile-editor-actions button,#editor #mobile-confirm-actions button{min-height:44px;padding:9px 12px;font-size:12px;line-height:1.2;margin:0;white-space:nowrap}
 #editor #mobile-points{flex:0 0 auto}#editor #mobile-more{flex:0 0 auto}#editor #mobile-apply,#editor #confirm-point{flex:1}#editor #cancel-point{min-width:80px}
 #editor #point-fine-controls{display:flex;align-items:center;justify-content:center;gap:4px;padding-bottom:4px}
 #editor #point-fine-controls span{font-size:12px;color:#666;margin-right:6px}#editor #point-fine-controls button{width:44px;height:40px;background:#f5f5f5;border:1px solid var(--line);border-radius:10px;font-size:18px}
 #editor[data-pending=true] .zoom-controls{opacity:.9}
}
@media(max-width:1000px) and (max-height:500px) and (orientation:landscape){
 #editor .editor-header{min-height:44px;height:44px;padding-top:0;padding-bottom:0}#editor .editor-toolbar{padding-top:0;padding-bottom:0}#editor #point-tabs button{min-height:36px;padding:6px}
 #editor .editor-mobile-dock{padding:3px 8px 4px;display:flex;align-items:center;gap:8px;min-height:52px}
 #editor .mobile-instruction-row{flex:1;min-width:120px}#editor #point-fine-controls{padding:0;gap:2px}#editor #point-fine-controls span{display:none}
 #editor #point-fine-controls button{width:36px;height:36px}#editor #mobile-confirm-actions,#editor #mobile-editor-actions{flex:0 0 auto}#editor #mobile-editor-actions button,#editor #mobile-confirm-actions button{padding:8px 12px}
}
/* Fine adjustment floats over the photo, so grabbing a point never resizes or moves the image. */
@media(max-width:700px),(max-width:1000px) and (max-height:500px),(max-width:1000px) and (pointer:coarse){
 #editor .editor-mobile-dock{position:relative}
 #editor #point-fine-controls{position:absolute;bottom:calc(100% + 8px);left:8px;padding:4px!important;border-radius:14px;background:#fffffff5;box-shadow:0 2px 12px #0004;z-index:6}
 #editor[data-fine=true] .zoom-controls{bottom:62px}
}
@media(max-width:700px),(max-width:1000px) and (max-height:500px),(max-width:1000px) and (pointer:coarse){#editor[data-gesture-active=true] .zoom-controls,#editor[data-gesture-active=true] #point-fine-controls{pointer-events:none}}
@media(max-width:700px),(max-width:1000px) and (max-height:500px),(max-width:1000px) and (pointer:coarse){
 #editor .marker::before,#editor .marker::after{display:none}#editor .marker-crosshair{display:block;overflow:visible}
 #editor .marker.automatic-marker{width:30px;height:30px;background:transparent;border:0;box-shadow:none;z-index:0;opacity:.9}#editor .automatic-marker .marker-number{font-size:9px;width:25px;height:20px;top:-6px;right:-9px;background:#227f9d;border-width:1px}
 #editor #mobile-new{min-width:76px;width:auto;height:36px;padding:6px 10px;font-size:12px;line-height:1.1}
 #editor .editor-side>#automatic-point-list,#editor .editor-side>#automatic-point-toggle,#editor .editor-side>#editor-find-auto{display:none}
 #editor[data-mobile-panel=points] #automatic-point-list{display:block;flex:none;overflow:visible;max-height:none;margin-top:8px}#editor[data-mobile-panel=points] #pair-list{flex:none;overflow:visible}
 #editor[data-mobile-panel=more] #automatic-point-toggle{display:flex;font-size:13px;line-height:1.4}#editor[data-mobile-panel=more] #editor-find-auto{display:flex;min-height:44px;font-size:13px}
 #editor .automatic-row>.text-button{font-size:12px}#editor #automatic-point-list>.hint{max-height:none;line-height:1.5}
}
@media(max-width:700px),(max-width:1000px) and (max-height:500px),(max-width:1000px) and (pointer:coarse){
 #editor .mobile-instruction-row{height:42px}#editor #mobile-point-instruction{max-height:34px;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}
 #editor #mobile-point-error{position:absolute;left:8px;right:8px;bottom:calc(100% + 62px);z-index:12;background:white;border:1px solid var(--red);border-radius:12px;box-shadow:0 2px 16px #0005;color:#a00012;font-size:13px;line-height:1.45;padding:12px;margin:0;max-height:110px;overflow:auto}
}