.bam-polacco-final-studio{display:grid;gap:20px;max-width:1500px;margin:0 auto;padding-bottom:24px}
.bam-polacco-project-context{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:18px 22px;border:1px solid rgba(216,173,90,.22);border-radius:18px;background:linear-gradient(135deg,rgba(216,173,90,.08),rgba(8,30,55,.9))}
.bam-polacco-project-context h2{margin:4px 0 2px;font-family:"Cormorant Garamond",serif;font-size:34px;font-weight:500}.bam-polacco-project-context p{margin:0;color:rgba(236,227,212,.58)}
.bam-polacco-context-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:flex-end}.bam-polacco-sheet-state{display:inline-flex;align-items:center;gap:7px;padding:8px 11px;border-radius:999px;background:rgba(220,148,72,.08);color:#e7c77e;font-size:12px;border:1px solid rgba(216,173,90,.2)}.bam-polacco-sheet-state.ready{color:#bfe2c4;background:rgba(103,170,120,.09);border-color:rgba(103,170,120,.25)}
.bam-polacco-flow{display:grid;grid-template-columns:auto 1fr auto 1fr auto 1fr auto;align-items:center;gap:10px;padding:2px 8px}.bam-polacco-flow span{display:flex;align-items:center;gap:8px;color:rgba(236,227,212,.42);font-size:12px;text-transform:uppercase;letter-spacing:.12em;white-space:nowrap}.bam-polacco-flow span b{display:grid;place-items:center;width:25px;height:25px;border-radius:50%;border:1px solid rgba(255,255,255,.12);font-size:11px}.bam-polacco-flow span.done,.bam-polacco-flow span.active{color:#ecd9ac}.bam-polacco-flow span.done b{background:rgba(216,173,90,.14);border-color:rgba(216,173,90,.35)}.bam-polacco-flow span.active b{background:#ddb04f;color:#05182c;border-color:#ddb04f}.bam-polacco-flow i{height:1px;background:rgba(255,255,255,.09)}
.bam-polacco-work-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:20px}.bam-polacco-panel{border:1px solid rgba(255,255,255,.08);border-radius:20px;background:linear-gradient(180deg,rgba(12,41,71,.92),rgba(5,24,44,.94));padding:22px;min-width:0}.bam-polacco-panel>header{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;margin-bottom:18px}.bam-polacco-panel h3{margin:3px 0 6px;font-family:"Cormorant Garamond",serif;font-size:29px;font-weight:500}.bam-polacco-panel header p{margin:0;max-width:650px;color:rgba(236,227,212,.55);font-size:13px;line-height:1.5}.bam-polacco-count{display:flex;align-items:baseline;gap:4px;padding:8px 12px;border-radius:13px;background:rgba(2,15,29,.45);border:1px solid rgba(255,255,255,.07)}.bam-polacco-count strong{font-size:20px;color:#e7c77e}.bam-polacco-count span{font-size:12px;color:rgba(236,227,212,.42)}
.bam-polacco-source-grid{display:flex;flex-wrap:nowrap;gap:12px;overflow-x:auto;overflow-y:hidden;padding:2px 4px 10px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch}
.bam-polacco-source-grid>*{flex:0 0 auto;width:clamp(96px,16vw,190px);scroll-snap-align:start}
.bam-polacco-source-grid::-webkit-scrollbar{height:6px}
.bam-polacco-source-grid::-webkit-scrollbar-thumb{background:rgba(231,199,126,.35);border-radius:3px}.bam-polacco-source{display:grid;gap:10px;padding:10px;border:1px solid rgba(255,255,255,.08);border-radius:16px;background:rgba(3,20,38,.55)}.bam-polacco-source.master{border-color:rgba(216,173,90,.55);box-shadow:0 0 0 1px rgba(216,173,90,.12) inset}.bam-polacco-source-image{position:relative;overflow:hidden;border-radius:12px;background:#020914;aspect-ratio:4/3}.bam-polacco-source-image img{width:100%;height:100%;object-fit:cover;display:block}.bam-polacco-sequence{position:absolute;left:9px;bottom:8px;display:grid;place-items:center;min-width:29px;height:24px;padding:0 7px;border-radius:8px;background:rgba(2,12,24,.78);font-size:11px;color:#fff}.bam-polacco-master,.bam-polacco-remove{position:absolute;top:8px;display:grid;place-items:center;width:32px;height:32px;border:0;border-radius:50%;background:rgba(2,12,24,.8);color:#fff}.bam-polacco-master{left:8px;color:#e7c77e}.bam-polacco-remove{right:8px}.bam-polacco-source>input{width:100%;border:0;border-bottom:1px solid rgba(255,255,255,.09);background:transparent;color:#f0e7d7;padding:3px 2px 8px;font-size:13px}.bam-polacco-order{display:grid;grid-template-columns:32px 1fr 32px;align-items:center;gap:8px}.bam-polacco-order button{height:30px;border:1px solid rgba(255,255,255,.08);border-radius:9px;background:rgba(255,255,255,.03);color:#d6ccbc}.bam-polacco-order small{text-align:center;color:rgba(236,227,212,.47);font-size:10px;text-transform:uppercase;letter-spacing:.09em}
.bam-polacco-drop{display:grid;place-items:center;gap:9px;min-height:330px;width:100%;border:1px dashed rgba(216,173,90,.35);border-radius:17px;background:rgba(216,173,90,.035);color:#ede3d2}.bam-polacco-drop span{display:grid;place-items:center;width:58px;height:58px;border-radius:16px;background:rgba(216,173,90,.1);color:#e7c77e}.bam-polacco-drop strong{font-size:16px}.bam-polacco-drop small{color:rgba(236,227,212,.47)}.bam-polacco-upload-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}.bam-polacco-upload-actions .danger{color:#edaaa0}
.bam-polacco-brief-panel>label{display:block;margin:12px 0 8px;color:#e8decd;font-size:13px}.bam-polacco-brief-panel textarea{width:100%;min-height:255px;resize:vertical;border:1px solid rgba(255,255,255,.1);border-radius:15px;background:rgba(2,15,29,.58);color:#f2eadf;padding:16px 17px;font:400 15px/1.55 Inter,sans-serif;box-sizing:border-box}.bam-polacco-brief-panel textarea:focus{outline:none;border-color:rgba(216,173,90,.52);box-shadow:0 0 0 3px rgba(216,173,90,.07)}.bam-polacco-preserve,.bam-polacco-output-separation{display:flex;gap:12px;align-items:flex-start;margin-top:14px;padding:14px;border-radius:14px;border:1px solid rgba(255,255,255,.07);background:rgba(255,255,255,.025)}.bam-polacco-preserve>span,.bam-polacco-output-separation>span{display:grid;place-items:center;width:38px;height:38px;flex:0 0 38px;border-radius:11px;background:rgba(216,173,90,.09);color:#e7c77e}.bam-polacco-preserve strong,.bam-polacco-output-separation strong{display:block;margin-bottom:4px;font-size:13px}.bam-polacco-preserve p,.bam-polacco-output-separation p{margin:0;color:rgba(236,227,212,.52);font-size:12px;line-height:1.5}.bam-polacco-format{display:grid!important;grid-template-columns:1fr 160px;align-items:center;gap:12px;margin-top:16px!important;padding:13px 14px;border-radius:14px;border:1px solid rgba(255,255,255,.07);background:rgba(255,255,255,.02)}.bam-polacco-format span{font-size:12px;color:rgba(236,227,212,.68)}.bam-polacco-format select{width:100%;border:1px solid rgba(255,255,255,.09);border-radius:10px;background:#071d34;color:#efe7d9;padding:10px}
.bam-polacco-generate-bar{position:sticky;bottom:12px;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:17px 18px;border:1px solid rgba(216,173,90,.24);border-radius:18px;background:rgba(4,22,40,.94);backdrop-filter:blur(18px);box-shadow:0 18px 45px rgba(0,0,0,.28)}.bam-polacco-generate-bar>div{display:grid;gap:4px}.bam-polacco-generate-bar strong{font-size:13px}.bam-polacco-generate-bar small{color:rgba(236,227,212,.48)}.bam-polacco-generate-bar .bam-primary{min-width:260px;justify-content:center}
@media(max-width:1100px){.bam-polacco-work-grid{grid-template-columns:1fr}.bam-polacco-source-grid{max-height:none}.bam-polacco-project-context{align-items:flex-start}.bam-polacco-context-actions{max-width:340px}}
@media(max-width:720px){.bam-polacco-project-context{flex-direction:column}.bam-polacco-context-actions{justify-content:flex-start;max-width:none}.bam-polacco-flow{grid-template-columns:1fr 1fr;gap:8px}.bam-polacco-flow i{display:none}.bam-polacco-flow span{border:1px solid rgba(255,255,255,.07);border-radius:12px;padding:8px}.bam-polacco-panel{padding:16px}.bam-polacco-source-grid{grid-template-columns:1fr 1fr}.bam-polacco-generate-bar{position:static;align-items:stretch;flex-direction:column}.bam-polacco-generate-bar .bam-primary{width:100%;min-width:0}}
@media(max-width:480px){.bam-polacco-source-grid{grid-template-columns:1fr}.bam-polacco-format{grid-template-columns:1fr}.bam-polacco-upload-actions{flex-direction:column}.bam-polacco-upload-actions button{width:100%}}

/* ======================================================================
   LE FOTO IN ORIZZONTALE E IL BRIEF LARGO - 17 agosto 2026, ordine di Danilo.
   ======================================================================

   LE FOTO. Erano a griglia: quattro visibili e le altre da cercare scorrendo
   in basso. Con venti foto significa che la quinta in poi non esiste finche'
   non la vai a cercare. Adesso stanno in UNA FILA sola che scorre di lato, e
   la larghezza di ogni anteprima si stringe da sola man mano che se ne
   caricano - clamp(96px, 16vw, 190px): venti foto restano venti anteprime
   visibili, piccole ma tutte li'.

   IL BRIEF. Stava in una colonna stretta accanto alle foto, e il campo dove si
   scrive era largo un terzo dello schermo. Adesso le due sezioni sono una
   sopra l'altra e il brief prende tutta la larghezza: e' il posto dove il
   broker scrive di piu' e aveva lo spazio minore.

   LE FOTO SI INGRANDISCONO al tocco: l'anteprima piccola serve a scegliere,
   non a giudicare. Vedi bam-polacco-final-ux.js, gestore data-ingrandisci. */
.bam-polacco-brief-panel .bam-brief-input,
.bam-polacco-brief-panel textarea{width:100%;min-height:132px}

/* La lente sull'anteprima: si vede solo dove serve, senza rubare spazio. */
.bam-polacco-source-card{position:relative}
.bam-polacco-source-card .bam-ingrandisci{position:absolute;left:6px;bottom:6px;width:28px;height:28px;display:grid;place-items:center;border:0;border-radius:9px;background:rgba(2,15,29,.72);color:#e7c77e;cursor:pointer}
.bam-lente{position:fixed;inset:0;z-index:80;display:grid;place-items:center;background:rgba(2,10,20,.92);padding:20px}
.bam-lente img{max-width:100%;max-height:100%;border-radius:14px;box-shadow:0 24px 60px rgba(0,0,0,.6)}
.bam-lente button{position:absolute;top:16px;right:16px;min-width:44px;min-height:44px;border-radius:12px;border:1px solid rgba(255,255,255,.18);background:rgba(2,15,29,.8);color:#fff;font-size:20px;cursor:pointer}


/* ======================================================================
   LA CAMPANELLA A DESTRA - 17 agosto 2026, Danilo.
   La barra in alto era una griglia a TRE colonne: titolo | ricerca | azioni.
   Tolta la ricerca, la colonna centrale e' rimasta vuota e la campanella e'
   finita a meta' schermo invece che in fondo. Due colonne sole, e le azioni
   spinte a destra. */
.bam-topbar{grid-template-columns:1fr auto!important}
.bam-top-actions{justify-self:end!important;margin-left:auto}

/* Il campo del brief occupa la larghezza intera del pannello. */
.bam-polacco-brief-panel .bam-ai-composer{width:100%}

/* ======================================================================
   "I MIEI PROGETTI": VIDEO A SINISTRA, PDF A DESTRA - 17 agosto 2026.
   Ordine di Danilo. Prima erano due linguette di filtro in mezzo alle altre:
   per vedere i propri video bisognava sapere che il filtro esisteva e
   ricordarsi di premerlo. Adesso sono sempre a schermo, si vedono entrando.
   Su iPad in verticale e su telefono tornano una sopra l'altra. */
.bam-due-colonne{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:18px 0 22px;align-items:start}
.bam-colonna{border:1px solid rgba(255,255,255,.08);border-radius:18px;background:linear-gradient(180deg,rgba(12,41,71,.86),rgba(5,24,44,.9));padding:16px;min-width:0;display:flex;flex-direction:column}
.bam-colonna>header{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:12px}
.bam-colonna>header small{color:#e7c77e;font-size:15px}
.bam-colonna-lista{display:flex;flex-direction:column;gap:8px}

/* LA PAGINA DEVE SCORRERE, NON LE COLONNE - 18 agosto 2026, rilevato da Danilo.

   Avevo dato alle colonne un'altezza fissa - min-height 100vh meno 300px - e
   messo lo scorrimento DENTRO ognuna. Su iPad il risultato e' che la pagina non
   si muove: il dito finisce dentro una colonna che scorre per conto suo, e
   l'impressione e' che l'app sia bloccata. E' lo stesso errore di chi incastra
   una finestra dentro l'altra.
   Adesso le colonne crescono quanto serve e a scorrere e' la PAGINA, che e' il
   gesto che funziona sempre. */

/* DUE COLONNE PIENE, DA CIMA A FONDO - 17 agosto 2026, correzione di Danilo.
   Erano due riquadri corti appoggiati in alto, con sotto la solita griglia:
   sembravano un'aggiunta, non la struttura della pagina. Adesso occupano
   l'altezza dello schermo e la lista scorre dentro la colonna: Video tutta la
   meta' sinistra, PDF tutta la destra. */
.bam-archive-riga{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;background:rgba(2,15,29,.42);border:1px solid rgba(255,255,255,.06);cursor:pointer;min-height:52px}
.bam-archive-riga:hover{border-color:rgba(216,173,90,.4)}
.bam-archive-riga span{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:rgba(216,173,90,.12);color:#e7c77e;flex:0 0 auto}
.bam-archive-riga strong{display:block;font-size:14px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bam-archive-riga small{color:rgba(236,227,212,.45);font-size:12px}
.bam-colonna-vuota{margin:0;padding:14px;color:rgba(236,227,212,.4);font-size:13px}
@media(max-width:900px){.bam-due-colonne{grid-template-columns:1fr}}

/* I RENDER GIA' FATTI NELLO SPAZIO DI LAVORO - 18 agosto 2026, ordine di
   Danilo: vederli senza uscire dalla schermata dove si carica e si scrive il
   brief. Stessa fila orizzontale delle foto in alto, cosi' il gesto e' lo
   stesso: si scorre di lato, si tocca per ingrandire. */
.bam-fatti{margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.08)}
.bam-fatti>header{display:flex;align-items:baseline;gap:10px;margin-bottom:12px}
.bam-fatti>header small{color:#e7c77e;font-size:15px}
.bam-fatti-fila{display:flex;flex-wrap:nowrap;gap:12px;overflow-x:auto;padding-bottom:8px;-webkit-overflow-scrolling:touch}
.bam-fatti-fila figure{flex:0 0 auto;width:clamp(120px,18vw,210px);margin:0;position:relative;cursor:pointer}
.bam-fatti-fila img{width:100%;border-radius:12px;display:block;background:rgba(2,15,29,.5)}
.bam-fatti-fila figcaption{position:absolute;right:8px;bottom:8px;padding:3px 9px;border-radius:8px;background:rgba(2,15,29,.78);color:#e7c77e;font-size:12px}

/* LA FILA SCORRE, LA PAGINA NON SI ALLARGA - 18 agosto 2026, ore 15.

   Danilo: "i render sono tornati, ma non scorrono verso destra". E infatti
   nello schermo la pagina era piu' larga del video: "Crea PDF" tagliato a
   destra, il messaggio della lavorazione tagliato a meta'.

   LA CAUSA, ed e' il difetto classico delle griglie CSS: una griglia da' alle
   sue caselle una larghezza minima pari al CONTENUTO. La fila ha
   flex-wrap:nowrap con dieci render affiancati, quindi la casella si allargava
   fino a contenerli TUTTI - e una cosa che si allarga non scorre mai, perche'
   non le manca spazio: se lo prende.

   min-width:0 dice alla casella che puo' essere piu' stretta del contenuto. A
   quel punto la fila non ha piu' spazio, e overflow-x:auto entra in funzione:
   scorre.

   Vale per la fila E per la casella che la contiene: metterlo solo su una delle
   due lascia l'altra libera di allargarsi. */
.bam-active-workspace{min-width:0}
.bam-active-workspace>*{min-width:0}
.bam-fatti{min-width:0;max-width:100%}
.bam-fatti-fila{min-width:0;max-width:100%;overflow-x:auto;overscroll-behavior-x:contain}

/* LO STORICO DEI COMANDI - 19 agosto 2026, ordine di Danilo.
   "Il broker deve poter ricopiare il comando da un progetto all'altro."
   Sta chiuso dietro una riga sola: chi non lo cerca vede la schermata di
   sempre. Aperto, e' un elenco alto quanto serve e che scorre da solo, perche'
   su iPad un elenco lungo che allunga la pagina la rende ingovernabile. */
.bam-ai-storico-apri{margin:6px 0 0;padding:7px 12px;border:1px solid rgba(216,173,90,.32);border-radius:999px;background:transparent;color:rgba(242,234,220,.82);font:500 12px/1 Inter,sans-serif}
.bam-ai-storico{margin-top:8px;border:1px solid rgba(216,173,90,.28);border-radius:12px;background:rgba(11,41,73,.5);max-height:46vh;overflow:auto;-webkit-overflow-scrolling:touch}
.bam-ai-storico header{position:sticky;top:0;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px;background:rgba(7,20,38,.94);color:#f2eadc;font:600 12px/1 Inter,sans-serif;letter-spacing:.06em;text-transform:uppercase}
.bam-ai-storico header button{border:0;background:transparent;color:rgba(242,234,220,.7);font:500 12px/1 Inter,sans-serif;min-height:44px;padding:0 4px}
.bam-ai-storico>p{margin:0;padding:12px;color:rgba(242,234,220,.62);font:400 12px/1.5 Inter,sans-serif}
.bam-ai-storico article{padding:11px 12px;border-top:1px solid rgba(255,255,255,.07)}
.bam-ai-storico article>div{display:flex;align-items:baseline;gap:8px;margin-bottom:5px}
.bam-ai-storico article strong{color:#d8ad5a;font:600 12px/1 Inter,sans-serif}
.bam-ai-storico article small{color:rgba(242,234,220,.5);font-size:10px}
.bam-ai-storico article p{margin:0 0 8px;color:rgba(242,234,220,.86);font:400 12px/1.5 Inter,sans-serif}
.bam-ai-riusa{min-height:44px;width:100%;border:1px solid rgba(216,173,90,.4);border-radius:9px;background:#d8ad5a;color:#071426;font:600 12px/1 Inter,sans-serif}
/* IL PALLINO PER SCEGLIERE LE IMMAGINI - 26 agosto 2026, ordine di Danilo:
   "mettimi il pallino, il cerchietto in alto a destra su ogni foto, gia'
   preimpostato, in modo tale che io possa selezionare sia per il PDF che per
   il video".

   Prima la fila era solo da guardare: PDF e video prendevano tutto, e il tocco
   apriva soltanto lo schermo intero. Il bersaglio e' 34px perche' si preme col
   pollice su iPad; il punteggio sta in basso a destra, quindi il pallino sta in
   ALTO a destra e i due non si toccano mai.

   LA FOTOGRAFIA NON SI TOCCA - 26 agosto 2026, correzione di Danilo: "se le
   selezioni rimangono grigie e' una roba che non si puo' vedere, lasciale
   nello stato originale, ti ho chiesto solo di aggiungere un cerchietto".
   Qui c'erano opacity .4 e saturate(.5) sulle escluse: spegnevano il render
   consegnato, cioe' il lavoro finito che il broker sta guardando. Il pallino
   dice gia' tutto da solo, e un render resta come e' uscito. Chi ci torna
   sopra: la fila mostra RENDER, non anteprime da riaccendere.

   IL NUMERO E' LA SEQUENZA di consegna, non un'etichetta: e' l'ordine con cui
   le pagine entrano nel PDF e le clip nel video. */
.bam-fatti-scelta{
  position:absolute;top:8px;right:8px;width:34px;height:34px;padding:0;
  display:flex;align-items:center;justify-content:center;
  border-radius:50%;cursor:pointer;z-index:2;
  border:1.5px solid rgba(255,255,255,.65);
  background:rgba(2,15,29,.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  color:#06172c;font:600 14px/1 Inter,sans-serif;font-variant-numeric:tabular-nums;
  transition:background .15s ease,border-color .15s ease,transform .1s ease;
}
.bam-fatti-scelta[aria-checked="true"]{background:#e7c77e;border-color:#e7c77e;color:#06172c}
.bam-fatti-scelta[aria-checked="false"]{background:rgba(2,15,29,.45)}
.bam-fatti-scelta:active{transform:scale(.92)}
.bam-fatti-scelta:focus-visible{outline:2px solid #e7c77e;outline-offset:2px}