/* Revize 31 — Odanı Tasarla telefon düzeni.
   Dikey: plan ekranı doldurur ve küçülmez; ayarlar alttan, planın ÜSTÜNE açılan, parmakla sürüklenebilen bir çekmecede.
   Yatay: plan solda, menüler sağda — hepsi tek ekranda. */
.sheet-handle,.lm-home{display:none}

/* ---------- Dikey telefon ---------- */
@media (max-width:700px) and (min-height:501px){
  :root{--studio-toolbar-height:100px}
  header,.bloom-embedded header{height:var(--studio-toolbar-height)!important;padding:8px 12px 2px!important;grid-template-rows:32px 56px!important;gap:4px 10px!important}
  header .steps button{padding:3px 2px!important;gap:4px!important}
  header .steps i{width:22px!important;height:22px!important}
  html,body{height:100%;overflow:hidden;overscroll-behavior:none}
  main{display:block!important;position:relative;height:calc(100dvh - var(--studio-toolbar-height))!important;min-height:0!important;overflow:hidden}
  .workspace{position:absolute!important;inset:0 0 calc(var(--sheet-peek,84px) - 16px) 0;display:flex!important;flex-direction:column;min-height:0;padding:6px 10px 2px!important;overflow:hidden}
  .canvas-top{position:absolute;z-index:6;top:14px;right:18px;margin:0!important}
  .canvas-top>div:first-child{display:none}
  .view-toggle{transform:scale(.86);transform-origin:top right}
  .stage{flex:1 1 auto!important;min-height:0!important;height:auto!important}
  #plan{position:absolute!important;inset:0!important;height:100%!important;width:100%!important}
  .scene-badge{top:10px!important;left:12px!important}
  .plan-tools[hidden]{display:none!important}
  .plan-tools{bottom:8px!important;padding:3px!important;gap:2px!important;display:flex!important;flex-wrap:nowrap!important;width:auto!important;max-width:calc(100% - 16px);grid-template-columns:none!important}
  .plan-tools button{font-size:10.5px!important;padding:7px 8px!important;white-space:nowrap}
  .plan-tools #plan-zoom{display:none}
  .canvas-bottom{padding:4px 2px 0!important;font-size:11px;flex-wrap:nowrap!important;gap:8px}
  .canvas-bottom #hint{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
  #warnings{font-size:11px}
  #warnings:empty,.model-loading:has(#model-status:empty){display:none}

  aside{position:absolute!important;left:0;right:0;bottom:0;z-index:7;display:flex!important;flex-direction:column;height:var(--sheet-h,48%);min-height:0!important;background:#fffdf9;border:0!important;border-top:1px solid #e3dccf!important;border-radius:22px 22px 0 0;box-shadow:0 -14px 34px rgba(55,47,41,.14);transition:height .34s cubic-bezier(.22,1,.36,1);overflow:hidden!important}
  aside.sheet-dragging{transition:none}
  aside .aside-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding-top:0!important}
  aside.sheet-min .aside-scroll{display:none}
  aside .step-footer{flex:0 0 auto;padding:6px 12px calc(8px + env(safe-area-inset-bottom))!important;position:static!important}
  .sheet-handle{display:flex;align-items:center;justify-content:center;flex:0 0 auto;width:100%;height:26px;padding:0;border:0;border-radius:22px 22px 0 0;background:transparent;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none}
  .sheet-handle::before{content:"";width:44px;height:5px;border-radius:9px;background:#cfc5b6}
  .sheet-handle:active{cursor:grabbing}
  .sheet-handle:focus-visible{outline:2px solid #536346;outline-offset:-4px}

  aside #catalog{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important}
  aside #catalog .product{padding:6px!important}
  aside #catalog .product img{aspect-ratio:1/1;height:auto!important;object-fit:cover}
  aside #catalog .product strong{font-size:11px!important;line-height:1.25}
  aside #catalog .product small{display:none}

  #toast{bottom:auto!important;top:calc(var(--studio-toolbar-height) + 60px)!important}
  body:has(.placing-pill) #toast{display:none!important}
}

/* yerleştirme uyarısı (dikey ve yatay) */
.placing-pill{position:absolute;z-index:8;left:50%;top:12px;transform:translateX(-50%);display:flex;align-items:center;gap:10px;max-width:calc(100% - 150px);padding:9px 10px 9px 14px;border-radius:999px;background:#2f3a2c;color:#fff;font:600 12px/1.3 'Bricolage Grotesque',sans-serif;box-shadow:0 8px 22px rgba(0,0,0,.18)}
.placing-pill span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.placing-pill button{flex:0 0 auto;border:0;border-radius:999px;padding:5px 9px;background:rgba(255,255,255,.18);color:#fff;font:600 11px/1 'Bricolage Grotesque',sans-serif}

/* ---------- Yatay telefon: plan solda, menüler sağda ---------- */
@media (orientation:landscape) and (max-height:500px){
  :root{--studio-toolbar-height:46px}
  html,body{height:100%;overflow:hidden;overscroll-behavior:none}
  header,.bloom-embedded header{height:46px!important;display:flex!important;grid-template:none!important;align-items:center;gap:8px!important;padding:0 10px!important}
  header>.brand,.project-title,.bloom-embedded .project-title{display:none!important}
  .bloom-embedded .lm-home{display:inline-flex;align-items:center;flex:0 0 auto;padding:6px 10px;border:1px solid #d9d1c3;border-radius:99px;color:#342b24;font:600 11px/1 'Bricolage Grotesque',sans-serif;text-decoration:none;white-space:nowrap}
  header .steps{flex:1 1 auto;display:flex!important;justify-content:center;gap:2px!important;width:auto!important;min-width:0;grid-column:auto!important;grid-row:auto!important}
  header .steps button{flex-direction:row!important;gap:5px!important;padding:4px 6px!important;min-width:0}
  header .steps span{font-size:11px!important;white-space:nowrap}
  header .steps small{display:none!important}
  header .steps i{width:22px!important;height:22px!important;font-size:9px!important;flex:none}
  header .steps .active:after{bottom:-3px!important}
  .header-actions{grid-column:auto!important;grid-row:auto!important;flex:0 0 auto;gap:4px!important}
  .header-actions button{font-size:10px!important;padding:6px 8px!important}
  main{display:grid!important;grid-template-columns:minmax(0,1fr) min(40vw,330px)!important;height:calc(100dvh - 46px)!important;min-height:0!important;overflow:hidden}
  .workspace{position:relative!important;inset:auto!important;display:flex!important;flex-direction:column;min-height:0;padding:4px 6px 4px 8px!important;overflow:hidden}
  .canvas-top{position:absolute;z-index:6;top:10px;right:14px;margin:0!important}
  .canvas-top>div:first-child{display:none}
  .view-toggle{transform:scale(.8);transform-origin:top right}
  .stage{flex:1 1 auto!important;min-height:0!important;height:auto!important}
  #plan{position:absolute!important;inset:0!important;height:100%!important;width:100%!important}
  .scene-badge{top:8px!important;left:10px!important;font-size:9px!important}
  .plan-tools[hidden]{display:none!important}
  .plan-tools{bottom:6px!important;padding:3px!important;gap:2px!important;display:flex!important;flex-wrap:nowrap!important;width:auto!important;max-width:calc(100% - 12px);grid-template-columns:none!important}
  .plan-tools button{font-size:10px!important;padding:6px 7px!important;white-space:nowrap}
  .plan-tools #plan-zoom{display:none}
  .camera-controls{bottom:6px!important;transform:translateX(-50%) scale(.86)!important;transform-origin:bottom center}
  .canvas-bottom{padding:2px 2px 0!important;font-size:10px;flex-wrap:nowrap!important;gap:8px}
  .canvas-bottom #hint{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
  #warnings{font-size:10px}
  #warnings:empty,.model-loading:has(#model-status:empty){display:none}
  aside{position:relative!important;display:flex!important;flex-direction:column;height:auto!important;min-height:0!important;border:0!important;border-left:1px solid #ddd7cc!important;border-radius:0!important;box-shadow:none!important;overflow:hidden!important}
  aside .aside-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:10px 14px!important;visibility:visible!important}
  aside .step-footer{flex:0 0 auto;padding:6px 10px calc(6px + env(safe-area-inset-bottom))!important;position:static!important}
  aside .step-footer button{padding:9px 10px!important;font-size:12px!important}
  aside #panel h2{font-size:22px!important;margin:4px 0 6px!important}
  aside #panel .intro{font-size:12.5px!important;margin-bottom:10px!important}
  aside #catalog{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  aside #catalog .product small{display:none}
  .sheet-handle{display:none!important}
  #toast{bottom:auto!important;top:52px!important}
  .placing-pill{max-width:calc(100% - 120px)}
}
@media (max-width:700px) and (min-height:501px){.placing-pill{top:54px;max-width:calc(100% - 40px)}}
