/* Layout, cartões de seção, ambientes e caixa de observação */
  /* ---------- layout ---------- */
  .wrap{max-width:980px;margin:0 auto;padding:36px 22px 100px;}

  .hero{
    background:var(--card);
    border:1px solid var(--line);
    border-radius:14px;
    padding:34px 36px;
    margin-bottom:26px;
    position:relative;
    overflow:hidden;
  }
  .hero::before{
    content:"";
    position:absolute; top:0; right:0; width:130px; height:130px;
    border-top:3px solid var(--gold);
    border-right:3px solid var(--gold);
    border-top-right-radius:14px;
    opacity:.5;
  }
  .hero h1{margin:0 0 6px; font-size:25px; font-weight:800; letter-spacing:-.015em;}
  .hero p.sub{margin:0 0 26px; color:var(--muted); font-size:13.5px; max-width:520px;}
  .grid-fields{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
    gap:18px;
  }
  .field label{
    display:block; font-size:11px; font-weight:600; text-transform:uppercase;
    letter-spacing:.06em; color:var(--muted); margin-bottom:6px;
  }
  .field input, .field select{
    width:100%; padding:9px 11px; border:1px solid var(--line); border-radius:8px;
    font-family:var(--font-ui); font-size:13.5px; background:#fff; color:var(--ink);
  }
  .field input:focus, .field select:focus{outline:2px solid var(--gold-light); border-color:var(--gold);}

  /* ---------- add room ---------- */
  .addroom{
    background:var(--card);
    border:1px dashed var(--gold);
    border-radius:14px;
    padding:20px 24px;
    display:flex;
    align-items:center;
    gap:14px;
    flex-wrap:wrap;
    margin-bottom:22px;
  }
  .addroom .label{font-family:var(--font-ui);font-weight:600;font-size:13.5px;white-space:nowrap;}
  .addroom select, .addroom input[type=text]{
    padding:9px 11px;border:1px solid var(--line);border-radius:8px;font-size:13.5px;font-family:var(--font-ui);
  }

  /* ---------- room card ---------- */
  .room{
    background:var(--card);
    border:1px solid var(--line);
    border-radius:14px;
    margin-bottom:22px;
    overflow:hidden;
  }
  .room-head{
    background:var(--ink);
    color:#fff;
    padding:17px 24px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    cursor:pointer;
  }
  .room-head .left{display:flex;align-items:center;gap:14px;flex:1;}
  .room-head input.roomname{
    background:transparent;border:none;border-bottom:1px solid rgba(255,255,255,.35);
    color:#fff;font-family:var(--font-ui);font-weight:700;font-size:16px; letter-spacing:-.01em;
    padding:3px 2px; max-width:260px;
  }
  .room-head input.roomname:focus{outline:none;border-bottom-color:var(--gold);}
  .room-head .tag{
    font-size:10.5px; text-transform:uppercase; letter-spacing:.08em;
    background:rgba(255,255,255,.1); padding:4px 10px; border-radius:999px; color:var(--gold-light);
  }
  .room-head .counts{font-size:12px; color:var(--gold-light); white-space:nowrap;}
  .room-head .chev{transition:transform .18s ease; opacity:.8;}
  .room.collapsed .chev{transform:rotate(-90deg);}
  .room-head .icon-btn{
    background:transparent;border:none;color:#e9c98a;cursor:pointer;font-size:15px;padding:4px 6px;
    border-radius:6px;
  }
  .room-head .icon-btn:hover{background:rgba(255,255,255,.12);}

  .room-body{padding:10px 24px 24px;}
  .room.collapsed .room-body{display:none;}

  .cat{margin-top:24px;}
  .cat h4{
    font-family:var(--font-ui); font-size:12px; font-weight:700; text-transform:uppercase;
    letter-spacing:.08em; color:var(--gold-dark); margin:0 0 10px; padding-bottom:8px;
    border-bottom:1px solid var(--line);
  }
  .item{border-bottom:1px dotted var(--line); padding:12px 2px;}
  .item:last-child{border-bottom:none;}
  .item-row{
    display:flex; align-items:center; gap:12px;
  }
  .item-row .name{flex:1; font-size:13.5px; line-height:1.4;}
  .info-btn{
    border:1px solid var(--line); background:#fff; color:var(--gold-dark);
    width:22px; height:22px; border-radius:50%; font-size:12px; font-weight:700;
    cursor:pointer; flex-shrink:0; line-height:1; font-family:var(--font-ui);
  }
  .info-btn.active{background:var(--gold); color:#fff; border-color:var(--gold);}
  .info-btn:disabled{opacity:.25; cursor:default;}
  .seg{display:flex; border:1px solid var(--line); border-radius:8px; overflow:hidden; flex-shrink:0;}
  .seg button{
    border:none; background:#fff; padding:6px 11px; font-size:11.5px; font-weight:600;
    font-family:var(--font-ui); cursor:pointer; color:var(--muted); border-right:1px solid var(--line);
  }
  .seg button:last-child{border-right:none;}
  .seg button.active-ok{background:var(--ok-bg); color:var(--ok);}
  .seg button.active-bad{background:var(--bad-bg); color:var(--bad);}
  .seg button.active-na{background:var(--na-bg); color:var(--muted);}
  .seg button.active-reinsp{background:var(--reinsp-bg); color:var(--reinsp);}

  .infobox{
    display:none; margin:8px 0 4px; padding:12px 14px; background:var(--info-bg);
    border-left:3px solid var(--gold); border-radius:0 8px 8px 0; font-size:12.5px; color:#4a4433;
  }
  .infobox.show{display:block;}
  .infobox b{color:var(--ink); font-family:var(--font-ui); font-size:11px; text-transform:uppercase; letter-spacing:.04em;}
  .infobox ul{margin:4px 0 10px; padding-left:18px;}
  .infobox ul:last-child{margin-bottom:0;}
  .infobox .ensaio{margin:4px 0 10px;}
  .infobox .atencao{background:#FBF3E3; border-left:2px solid #D9A441; padding:6px 10px; border-radius:4px; margin:0;}

  .obsrow{padding:6px 2px 6px; display:none;}
  .obsrow.show{display:block;}

  /* Observação: caixa que cresce com o texto (sem rolagem interna) +
     barra de ferramentas simples (negrito / aumentar fonte). O conteúdo
     é guardado como HTML (it.obs), por isso vira texto puro no PDF. */
  .obs-toolbar{display:flex; gap:6px; margin-bottom:6px;}
  .obs-tool-btn{
    border:1px solid var(--bad); background:#fff; color:var(--bad); border-radius:6px;
    width:28px; height:26px; font-size:13px; cursor:pointer; font-family:var(--font-ui); line-height:1;
  }
  .obs-tool-btn:hover{background:var(--bad-bg);}
  .obs-tool-select{
    border:1px solid var(--bad); background:#fff; color:var(--bad); border-radius:6px;
    height:26px; font-size:11.5px; cursor:pointer; font-family:var(--font-ui); padding:0 4px;
  }
  .obsrow-ok .obs-tool-select{border-color:var(--ok); color:var(--ok);}
  .obs-editor{
    width:100%; min-height:44px; border:1px solid var(--bad); background:var(--bad-bg);
    border-radius:8px; padding:8px 10px; font-family:var(--font-ui); font-size:13px;
    color:#5a221e; white-space:pre-wrap; word-wrap:break-word; outline:none;
  }
  .obs-editor:empty:before{content:attr(data-placeholder); color:#a9615a;}
  .obs-editor h4{font-family:var(--font-ui); font-size:15px; font-weight:700; margin:4px 0 2px;}
  .obs-editor h5{font-family:var(--font-ui); font-size:12.5px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; margin:4px 0 2px; opacity:.85;}
  .obs-editor p{margin:2px 0;}