.exw-deck-planner *{ box-sizing:border-box; font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
    
    .exw-deck-planner{
      --canvas-bg:#FFFFFC;
      --panel-bg:#F7F7F7;
      --text:#10110C;
      --muted:#10110C;
      --border:#C1C1BB;
      --active:#FF5733;
      --icon:#8B8E85;
      --shadow:0 14px 32px rgba(0,0,0,0.10);
    }
.exw-deck-planner{
      margin:0; padding:0; background:var(--canvas-bg); color:var(--text);
      display:flex; justify-content:center; align-items:flex-start; min-height:100vh;
    }
    .exw-deck-planner .container{ display:flex; gap:16px; padding:16px; max-width:1200px; width:100%; }
    
    /* Fullscreen mode (keeps sidebar visible) */
    .exw-deck-planner .container.is-fs{
      max-width:none;
      width:calc(100vw - 16px);
      height:calc(100vh - 16px);
      padding:8px;
    }
    .exw-deck-planner .container.is-fs .canvas-panel, .exw-deck-planner .container.is-fs .controls-panel{ height:100%; }
    .exw-deck-planner .container.is-fs .controls-panel{ overflow:auto; }
.exw-deck-planner .panel{
      background:var(--panel-bg); border-radius:16px; padding:12px 14px;
      box-shadow:var(--shadow); border:1px solid var(--border);
    }
    .exw-deck-planner .canvas-panel{ flex:2; display:flex; flex-direction:column; gap:8px; }
    .exw-deck-planner .controls-panel{ flex:1; display:flex; flex-direction:column; gap:10px; min-width:290px; }
    .exw-deck-planner canvas{
      border-radius:12px; border:1px solid var(--border);
      background:var(--canvas-bg);
      cursor:crosshair; display:block;
    }
    .exw-deck-planner h2, .exw-deck-planner h3{ margin:0 0 6px; font-size:15px; color:var(--text); }
    .exw-deck-planner .hint{ font-size:12px; color:var(--muted); }
    .exw-deck-planner .field{ display:flex; flex-direction:column; margin-bottom:6px; gap:2px; }
	.exw-deck-planner .toggle{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:12px;
  color:var(--border);
  margin-bottom:4px;
}
.exw-deck-planner .toggle input{
  width:auto;
}

    .exw-deck-planner label{ font-size:12px; color:var(--muted); }
    .exw-deck-planner input, .exw-deck-planner select{
      background:var(--canvas-bg); border-radius:8px; border:1px solid var(--border);
      color:var(--text); padding:6px 8px; font-size:13px; outline:none; width:100%;
    }
    .exw-deck-planner input:focus, .exw-deck-planner select:focus{ border-color:var(--active); box-shadow:0 0 0 2px rgba(255,87,51,0.22); }
    .exw-deck-planner button{
      border-radius:999px; border:none; padding:7px 10px; font-size:13px; cursor:pointer;
      background:var(--active); color:var(--canvas-bg); font-weight:600;
      display:inline-flex; align-items:center; justify-content:center; gap:6px;
    }
    .exw-deck-planner button.secondary{ background:var(--canvas-bg); color:var(--text); border:1px solid var(--border); }
    .exw-deck-planner button:active{ transform:translateY(1px); }
    .exw-deck-planner .buttons-row{ display:flex; gap:8px; margin-top:6px; flex-wrap:wrap; }
    
.exw-deck-planner .icon-btn{display:inline-flex;align-items:center;gap:6px; color:var(--icon); }
.exw-deck-planner .icon-btn svg{width:18px;height:18px;fill:currentColor;opacity:.9}
.exw-deck-planner .icon-btn.active{border-color:var(--active); box-shadow:0 0 0 2px rgba(255,87,51,0.18) inset;}
.exw-deck-planner .status{ font-size:12px; color:var(--muted); min-height:18px; margin-top:4px; }
    .exw-deck-planner .badge{
      display:inline-flex; align-items:center; gap:6px; font-size:11px;
      background:rgba(15,23,42,0.9); border-radius:999px; border:1px solid var(--border);
      padding:3px 8px; color:var(--muted);
    }
    .exw-deck-planner .badge-dot{ width:7px; height:7px; border-radius:999px; background:var(--active); }
    .exw-deck-planner .section{ padding-bottom:6px; border-bottom:1px solid var(--border); margin-bottom:6px; }
    .exw-deck-planner .small{ font-size:11px; color:var(--muted); }
    .exw-deck-planner .stock-rows{ margin-top:4px; display:flex; flex-direction:column; gap:4px; }
    .exw-deck-planner .stock-row{ display:flex; gap:6px; align-items:center; }
    .exw-deck-planner .onlyLen{ display:flex; align-items:center; }
    .exw-deck-planner .onlyLen input{ width:16px; height:16px; }
    .exw-deck-planner .stock-row input{ flex:1; }
  
    .exw-deck-planner .badge{ display:inline-block; width:10px; margin-right:8px; font-size:14px; line-height:1; vertical-align:middle; opacity:0.9; }
    .exw-deck-planner .badge.ok{ color:#16a34a; }
    .exw-deck-planner .badge.bad{ color:#dc2626; }

    /* --- Final summary (Stage 5) --- */
    .exw-deck-planner .final-summary{
      margin-top: 8px;
      padding: 10px 12px;
      border: 1px solid var(--border);
      border-radius: 12px;
      background: var(--canvas-bg);
    }
    .exw-deck-planner .final-summary-head{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:10px;
      margin-bottom:8px;
    }
    .exw-deck-planner .final-summary-head h3{ margin:0; font-size:13px; color: var(--text); }
    .exw-deck-planner .final-summary-list{
      display:flex;
      flex-direction:column;
      gap:6px;
      font-size:12px;
      color: var(--text);
    }
    .exw-deck-planner .final-summary-item{
      display:flex;
      justify-content:space-between;
      gap:10px;
      padding: 6px 8px;
      border-radius: 10px;
      border: 1px solid var(--border);
      background: var(--canvas-bg);
    }
    .exw-deck-planner .final-summary-k{ color: var(--text); }
    .exw-deck-planner .final-summary-v{ color: var(--text); font-variant-numeric: tabular-nums; text-align:right; }
    .exw-deck-planner .final-json{
      margin-top: 8px;
      padding: 8px 10px;
      border-radius: 10px;
      border: 1px solid var(--border);
      background: var(--canvas-bg);
      color: var(--text);
      font-size: 11px;
      max-height: 180px;
      overflow:auto;
      display:none;
      white-space: pre-wrap;
      word-break: break-word;
    }


    /* Fullscreen layout (maximize canvas) */
    .exw-deck-planner .container.is-fs{
      position:fixed; inset:0;
      width:100vw; height:100vh;
      max-width:none; margin:0;
      padding:12px; gap:12px;
      display:grid;
      grid-template-columns: 1fr 360px; /* canvas area + right sidebar */
      grid-template-rows: 1fr;
    }
    .exw-deck-planner .container.is-fs .canvas-panel{
      min-width:0;
      height:100%;
      display:flex;
      flex-direction:column;
    }
    .exw-deck-planner .container.is-fs .controls-panel{
      width:360px;
      height:100%;
      overflow:auto;
    }
    .exw-deck-planner .container.is-fs .canvas-wrap{
      flex:1;
      min-height:0;
    }
    .exw-deck-planner .container.is-fs canvas{
      display:block;
      width:100%;
      height:100%;
    }
    .exw-deck-planner .container.is-fs #finalSummary{
      max-height:30vh;
      overflow:auto;
    }
