/* Keep the desktop composition; mobile editors open only when requested. */
.mobile-mode-row{display:contents}
#starShapeToggle,#starShapeClose,#starSettingsClose,.mobile-sheet-heading,.mobile-shape-close{display:none}
.mobile-sheet-backdrop{display:none}
.mobile-shape-heading{display:block}
@media(max-width:800px),(max-height:500px) and (pointer:coarse){
  .star-view{--mobile-toolbar-height:96px;--mobile-keyboard-inset:0px;--mobile-viewport-height:100dvh;touch-action:none}
  .star-top{top:max(12px,env(safe-area-inset-top));left:12px;right:12px;grid-template-columns:40px minmax(0,1fr) 84px;gap:8px}
  .star-title{min-width:0}
  .star-title small{font-size:8px;letter-spacing:.17em}
  .star-title h2{font-size:clamp(23px,7.1vw,36px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin:5px 0}
  .star-title p{font-size:10px;line-height:1.5;letter-spacing:.04em}
  .star-circle{width:40px;height:40px;font-size:22px}
  .star-gallery-button{padding:6px 8px;font-size:11px;min-height:40px}
  .star-bottom{bottom:max(10px,env(safe-area-inset-bottom));width:min(440px,calc(100% - 20px));gap:8px}
  .star-tools{width:auto;max-width:100%;flex-wrap:nowrap;gap:5px;padding:5px 7px;border-radius:99px}
  .star-tools label{display:none}
  .star-tools .star-tool{min-height:40px;padding:0 clamp(9px,2.6vw,14px);font-size:11px;letter-spacing:0}
  .mobile-mode-row{display:flex;justify-content:center;align-items:center;width:100%;gap:8px}
  .star-mode{padding:3px;box-shadow:0 5px 24px #0007}
  .star-mode button{height:38px;min-width:76px;font-size:12px}
  #starShapeToggle{min-height:44px;min-width:116px;padding:0 12px;border:1px solid #d5b66f6b;border-radius:99px;background:#171015e8;color:#f6d787;font-size:12px;white-space:nowrap}
  .star-view.is-gallery #starShapeToggle{display:block}
  #starShapeToggle[aria-expanded=true]{background:#38291d;border-color:#e8c474}
  .star-view:not(.mobile-shape-open) #starShapePanel{display:none}
  #starShapePanel,#starSettingsPanel{position:absolute;z-index:7;top:auto;left:12px;right:12px;bottom:calc(var(--mobile-toolbar-height) + max(10px,env(safe-area-inset-bottom)) + 10px);width:auto;min-width:0;max-height:max(100px,min(430px,calc(var(--mobile-viewport-height) - var(--mobile-toolbar-height) - 32px)));overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y;padding:12px 14px;border:1px solid #d4ad666e;border-radius:20px;background:#110d15f5;box-shadow:0 16px 54px #000a;backdrop-filter:blur(20px);scroll-padding:12px}
  #starShapePanel{max-height:max(100px,min(340px,calc(var(--mobile-viewport-height) - var(--mobile-toolbar-height) - 32px)))}
  .mobile-sheet-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:38px;margin:0 0 4px;color:#f5d782;font-size:13px}
  .mobile-sheet-heading strong{font-size:13px;letter-spacing:.06em}
  #starShapeClose,#starSettingsClose{display:grid;place-items:center;flex:none;min-width:40px;width:40px;min-height:40px;height:40px;margin:0 -5px 0 0;padding:0;border:1px solid #d6b07535;border-radius:50%;background:#ffffff08;color:#f3e5d6;font:22px/1 system-ui;text-align:center}
  #starShapePanel>label{margin:4px 0 6px;font-size:12px}
  #starShapePanel #starShapeInput{min-height:44px;font-size:16px;padding:9px 12px}
  #starShapePanel small{font-size:11px;line-height:1.5}
  #starShapePanel .star-color-control{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;margin-top:10px;padding-top:10px}
  #starShapePanel .star-color-heading{grid-column:1/-1;font-size:12px}
  #starShapePanel .star-color-options{gap:clamp(2px,1vw,5px);margin:0;justify-content:space-between;max-width:256px}
  #starShapePanel .star-color-option{width:40px;height:44px;min-width:0;border-radius:50%;background-clip:content-box;padding:5px 3px;border-color:transparent;box-shadow:none}
  #starShapePanel .star-color-option:after{inset:5px 3px;border-radius:50%;box-shadow:0 0 10px var(--swatch)}
  #starShapePanel .star-color-option[aria-pressed=true]{outline:2px solid #f5d782;outline-offset:0}
  #starShapePanel .star-color-custom{font-size:0;margin:0!important;gap:0}
  #starShapePanel .star-color-custom input{width:40px!important;height:44px!important;min-height:44px!important;padding:5px!important;background:#271e21}
  #starShapePanel .star-color-control small{grid-column:1/-1;margin:0}
  #starSettingsPanel{max-height:min(54dvh,calc(var(--mobile-viewport-height) - var(--mobile-toolbar-height) - 32px))}
  #starSettingsPanel>button:not(#starSettingsClose),#starSettingsPanel .star-copy-form button{min-height:44px;font-size:13px}
  #starSettingsPanel input[type=text]{font-size:16px;min-height:44px}
  #starSettingsPanel [data-static-status]{font-size:11px}
  #starSettingsPanel .mobile-density{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px;color:#e7d0a6;font-size:12px}
  #starSettingsPanel .mobile-density input{width:140px;max-width:52%;height:30px;accent-color:#e8c34f}
  .mobile-sheet-backdrop:not([hidden]){display:block;position:absolute;z-index:6;top:0;left:0;right:0;bottom:calc(var(--mobile-toolbar-height) + max(10px,env(safe-area-inset-bottom)) + 2px);padding:0;border:0;border-radius:0;background:#0002;touch-action:none;cursor:default}
  .star-empty{top:72%;width:min(88%,360px)}
  .star-empty p{font-size:11px;margin-bottom:8px}
  .star-empty button{min-height:40px;padding:8px 17px;font-size:12px}
  .star-gesture-hint{bottom:calc(var(--mobile-toolbar-height) + 24px);font-size:10px;max-width:170px;left:12px}
  .mobile-keyboard-open .star-bottom{visibility:hidden}
  .mobile-keyboard-open #starShapePanel,.mobile-keyboard-open #starSettingsPanel{bottom:calc(var(--mobile-keyboard-inset) + 10px);max-height:calc(var(--mobile-viewport-height) - 24px)}
  .mobile-keyboard-open .mobile-sheet-backdrop{bottom:var(--mobile-keyboard-inset)}
  body #gesturePreview{top:max(80px,calc(env(safe-area-inset-top) + 70px));left:12px;width:112px;padding:5px}
  body #gesturePreview .gesture-heading{font-size:10px;letter-spacing:0;min-height:28px}
  body #gesturePreview .gesture-close{width:30px;height:30px;flex:none}
  body #gesturePreview .gesture-status{font-size:10px;line-height:1.5}
  #gestureGuide{display:none!important}
  body.mobile-star-sheet #gesturePreview{visibility:hidden;pointer-events:none}
}
@media(max-height:500px) and (pointer:coarse){
  .star-top{top:8px}.star-title h2{font-size:23px}.star-title small,.star-title p{display:none}
  .star-bottom{width:min(560px,calc(100% - 24px));display:flex;justify-content:center;gap:8px}
  .mobile-mode-row{width:auto;flex:none}.star-mode button{min-width:62px}
  .star-tools .star-tool{padding:0 9px}#starShapeToggle{min-width:104px;padding:0 9px}
  #starShapePanel,#starSettingsPanel{left:auto;right:12px;width:min(360px,calc(100% - 24px));max-height:calc(var(--mobile-viewport-height) - var(--mobile-toolbar-height) - 24px)}
  .star-empty{top:70%}.star-empty p{display:none}
  body #gesturePreview{top:58px;width:100px}
}
@media(max-width:650px) and (max-height:500px) and (pointer:coarse){.star-bottom{display:grid}.mobile-mode-row{width:100%}}