/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

/* ===== Pulse Backoffice: tokens ===== */

:root{--pulse-red:#C43C3C;--pulse-red-dark:#8F2A2A;--pulse-warm:#F5C04A;--pulse-blush:#F3D6D9;--pulse-ink:#121212;--pulse-charcoal:#2A2A2A;--pulse-bg:#FAFAF8;--pulse-surface:#FFFFFF;--pulse-border:#D6D6D6;--pulse-muted:rgba(18,18,18,.68);--pulse-soft:rgba(18,18,18,.08);--pulse-ring:rgba(196,60,60,.28);--pulse-radius:14px;--pulse-radius-sm:10px;--pulse-shadow:0 10px 30px rgba(0,0,0,.08);--pulse-shadow-sm:0 6px 18px rgba(0,0,0,.10);}

/* ===== Base ===== */

html{background:var(--pulse-bg);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji";color:var(--pulse-ink);text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}
body.min-h-screen{background:var(--pulse-bg);color:var(--pulse-ink);}
a{color:var(--pulse-red);text-decoration:none;}
a:hover{text-decoration:underline;}
h1,h2,h3{letter-spacing:-.02em;}
h1{font-weight:900;}
h2{font-weight:900;}
h3{font-weight:800;}
hr{border:0;border-top:1px solid var(--pulse-border);}
code,kbd,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;}

/* ===== Focus ring ===== */

:where(a,button,input,select,textarea,[role="button"]):focus-visible{outline:0;box-shadow:0 0 0 3px var(--pulse-ring);border-color:rgba(196,60,60,.55);}

/* ===== Shell (layout without touching markup) ===== */

header.sticky{border-bottom:1px solid var(--pulse-border);background:rgba(255,255,255,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);}
footer{border-top:1px solid var(--pulse-border);background:var(--pulse-surface);}
#main-topbar a{transition:background 120ms ease,color 120ms ease,text-decoration 120ms ease;}
#main-topbar nav a{border-radius:12px;}
#main-topbar nav a:hover{text-decoration:none;}

/* ===== Buttons (Rails helpers default) ===== */

:where(button,input[type="button"],input[type="submit"],input[type="reset"]){appearance:none;-webkit-appearance:none;border:1px solid transparent;border-radius:var(--pulse-radius-sm);padding:.65rem 1.05rem;font-weight:800;font-size:.9rem;line-height:1.1;cursor:pointer;user-select:none;transition:transform 80ms ease,background 120ms ease,border-color 120ms ease,box-shadow 120ms ease,filter 120ms ease;color:#fff;background:var(--pulse-red);box-shadow:0 8px 22px rgba(196,60,60,.18);}
:where(button,input[type="button"],input[type="submit"],input[type="reset"]):hover{background:var(--pulse-red-dark);}
:where(button,input[type="button"],input[type="submit"],input[type="reset"]):active{transform:translateY(1px) scale(.99);}
:where(button,input[type="button"],input[type="submit"],input[type="reset"])[disabled]{opacity:.55;cursor:not-allowed;box-shadow:none;}

.pulse-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border-radius:var(--pulse-radius-sm);padding:.65rem 1.05rem;font-weight:800;font-size:.9rem;line-height:1.1;border:1px solid transparent;transition:transform 80ms ease,background 120ms ease,border-color 120ms ease,box-shadow 120ms ease,filter 120ms ease;text-decoration:none;}
.pulse-btn:active{transform:translateY(1px) scale(.99);}
.pulse-btn-primary{background:var(--pulse-red);color:#fff;box-shadow:0 8px 22px rgba(196,60,60,.18);}
.pulse-btn-primary:hover{background:var(--pulse-red-dark);text-decoration:none;}
.pulse-btn-secondary{background:var(--pulse-ink);color:#fff;box-shadow:0 8px 22px rgba(0,0,0,.16);}
.pulse-btn-secondary:hover{filter:brightness(.95);text-decoration:none;}
.pulse-btn-ghost{background:transparent;color:var(--pulse-ink);border-color:var(--pulse-border);box-shadow:none;}
.pulse-btn-ghost:hover{background:rgba(0,0,0,.04);text-decoration:none;}

.bg-blue-600 {color:#ffffff;}

/* ===== Forms ===== */

:where(input[type="text"],input[type="email"],input[type="password"],input[type="number"],input[type="search"],input[type="tel"],input[type="url"],select,textarea){width:100%;background:var(--pulse-surface);border:1px solid var(--pulse-border);border-radius:var(--pulse-radius-sm);padding:.7rem .85rem;font-size:.95rem;line-height:1.2;color:var(--pulse-ink);box-shadow:0 1px 0 rgba(0,0,0,.02);transition:border-color 120ms ease,box-shadow 120ms ease,background 120ms ease;}
:where(textarea){min-height:120px;resize:vertical;}
:where(select){
  padding-right:2.2rem;
  /*background-image:linear-gradient(45deg,transparent 50%,rgba(18,18,18,.55) 50%),linear-gradient(135deg,rgba(18,18,18,.55) 50%,transparent 50%);background-position:calc(100% - 18px) 55%,calc(100% - 12px) 55%;background-size:6px 6px,6px 6px;background-repeat:no-repeat;*/
}
:where(input::placeholder,textarea::placeholder){color:rgba(18,18,18,.45);}
input[type="checkbox"],input[type="radio"]{accent-color:var(--pulse-red);}
label{font-weight:800;color:rgba(18,18,18,.80);}
small,.form-hint{color:rgba(18,18,18,.62);}

/* ===== Rails errors ===== */

.field_with_errors :where(input,select,textarea){border-color:rgba(196,60,60,.65);box-shadow:0 0 0 3px rgba(196,60,60,.12);}
.form-error{margin-top:.35rem;font-size:.85rem;font-weight:800;color:var(--pulse-red-dark);}
.form-errors{margin:0 0 1rem 0;border:1px solid rgba(196,60,60,.28);background:rgba(196,60,60,.08);border-radius:var(--pulse-radius);padding:1rem;}
.form-errors__title{font-weight:900;color:var(--pulse-red-dark);margin:0 0 .5rem 0;}
.form-errors__list{margin:0;padding-left:1.1rem;color:rgba(18,18,18,.82);}

/* ===== Flash messages (supports devise notice/alert) ===== */

.flash{margin:0 0 1rem 0;border-radius:var(--pulse-radius);border:1px solid var(--pulse-border);background:var(--pulse-surface);box-shadow:var(--pulse-shadow-sm);}
.flash__inner{padding:.9rem 1rem;font-weight:800;color:rgba(18,18,18,.86);}
.flash-notice{border-color:rgba(245,192,74,.55);background:rgba(245,192,74,.12);}
.flash-alert,.flash-error{border-color:rgba(196,60,60,.35);background:rgba(196,60,60,.10);}
.flash-success{border-color:rgba(143,179,162,.55);background:rgba(143,179,162,.14);}

/* ===== Cards / surfaces ===== */

.card{background:var(--pulse-surface);border:1px solid var(--pulse-border);border-radius:var(--pulse-radius);box-shadow:var(--pulse-shadow);}
.card-sm{background:var(--pulse-surface);border:1px solid var(--pulse-border);border-radius:var(--pulse-radius-sm);box-shadow:var(--pulse-shadow-sm);}
.divider{height:1px;background:var(--pulse-border);}

/* ===== Tables (index pages) ===== */

table{width:100%;border-collapse:separate;border-spacing:0;border:1px solid var(--pulse-border);border-radius:var(--pulse-radius);overflow:hidden;background:var(--pulse-surface);box-shadow:var(--pulse-shadow-sm);}
thead th{background:rgba(0,0,0,.03);font-size:.82rem;font-weight:900;color:rgba(18,18,18,.68);text-transform:uppercase;letter-spacing:.06em;}
th,td{padding:.85rem .9rem;border-bottom:1px solid var(--pulse-border);text-align:left;vertical-align:middle;}
tbody tr:hover{background:rgba(0,0,0,.02);}
tbody tr:last-child td{border-bottom:0;}

/* ===== Backoffice helpers ===== */

.page-title{font-size:1.55rem;font-weight:900;letter-spacing:-.02em;}
.page-subtitle{color:var(--pulse-muted);font-weight:700;}
.toolbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin:.25rem 0 1rem 0;}
.toolbar__left,.toolbar__right{display:flex;align-items:center;gap:.6rem;}
.badge{display:inline-flex;align-items:center;gap:.4rem;border-radius:999px;padding:.25rem .55rem;font-size:.78rem;font-weight:900;border:1px solid var(--pulse-border);background:rgba(0,0,0,.03);color:rgba(18,18,18,.78);}
.badge-ok{border-color:rgba(143,179,162,.55);background:rgba(143,179,162,.16);}
.badge-warn{border-color:rgba(245,192,74,.60);background:rgba(245,192,74,.16);}
.badge-danger{border-color:rgba(196,60,60,.35);background:rgba(196,60,60,.12);}

/* ===== App Shell Layout ===== */

.app-shell{min-height:100vh;display:flex;flex-direction:column;}
.app-main{flex:1 0 auto;}

/* ===== Auth (Login / First Access) ===== */

.auth{position:relative;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;padding:42px;}
.auth__bg{position:fixed;inset:0;z-index:-1;background:radial-gradient(1200px 820px at 16% 18%,rgba(245,192,74,.26),transparent 60%),radial-gradient(980px 740px at 86% 22%,rgba(196,60,60,.22),transparent 58%),linear-gradient(180deg,#FAFAF8 0%,#FFFFFF 100%);}
.auth__card{width:100%;max-width:520px;background:rgba(255,255,255,.94);border:1px solid var(--pulse-border);border-radius:var(--pulse-radius);box-shadow:0 30px 70px rgba(0,0,0,.14);overflow:hidden;}
.auth__hero{padding:28px 30px 20px 30px;background:linear-gradient(180deg,rgba(0,0,0,.02),transparent 70%);}
.auth__brand{display:flex;align-items:center;gap:18px;}
.auth__mark{width:62px;height:62px;flex:0 0 62px;}
.auth__brand-text{display:flex;flex-direction:column;gap:4px;}
.auth__name{font-size:30px;font-weight:950;letter-spacing:.08em;line-height:1;}
.auth__motto{font-size:14px;font-weight:850;color:rgba(18,18,18,.68);line-height:1.25;}
.auth__divider{height:1px;background:var(--pulse-border);}
.auth__form{padding:22px 30px 28px 30px;display:flex;flex-direction:column;gap:16px;}
.auth__field{display:flex;flex-direction:column;gap:7px;}
.auth__field label{font-size:13px;font-weight:900;color:rgba(18,18,18,.78);}
.auth__field :where(input[type="email"],input[type="password"]){padding:.8rem .9rem;border-radius:var(--pulse-radius-sm);}
.auth__row{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:2px;}
.auth__check{display:inline-flex;align-items:center;gap:10px;font-weight:850;color:rgba(18,18,18,.72);font-size:13px;user-select:none;}
.auth__check input{width:18px;height:18px;}
.auth__link{font-weight:900;font-size:13px;text-decoration:none;}
.auth__link:hover{text-decoration:underline;}
.auth__actions{margin-top:4px;}
.auth__actions input[type="submit"]{width:100%;padding:.92rem 1.1rem;font-size:.96rem;font-weight:950;border-radius:var(--pulse-radius-sm);letter-spacing:-.01em;}
.auth__foot{display:flex;align-items:center;gap:10px;color:rgba(18,18,18,.55);font-weight:900;font-size:12px;}
.auth__foot-mark{width:18px;height:18px;opacity:.85;}

/* ===== Home (Post-login: Scene operative) ===== */

.home-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin:0 0 16px 0;}
.home-actions{display:flex;align-items:center;gap:10px;}

.scene-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:14px;}
.scene-card{grid-column:span 12;position:relative;display:block;min-height:220px;border-radius:var(--pulse-radius);border:1px solid var(--pulse-border);background:linear-gradient(135deg,rgba(0,0,0,.06),rgba(0,0,0,.02));background-size:cover;background-position:center;overflow:hidden;box-shadow:var(--pulse-shadow);text-decoration:none;}
@media (min-width:700px){.scene-card{grid-column:span 6;min-height:240px;}}
@media (min-width:1024px){.scene-card{grid-column:span 4;min-height:260px;}}

.scene-card__overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(18,18,18,.08) 0%,rgba(18,18,18,.22) 55%,rgba(18,18,18,.72) 100%);transition:filter 120ms ease,opacity 120ms ease;}
.scene-card__content{position:absolute;inset:auto 0 0 0;padding:16px 16px 14px 16px;display:flex;flex-direction:column;gap:8px;color:#fff;}
.scene-card__title{font-weight:950;letter-spacing:-.02em;font-size:18px;line-height:1.1;text-shadow:0 2px 10px rgba(0,0,0,.35);}
.scene-card__desc{font-weight:750;font-size:13px;line-height:1.35;color:rgba(255,255,255,.88);text-shadow:0 2px 10px rgba(0,0,0,.28);}
.scene-card__desc--muted{color:rgba(255,255,255,.72);}
.scene-card__meta{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:6px;}
.scene-card__date{font-size:12px;font-weight:850;color:rgba(255,255,255,.78);}

.scene-card:hover{text-decoration:none;transform:translateY(-1px);}
.scene-card:hover .scene-card__overlay{filter:brightness(1.05);}
.scene-card:focus-visible{outline:0;box-shadow:0 0 0 3px var(--pulse-ring),var(--pulse-shadow);}

/* ===== Badge base ===== */

.badge{display:inline-flex;align-items:center;gap:.4rem;border-radius:999px;padding:.25rem .6rem;font-size:.75rem;font-weight:900;border:1px solid var(--pulse-border);background:rgba(0,0,0,.05);color:rgba(18,18,18,.78);letter-spacing:.02em;}

/* ===== Badge semantic ===== */

.badge-ok{background:rgba(34,197,94,.18);border-color:rgba(34,197,94,.45);color:#166534;}
.badge-warn{background:rgba(245,192,74,.18);border-color:rgba(245,192,74,.55);color:#7a5d00;}
.badge-danger{background:rgba(196,60,60,.15);border-color:rgba(196,60,60,.45);color:var(--pulse-red-dark);}

/* ===== Scene card override (always readable on image) ===== */

.scene-card .badge{background:rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.25);color:#fff;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);box-shadow:0 4px 14px rgba(0,0,0,.25);}
.scene-card .badge-ok{background:rgba(34,197,94,.85);border-color:rgba(255,255,255,.35);color:#ffffff;}
.scene-card .badge-warn{background:rgba(245,192,74,.85);border-color:rgba(255,255,255,.35);color:#1f1f1f;}
.scene-card .badge-danger{background:rgba(196,60,60,.85);border-color:rgba(255,255,255,.35);color:#ffffff;}

/* ===== Scene Form (Full-width, vertical) ===== */

.scene-form__inner{padding:18px 18px 16px 18px;}
.scene-form__head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin:0 0 12px 0;}
.scene-form__head-right{display:flex;align-items:center;gap:10px;}
.scene-form__foot{display:flex;align-items:center;justify-content:flex-end;gap:10px;margin-top:16px;}

.sf-block{background:var(--pulse-surface);border:1px solid var(--pulse-border);border-radius:var(--pulse-radius);box-shadow:var(--pulse-shadow-sm);padding:14px 14px 12px 14px;margin-top:14px;}
.sf-block__title{font-weight:950;letter-spacing:-.01em;}
.sf-block__hint{color:var(--pulse-muted);font-weight:750;font-size:13px;line-height:1.35;margin-top:4px;margin-bottom:10px;}
.sf-stack{display:flex;flex-direction:column;gap:12px;}

.sf-image{display:flex;flex-direction:column;gap:12px;}
.sf-image__preview{border:1px solid var(--pulse-border);border-radius:var(--pulse-radius);overflow:hidden;box-shadow:var(--pulse-shadow-sm);background:#fff;}
.sf-image__img{width:100%;height:260px;object-fit:cover;display:block;}
.sf-image__empty{border:1px dashed var(--pulse-border);border-radius:var(--pulse-radius);background:rgba(0,0,0,.02);padding:14px;color:rgba(18,18,18,.65);font-weight:850;}

.sf-upload{border:1px solid var(--pulse-border);border-radius:var(--pulse-radius-sm);background:rgba(0,0,0,.02);padding:12px 12px 10px 12px;}
.sf-upload__title{font-weight:950;}
.sf-upload__hint{color:var(--pulse-muted);font-weight:750;font-size:13px;line-height:1.35;margin-top:2px;margin-bottom:10px;}

.sf-file{width:100%;padding:.55rem .7rem;border-radius:var(--pulse-radius-sm);border:1px solid var(--pulse-border);background:#fff;font-weight:800;}
.sf-file::file-selector-button{margin-right:10px;border:1px solid transparent;border-radius:12px;padding:.55rem .8rem;font-weight:950;background:var(--pulse-ink);color:#fff;cursor:pointer;transition:filter 120ms ease,transform 80ms ease;}
.sf-file::file-selector-button:hover{filter:brightness(.95);}
.sf-file::file-selector-button:active{transform:translateY(1px) scale(.99);}

.sf-callout{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid var(--pulse-border);background:rgba(0,0,0,.02);border-radius:var(--pulse-radius-sm);padding:12px 12px 10px 12px;}
.sf-callout--warm{border-color:rgba(245,192,74,.55);background:rgba(245,192,74,.12);}
.sf-callout__text{min-width:0;}
.sf-callout__title{font-weight:950;}
.sf-callout__desc{color:var(--pulse-muted);font-weight:750;font-size:13px;margin-top:2px;line-height:1.35;}
.sf-callout__actions{flex:0 0 auto;}

.sf-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:10px;}
.sf-checkcard{grid-column:span 12;display:flex;align-items:center;gap:12px;padding:12px 12px 10px 12px;border:1px solid var(--pulse-border);border-radius:var(--pulse-radius-sm);background:rgba(0,0,0,.02);cursor:pointer;}
.sf-checkcard:hover{background:rgba(0,0,0,.03);}
.sf-checkcard input{width:18px;height:18px;}
.sf-checkcard__body{display:flex;flex-direction:column;gap:3px;min-width:0;}
.sf-checkcard__title{font-weight:950;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.sf-checkcard__meta{font-size:12px;font-weight:850;color:rgba(18,18,18,.60);}

/* ===== Hotspot Editor ===== */

.hs-editor{display:flex;flex-direction:column;gap:14px;}
.hs-editor__head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;}
.hs-editor__title{font-weight:950;letter-spacing:-.02em;font-size:1.35rem;}
.hs-editor__sub{color:var(--pulse-muted);font-weight:750;font-size:13px;margin-top:2px;line-height:1.35;}
.hs-editor__actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.hs-editor__chips{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:6px;}
.hs-chip{display:inline-flex;align-items:center;gap:.4rem;border-radius:999px;padding:.25rem .6rem;font-size:.75rem;font-weight:900;border:1px solid var(--pulse-border);background:rgba(0,0,0,.04);color:rgba(18,18,18,.72);}
.hs-chip--ok{background:rgba(34,197,94,.16);border-color:rgba(34,197,94,.45);color:#166534;}
.hs-chip--warn{background:rgba(245,192,74,.18);border-color:rgba(245,192,74,.55);color:#7a5d00;}
.hs-shell{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:14px;}
.hs-canvas{grid-column:span 12;}
.hs-side{grid-column:span 12;}
@media (min-width:1024px){.hs-canvas{grid-column:span 8;}.hs-side{grid-column:span 4;}}
.hs-panel{background:var(--pulse-surface);border:1px solid var(--pulse-border);border-radius:var(--pulse-radius);box-shadow:var(--pulse-shadow-sm);padding:14px 14px 12px 14px;}
.hs-panel__title{font-weight:950;margin-bottom:6px;}
.hs-panel__hint{color:var(--pulse-muted);font-weight:750;font-size:13px;line-height:1.35;margin-bottom:10px;}
.hs-table-wrap{background:var(--pulse-surface);border:1px solid var(--pulse-border);border-radius:var(--pulse-radius);box-shadow:var(--pulse-shadow-sm);overflow:hidden;}
.hs-table-wrap table{margin:0;}

/* ===== Pulse Tool Index ===== */

.tool-thumb{width:64px;height:64px;border-radius:12px;border:1px solid var(--pulse-border);background:#fff;overflow:hidden;box-shadow:var(--pulse-shadow-sm);display:flex;align-items:center;justify-content:center;}
.tool-thumb--landscape{padding:10px 7px;}
.tool-thumb--portrait{padding:7px 10px;}
.tool-thumb--square{padding:8px;}
.tool-thumb__img{width:100%;height:100%;object-fit:contain;display:block;}
.tool-thumb__empty{color:rgba(18,18,18,.35);font-weight:900;font-size:11px;}

.pulse-btn-danger{background:var(--pulse-red);color:#fff;box-shadow:0 8px 22px rgba(196,60,60,.18);}
.pulse-btn-danger:hover{background:var(--pulse-red-dark);text-decoration:none;}

/* ===== Toolbox Index ===== */

.toolbox-index__card{padding:0;overflow:hidden;}
.toolbox-index__empty-card{padding:18px 18px 16px 18px;}
.toolbox-index__empty-title{font-size:1.2rem;}
.toolbox-index__empty-subtitle{margin-top:.35rem;}
.toolbox-index__empty-toolbar{margin-top:14px;}

/* ===== Toolbox Row ===== */

.toolbox-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px;border-bottom:1px solid var(--pulse-border);}
.toolbox-row--last{border-bottom:0;}
.toolbox-row__main{min-width:0;flex:1;}
.toolbox-row__head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.toolbox-row__title{font-weight:950;}
.toolbox-row__actions{display:flex;align-items:center;justify-content:flex-start;gap:.55rem;flex-shrink:0;}
.toolbox-row__empty{margin-top:8px;color:rgba(18,18,18,.45);font-weight:750;font-size:13px;line-height:1.35;}

/* ===== Toolbox Tool Icons ===== */

.toolbox-tool-icons{margin-top:10px;display:flex;align-items:center;flex-wrap:wrap;gap:8px;}
.toolbox-tool-icon{width:42px;height:42px;border-radius:10px;border:1px solid var(--pulse-border);background:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden;box-shadow:var(--pulse-shadow-sm);}
.toolbox-tool-icon img{width:100%;height:100%;object-fit:contain;padding:5px;display:block;}
.toolbox-tool-icon span{font-size:14px;font-weight:900;color:rgba(18,18,18,.45);line-height:1;}
.toolbox-tool-more{height:42px;display:inline-flex;align-items:center;justify-content:center;padding:0 10px;border-radius:10px;border:1px solid var(--pulse-border);background:#f8fafc;color:#64748b;font-size:13px;font-weight:900;}

/* ===== Toolbox Tool Names ===== */

.toolbox-tool-names{margin-top:8px;display:flex;align-items:center;flex-wrap:wrap;gap:6px;}
.toolbox-tool-chip{display:inline-flex;align-items:center;min-height:28px;padding:4px 10px;border-radius:999px;background:#f1f5f9;color:#475569;font-size:12px;font-weight:800;line-height:1;}
.toolbox-tool-chip--muted{color:#64748b;}

/* ===== Responsive ===== */

@media (max-width:860px){.toolbox-row{flex-direction:column;align-items:flex-start;}.toolbox-row__actions{width:100%;flex-wrap:wrap;}}

/* ===== Tool Select ===== */

.tool-select-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:10px;}
.tool-select-card{grid-column:span 12;display:flex;align-items:center;gap:12px;padding:12px;border:1px solid var(--pulse-border);border-radius:var(--pulse-radius-sm);background:#fff;cursor:pointer;}
.tool-select-card:hover{background:rgba(0,0,0,.02);}
.tool-select-card__check{width:18px;height:18px;flex:0 0 auto;}
.tool-select-card__thumb{width:48px;height:48px;border:1px solid var(--pulse-border);border-radius:10px;background:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden;box-shadow:var(--pulse-shadow-sm);flex:0 0 48px;padding:6px;}
.tool-select-card__img{width:100%;height:100%;object-fit:contain;display:block;}
.tool-select-card__placeholder{font-size:15px;font-weight:900;color:rgba(18,18,18,.45);line-height:1;}
.tool-select-card__body{min-width:0;display:flex;flex-direction:column;}
.tool-select-card__name{font-weight:900;color:var(--pulse-ink);line-height:1.2;}
@media (min-width:760px){.tool-select-card{grid-column:span 6;}}
@media (min-width:1100px){.tool-select-card{grid-column:span 4;}}

/* ===== Tool Form ===== */

.tool-form{padding:18px 18px 16px 18px;}
.tool-form__toolbar{margin:0 0 12px 0;}
.tool-form__title{font-size:1.1rem;}
.tool-form__divider{margin:10px 0 16px 0;}
.tool-form__stack{display:flex;flex-direction:column;gap:14px;}
.tool-form__section-head{margin:0 0 8px 0;}
.tool-form__section-title{font-weight:950;}
.tool-form__section-subtitle{margin-top:.15rem;}
.tool-form__image-block{display:flex;flex-direction:column;gap:12px;}
.tool-form__preview{width:120px;height:120px;border:1px solid var(--pulse-border);border-radius:16px;background:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden;box-shadow:var(--pulse-shadow-sm);padding:12px;}
.tool-form__preview-img{width:100%;height:100%;object-fit:contain;display:block;}
.tool-form__empty{padding:14px;border:1px dashed var(--pulse-border);border-radius:var(--pulse-radius);background:rgba(0,0,0,.02);color:rgba(18,18,18,.55);font-weight:800;}
.tool-form__upload{padding:14px 14px 12px 14px;background:rgba(0,0,0,.02);}
.tool-form__upload-title{font-weight:950;}
.tool-form__upload-subtitle{margin-top:.2rem;margin-bottom:10px;}
.tool-form__file{width:100%;}
.tool-form__file::file-selector-button{margin-right:10px;border:1px solid transparent;border-radius:12px;padding:.55rem .8rem;font-weight:950;background:var(--pulse-ink);color:#fff;cursor:pointer;transition:filter 120ms ease,transform 80ms ease;}
.tool-form__file::file-selector-button:hover{filter:brightness(.95);}
.tool-form__file::file-selector-button:active{transform:translateY(1px) scale(.99);}
.tool-form__foot{margin:18px 0 0 0;}

.workflow-drag-handle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  font-size: 18px;
  line-height: 1;
  user-select: none;
}

.workflow-drag-handle:hover {
  background: rgba(0, 0, 0, 0.05);
}

/* ===== Hotspot Sidebar Steps ===== */

.hs-sidebar{position:absolute;top:16px;left:16px;bottom:16px;width:min(620px,calc(100% - 32px));max-width:min(620px,calc(100% - 32px));display:flex;flex-direction:column;min-height:0;border:1px solid rgba(255,255,255,.24);border-radius:18px;background:rgba(255,255,255,.42);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 22px 56px rgba(15,23,42,.18);overflow:hidden;}
.hs-sidebar__header{flex:0 0 auto;padding:16px 16px 12px 16px;border-bottom:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.12);}
.hs-sidebar__title{font-size:1rem;font-weight:950;letter-spacing:-.02em;color:var(--pulse-ink);}
.hs-sidebar__subtitle{margin-top:4px;font-size:12px;line-height:1.35;font-weight:750;color:rgba(18,18,18,.72);}
.hs-sidebar__body{flex:1 1 auto;min-height:0;padding:12px;display:flex;flex-direction:column;gap:10px;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;}
.hs-step{flex:0 0 auto;border:1px solid rgba(255,255,255,.20);border-radius:14px;background:rgba(255,255,255,.26);overflow:hidden;box-shadow:0 8px 22px rgba(15,23,42,.05);}
.hs-step.is-open{border-color:rgba(37,99,235,.18);background:rgba(255,255,255,.34);box-shadow:0 10px 24px rgba(15,23,42,.08);}
.hs-step__toggle{width:100%;display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:14px 14px 12px 14px;background:transparent;border:0;text-align:left;}
.hs-step__toggle:hover{background:rgba(255,255,255,.08);}
.hs-step__main{min-width:0;display:flex;align-items:flex-start;gap:12px;}
.hs-step__index{width:30px;height:30px;flex:0 0 30px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;background:#eef2ff;color:#3730a3;font-size:12px;font-weight:950;line-height:1;}
.hs-step.is-open .hs-step__index{background:#2563eb;color:#fff;}
.hs-step__text{min-width:0;display:flex;flex-direction:column;gap:2px;}
.hs-step__title{font-size:14px;font-weight:950;color:var(--pulse-ink);line-height:1.2;}
.hs-step__desc{font-size:12px;font-weight:750;color:rgba(18,18,18,.68);line-height:1.35;}
.hs-step__chev{padding-top:3px;font-size:13px;font-weight:900;color:rgba(18,18,18,.42);}
.hs-step__panel{padding:0 14px 14px 14px;border-top:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.12);}
.hs-step__panel-inner{padding-top:12px;display:flex;flex-direction:column;gap:12px;}
.hs-field{display:flex;flex-direction:column;gap:6px;}
.hs-field__label{font-size:12px;font-weight:900;letter-spacing:.02em;text-transform:uppercase;color:rgba(18,18,18,.58);}
.hs-note{padding:10px 12px;border:1px solid rgba(255,255,255,.18);border-radius:12px;background:rgba(255,255,255,.18);font-size:12px;line-height:1.4;font-weight:750;color:#334155;}
.hs-list-stack{display:flex;flex-direction:column;gap:10px;min-height:0;}
.hs-empty{padding:12px;border:1px dashed rgba(15,23,42,.12);border-radius:12px;background:rgba(255,255,255,.18);font-size:13px;font-weight:750;color:var(--pulse-muted);}

/* ===== Hotspot Interactions refresh ===== */

.hs-interactions-toolbar{display:flex;flex-wrap:wrap;gap:8px;}
.hs-pill-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:0 14px;border:1px solid rgba(255,255,255,.22);border-radius:999px;background:rgba(255,255,255,.34);font-size:13px;font-weight:900;color:var(--pulse-ink);transition:background .12s ease,border-color .12s ease,box-shadow .12s ease,transform .08s ease;}
.hs-pill-btn:hover{background:rgba(255,255,255,.48);border-color:rgba(37,99,235,.18);box-shadow:0 8px 18px rgba(15,23,42,.06);}
.hs-pill-btn:active{transform:translateY(1px);}
.hs-interactions-wrap{display:flex;flex-direction:column;gap:10px;min-height:0;overflow:visible;}
.hs-block{border:1px solid rgba(255,255,255,.20);border-radius:14px;background:rgba(255,255,255,.28);box-shadow:0 6px 18px rgba(15,23,42,.05);overflow:hidden;}
.hs-block__head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 12px 10px 12px;border-bottom:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.12);}
.hs-block__meta{display:flex;align-items:center;gap:8px;min-width:0;}
.hs-block__badge{display:inline-flex;align-items:center;justify-content:center;height:24px;padding:0 10px;border-radius:999px;background:#eff6ff;color:#1d4ed8;font-size:11px;font-weight:950;text-transform:uppercase;letter-spacing:.04em;}
.hs-block__title{font-size:13px;font-weight:950;color:var(--pulse-ink);}
.hs-block__body{padding:12px;display:flex;flex-direction:column;gap:10px;}
.hs-block__actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.hs-icon-btn{display:inline-flex;align-items:center;justify-content:center;min-width:34px;height:34px;padding:0 10px;border:1px solid rgba(255,255,255,.20);border-radius:10px;background:rgba(255,255,255,.42);font-size:12px;font-weight:900;color:var(--pulse-ink);}
.hs-icon-btn:hover{background:rgba(255,255,255,.56);}

/* ===== Hotspot Sidebar FINAL OVERRIDE ===== */

.hs-sidebar{left:10px !important;right:auto !important;top:10px !important;bottom:16px !important;width:min(480px,calc(100% - 32px)) !important;max-width:min(480px,calc(100% - 32px)) !important;border-radius:18px !important;background:rgba(255,255,255,.36) !important;backdrop-filter:blur(16px) !important;-webkit-backdrop-filter:blur(16px) !important;border:1px solid rgba(255,255,255,.22) !important;box-shadow:0 22px 56px rgba(15,23,42,.18) !important;overflow:hidden !important;}
.hs-sidebar__header{background:rgba(255,255,255,.10) !important;border-bottom:1px solid rgba(255,255,255,.16) !important;}
.hs-sidebar__body{background:transparent !important;overflow-y:auto !important;overflow-x:hidden !important;min-height:0 !important;}
.hs-step{border-radius:14px !important;background:rgba(255,255,255,.18) !important;border:1px solid rgba(255,255,255,.18) !important;}
.hs-step.is-open{background:rgba(255,255,255,.24) !important;border-color:rgba(37,99,235,.16) !important;}
.hs-step__panel{background:rgba(255,255,255,.10) !important;border-top:1px solid rgba(255,255,255,.14) !important;}
.hs-note{background:rgba(255,255,255,.14) !important;border:1px solid rgba(255,255,255,.16) !important;}
.hs-empty{background:rgba(255,255,255,.12) !important;}

.hs-tool-row__icon{width:56px;height:56px;flex:0 0 56px;border-radius:14px;overflow:hidden;display:flex;align-items:center;justify-content:center;background:#fff;border:1px solid rgba(15,23,42,.08);box-shadow:0 4px 12px rgba(15,23,42,.06);padding:6px;}
.hs-tool-row__img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;display:block;}
.hs-tool-row__icon-fallback{font-size:20px;line-height:1;}
.hs-tool-row__left{display:flex;align-items:center;gap:14px;min-width:0;width:100%;}

#pano-editor .hs-sidebar input, #pano-editor .hs-sidebar select {width:auto !important;}

/* ===== Workflow save feedback (bubble) ===== */

.wf-save-feedback{position:absolute;left:50%;bottom:calc(100% + 10px);transform:translateX(-50%);pointer-events:none;z-index:30;}
.wf-save-feedback__pill{position:relative;display:inline-flex;align-items:center;min-height:34px;padding:7px 14px;border-radius:10px;border:1px solid rgba(255,255,255,.18);background:rgba(17,24,39,.78);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 10px 24px rgba(15,23,42,.18);font-size:12px;font-weight:850;color:#fff;white-space:nowrap;width:max-content;opacity:0;transform:translateY(6px) scale(.96);transition:opacity .18s ease,transform .18s ease;}
.wf-save-feedback__pill::after{content:"";position:absolute;left:50%;top:100%;transform:translateX(-50%);width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:6px solid rgba(17,24,39,.78);}
.wf-save-feedback.is-visible .wf-save-feedback__pill{opacity:1;transform:translateY(0) scale(1);}
.wf-save-feedback__pill.is-success{background:rgba(6,95,70,.82);}
.wf-save-feedback__pill.is-error{background:rgba(153,27,27,.85);}
.wf-save-feedback__pill.is-success::after{border-top-color:rgba(6,95,70,.82);}
.wf-save-feedback__pill.is-error::after{border-top-color:rgba(153,27,27,.85);}

.nav-link{display:block;border-radius:.5rem;padding:.5rem .75rem;font-size:.875rem;font-weight:600;color:#374151;transition:background-color .15s ease,color .15s ease;}
.nav-link:hover{background:#f3f4f6;color:#374151;}
.nav-link--menu{display:inline-flex;align-items:center;gap:.25rem;cursor:pointer;}
.nav-dropdown{visibility:hidden;position:absolute;left:0;top:100%;z-index:50;margin-top:.5rem;width:14rem;transform:translateY(.25rem);border-radius:.75rem;border:1px solid #e5e7eb;background:#fff;padding:.5rem;opacity:0;box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);transition:all .15s ease;}
.nav-group:hover .nav-dropdown{visibility:visible;transform:translateY(0);opacity:1;}
.nav-group:hover .nav-chevron{transform:rotate(180deg);}
.nav-chevron{height:1rem;width:1rem;color:#6b7280;transition:transform .15s ease;}

.auth__brand-text--center{text-align:center;width:100%;}
.auth__name{font-size:28px;font-weight:900;letter-spacing:.08em;color:#111827;}
.auth__name--sub{font-size:16px;font-weight:700;letter-spacing:.18em;color:#6b7280;margin-top:2px;}
.auth__motto{margin-top:10px;font-size:12px;font-weight:500;color:#9ca3af;}
.auth__name{color:#111827;}
.auth__name:first-child{color:#dc2626;}

/* ===== Viewer Runtime UI: shared sizing ===== */

:root{
  --viewer-ui-height: 108px;
  --viewer-ui-radius: 20px;
  --viewer-ui-blur: 14px;
  --viewer-ui-border: 1px solid rgba(255,255,255,.14);
  --viewer-ui-bg: rgba(10,14,24,.54);
  --viewer-ui-shadow:
    0 14px 30px rgba(0,0,0,.26),
    inset 0 1px 0 rgba(255,255,255,.08);

  --viewer-pill-height: 34px;
  --viewer-pill-radius: 999px;

  --viewer-tool-size: 72px;
  --viewer-tool-radius: 16px;
  --viewer-nav-size: 34px;

  --workflow-width: 300px;
  --workflow-radius: 20px;
  --workflow-pad-x: 14px;
  --workflow-pad-y: 12px;
  --workflow-stack-gap: 6px;
  --workflow-total-height: calc(var(--viewer-pill-height) + var(--workflow-stack-gap) + var(--viewer-ui-height));
  --workflow-tools-box-height: 72px;
}

/* ===== Workflow HUD aligned to toolbox stack ===== */

.workflow-hud{
  position:absolute;
  top:10px;
  left:14px;
  width:var(--workflow-width);
  height:var(--workflow-total-height);
  z-index:70;
  pointer-events:auto;
}

.workflow-hud__card{
  width:100%;
  height:100%;
  padding:var(--workflow-pad-y) var(--workflow-pad-x);
  border-radius:var(--workflow-radius);
  border:1px solid rgba(255,255,255,.14);
  background:rgba(10,14,24,.54);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  box-shadow:
    0 14px 30px rgba(0,0,0,.26),
    inset 0 1px 0 rgba(255,255,255,.08);
  display:grid;
  grid-template-rows:auto auto auto 1fr;
  row-gap:8px;
  box-sizing:border-box;
  overflow:hidden;
}

.workflow-hud__header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  min-height:30px;
}

.workflow-hud__title{
  font-size:14px;
  font-weight:950;
  line-height:1;
  letter-spacing:.02em;
  text-transform:uppercase;
  color:#fff;
}

.workflow-hud__progress{
  min-width:52px;
  height:30px;
  padding:0 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.10);
  color:rgba(255,255,255,.92);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:13px;
  font-weight:900;
  line-height:1;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}

.workflow-hud__steps{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  min-height:26px;
}

.workflow-hud__step{
  height:26px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
  overflow:hidden;
}

.workflow-hud__step.is-done{
  background:linear-gradient(180deg,rgba(59,130,246,.92),rgba(37,99,235,.82));
  border-color:rgba(96,165,250,.42);
  box-shadow:
    0 6px 16px rgba(37,99,235,.26),
    inset 0 1px 0 rgba(255,255,255,.14);
}

.workflow-hud__step.is-current{
  border-color:rgba(96,165,250,.40);
  box-shadow:
    0 0 0 1px rgba(96,165,250,.18),
    inset 0 1px 0 rgba(255,255,255,.08);
}

.workflow-hud__tools-wrap{
  display:grid;
  grid-template-rows:auto 1fr;
  gap:8px;
  min-height:0;
}

.workflow-hud__tools-title{
  font-size:12px;
  font-weight:900;
  line-height:1.1;
  text-transform:uppercase;
  color:rgba(255,255,255,.92);
}

.workflow-hud__tools-list{
  height:var(--workflow-tools-box-height);
  min-height:var(--workflow-tools-box-height);
  max-height:var(--workflow-tools-box-height);
  border-radius:14px;
  border:1px solid rgba(255,255,255,.10);
  background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.03));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 6px 16px rgba(0,0,0,.10);
  box-sizing:border-box;
  padding:8px 10px;
  overflow-x:auto;
  overflow-y:hidden;
  scrollbar-width:none;
}

.workflow-hud__tools-list::-webkit-scrollbar{
  display:none;
}

/* ===== stato vuoto ===== */

.workflow-hud__tools-list.is-empty{
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  color:rgba(255,255,255,.74);
  font-size:12px;
  line-height:1.25;
  font-weight:800;
}

.workflow-hud__tools-list.is-empty > *{
  max-width:180px;
}

/* ===== stato con tools ===== */

.workflow-hud__tools-list.has-tools{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:10px;
}

.workflow-hud__tools-list.has-tools > *{
  flex:0 0 66px;
  width:66px;
  min-width:66px;
  max-width:66px;
  height:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:6px;
  text-align:center;
  margin:0 !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

.workflow-hud__tools-list.has-tools img{
  width:38px;
  height:38px;
  object-fit:contain;
  object-position:center;
  display:block;
  padding:6px;
  margin:0;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.04));
  box-shadow:
    0 6px 14px rgba(0,0,0,.16),
    inset 0 1px 0 rgba(255,255,255,.06);
  flex:0 0 auto;
}

.workflow-hud__tools-list.has-tools span,
.workflow-hud__tools-list.has-tools small,
.workflow-hud__tools-list.has-tools .workflow-tool-label,
.workflow-hud__tools-list.has-tools .workflow-hud__tool-label{
  display:block;
  width:100%;
  margin:0;
  padding:0;
  font-size:11px;
  line-height:1.15;
  font-weight:900;
  color:#fff;
  text-align:center;
  white-space:normal;
  overflow:hidden;
  text-overflow:ellipsis;
  flex:0 0 auto;
}

/* ===== Viewer Toolboxes ===== */

.pano-toolboxes{
  position:absolute;
  top:10px;
  left:324px;
  right:14px;
  z-index:70;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:6px;
  pointer-events:auto;
  overflow:visible;
}

.pano-toolboxes.hidden{
  display:none;
}

.pano-toolboxes--dashboard-only{
  left:auto;
  right:14px;
  width:auto;
  max-width:none;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  padding:0 !important;
  min-height:0 !important;
}

/* ===== Tabs ===== */

.pano-toolboxes__tabs{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:nowrap;
  width:100%;
  min-height:var(--viewer-pill-height);
  overflow-x:auto;
  overflow-y:hidden;
  scrollbar-width:none;
  padding:0 92px 0 2px;
}

.pano-toolboxes__tabs::-webkit-scrollbar{
  display:none;
}

.pano-toolbox__tab{
  appearance:none;
  -webkit-appearance:none;
  min-height:var(--viewer-pill-height);
  padding:0 14px;
  border-radius:var(--viewer-pill-radius);
  border:1px solid rgba(255,255,255,.14);
  background:rgba(10,14,24,.42);
  color:rgba(255,255,255,.84);
  font-size:13px;
  font-weight:900;
  line-height:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  white-space:nowrap;
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  box-shadow:
    0 6px 16px rgba(0,0,0,.16),
    inset 0 1px 0 rgba(255,255,255,.08);
  transition:
    background .16s ease,
    border-color .16s ease,
    color .16s ease,
    transform .12s ease,
    box-shadow .16s ease;
}

.pano-toolbox__tab:hover{
  background:rgba(10,14,24,.56);
  color:#fff;
  text-decoration:none;
}

.pano-toolbox__tab:active{
  transform:scale(.98);
}

.pano-toolbox__tab.is-active{
  background:linear-gradient(180deg,rgba(96,165,250,.38),rgba(59,130,246,.28));
  border-color:rgba(96,165,250,.42);
  color:#fff;
  box-shadow:
    0 8px 18px rgba(0,0,0,.18),
    inset 0 1px 0 rgba(255,255,255,.10);
}

/* ===== Panel ===== */

.pano-toolboxes__panel{
  position:relative;
  width:100%;
  min-width:0;
  min-height:var(--viewer-ui-height);
  padding:0 44px;
  border:var(--viewer-ui-border);
  border-radius:var(--viewer-ui-radius);
  background:var(--viewer-ui-bg);
  backdrop-filter:blur(var(--viewer-ui-blur));
  -webkit-backdrop-filter:blur(var(--viewer-ui-blur));
  box-shadow:var(--viewer-ui-shadow);
  overflow:visible;
}

/* ===== Scroll viewport ===== */

.pano-toolboxes__viewport{
  width:100%;
  min-height:var(--viewer-ui-height);
  overflow-x:auto;
  overflow-y:hidden;
  scroll-behavior:smooth;
  scrollbar-width:none;
  padding:10px 0;
  box-sizing:border-box;
  contain:layout paint style;
}

.pano-toolboxes__viewport::-webkit-scrollbar{
  display:none;
}

/* ===== Tool grid ===== */

.pano-toolboxes__grid{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:max-content;
  min-height:calc(var(--viewer-ui-height) - 20px);
  overflow:visible;
  padding:0 16px;
  contain:layout paint;
}

/* ===== Empty state ===== */

.pano-toolboxes__empty{
  display:flex;
  align-items:center;
  min-height:var(--viewer-ui-height);
  color:rgba(255,255,255,.66);
  font-size:12px;
  font-weight:800;
  padding:0 8px;
}

/* ===== Navigation arrows ===== */

.pano-toolboxes__nav{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:var(--viewer-nav-size);
  height:var(--viewer-nav-size);
  border:1px solid rgba(255,255,255,.16);
  border-radius:999px;
  background:rgba(255,255,255,.08);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  transition:
    background .16s ease,
    transform .12s ease,
    opacity .16s ease,
    box-shadow .16s ease;
  z-index:4;
  box-shadow:0 6px 14px rgba(0,0,0,.18);
}

.pano-toolboxes__nav:hover{
  background:rgba(255,255,255,.14);
}

.pano-toolboxes__nav:active{
  transform:translateY(-50%) scale(.96);
}

.pano-toolboxes__nav--prev{
  left:10px;
}

.pano-toolboxes__nav--next{
  right:10px;
}

/* ===== Tool tile ===== */

.pano-toolbox__tool{
  appearance:none;
  -webkit-appearance:none;
  position:relative;
  flex:0 0 auto;
  width:var(--viewer-tool-size);
  height:var(--viewer-tool-size);
  padding:7px;
  border-radius:var(--viewer-tool-radius);
  border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.04));
  color:inherit;
  box-shadow:
    0 10px 22px rgba(0,0,0,.18),
    inset 0 1px 0 rgba(255,255,255,.08);
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  transition:
    transform 160ms ease,
    box-shadow 160ms ease,
    border-color 160ms ease,
    background 160ms ease,
    opacity 160ms ease;
  user-select:none;
  z-index:1;
  will-change:transform;
}

.pano-toolbox__tool:hover{
  transform:scale(1.05);
  border-color:rgba(255,255,255,.20);
  background:linear-gradient(180deg,rgba(255,255,255,.11),rgba(255,255,255,.05));
  box-shadow:
    0 12px 22px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(255,255,255,.10);
  z-index:3;
}

.pano-toolbox__tool:active{
  transform:scale(1.02);
}

.pano-toolbox__tool.is-draggable{
  cursor:grab;
}

.pano-toolbox__tool.is-clickable{
  cursor:pointer;
}

.pano-toolbox__tool.is-disabled{
  cursor:default;
  opacity:.58;
}

/* ===== Tool image ===== */

.pano-toolbox__tool-image{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  display:block;
  pointer-events:none;
}

/* ===== Placeholder text ===== */

.pano-toolbox__tool-placeholder{
  font-size:11px;
  line-height:1.1;
  font-weight:800;
  text-align:center;
  color:rgba(255,255,255,.84);
  pointer-events:none;
}

/* ===== Dashboard button ===== */

.pano-toolboxes__dashboard-btn{
  position:absolute;
  top:0;
  right:0;
  min-height:var(--viewer-pill-height);
  padding:0 16px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.18);
  background:linear-gradient(180deg,#ef4444,#dc2626);
  color:#fff;
  font-size:13px;
  font-weight:950;
  letter-spacing:.02em;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:
    0 8px 18px rgba(0,0,0,.25),
    inset 0 1px 0 rgba(255,255,255,.15);
  cursor:pointer;
  z-index:10;
  transition:
    transform .12s ease,
    box-shadow .16s ease,
    filter .16s ease;
}

.pano-toolboxes__dashboard-btn:hover{
  filter:brightness(1.08);
  box-shadow:0 10px 22px rgba(0,0,0,.32);
}

.pano-toolboxes__dashboard-btn:active{
  transform:scale(.96);
}

.pano-toolboxes--dashboard-only .pano-toolboxes__dashboard-btn{
  position:relative;
  top:auto;
  right:auto;
}

/* ===== Compact pano controls ===== */

#pano-controls.is-compact{
  position:absolute;
  left:50%;
  bottom:18px;
  transform:translateX(-50%);
  z-index:72;
  display:flex;
  align-items:center;
  gap:10px;
  padding:0;
}

#pano-controls.is-compact button{
  width:46px;
  height:46px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(10,14,24,.54);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:18px;
  font-weight:900;
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  box-shadow:
    0 8px 18px rgba(0,0,0,.22),
    inset 0 1px 0 rgba(255,255,255,.08);
}

#pano-controls.is-compact button:hover{
  background:rgba(10,14,24,.66);
}

/* ===== Feedback overlay ===== */

.workflow-feedback-overlay{
  position:absolute;
  inset:0;
  z-index:80;
  pointer-events:none;
}

.workflow-feedback-card{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  max-width:min(680px,92vw);
  border-radius:18px;
  padding:16px 20px;
  background:rgba(17,24,39,.78);
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 12px 40px rgba(0,0,0,.28);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}

.workflow-feedback-text{
  color:#fff;
  font-size:16px;
  line-height:1.4;
  font-weight:700;
  text-align:center;
}

/* ===== Responsive ===== */

@media (max-width:1200px){
  :root{
    --workflow-width:290px;
  }

  .pano-toolboxes{
    left:314px;
    right:12px;
  }
}

@media (max-width:980px){
  :root{
    --viewer-ui-height:104px;
    --viewer-tool-size:68px;
    --workflow-width:280px;
    --workflow-tools-box-height:68px;
    --workflow-total-height: calc(var(--viewer-pill-height) + var(--workflow-stack-gap) + var(--viewer-ui-height));
  }

  .workflow-hud{
    left:10px;
  }

  .pano-toolboxes{
    left:300px;
    right:10px;
  }

  .pano-toolbox__tab{
    padding:0 12px;
    font-size:12px;
  }
}

@media (max-width:760px){
  :root{
    --workflow-width:calc(100vw - 20px);
    --workflow-total-height: calc(var(--viewer-pill-height) + var(--workflow-stack-gap) + var(--viewer-ui-height));
  }

  .workflow-hud{
    left:10px;
    top:10px;
    width:var(--workflow-width);
  }

  .pano-toolboxes{
    left:10px;
    right:10px;
    top:150px;
  }

  .pano-toolboxes__tabs{
    padding-right:84px;
  }
}