.fis-app{
  --fis-bg:#f4f7fb;
  --fis-card:#fff;
  --fis-text:#1f2937;
  --fis-sub:#6b7280;
  --fis-line:#d9e2ef;
  --fis-main:#2563eb;
  --fis-main-dark:#1d4ed8;
  --fis-warn:#ef4444;
  max-width:1200px;
  margin:0 auto;
  padding:16px;
  color:var(--fis-text);
  font-family:"Hiragino Sans","Yu Gothic","Meiryo",sans-serif;
}
.fis-app *{box-sizing:border-box;}
.fis-header{text-align:center;margin:6px 0 16px;}
.fis-header h2{margin:0 0 6px;font-size:clamp(24px,4vw,36px);}
.fis-header p{margin:0;color:var(--fis-sub);}
.fis-panel{background:var(--fis-card);border:1px solid var(--fis-line);border-radius:20px;padding:16px;margin:0 0 16px;box-shadow:0 6px 18px rgba(0,0,0,.04);}
.fis-panel h3{margin:0 0 12px;font-size:20px;}
.fis-drop{border:3px dashed #9db8ec;border-radius:20px;background:#f8fbff;text-align:center;padding:30px 14px;cursor:pointer;transition:.2s;}
.fis-drop.fis-dragover{background:#ebf3ff;border-color:var(--fis-main);}
.fis-drop strong{display:block;font-size:20px;margin-bottom:6px;}
.fis-drop span{color:var(--fis-sub);font-size:14px;}
.fis-controls{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;align-items:end;}
.fis-field span{display:block;font-weight:700;margin-bottom:6px;}
.fis-field input,.fis-field select{width:100%;padding:10px 12px;border:1px solid var(--fis-line);border-radius:12px;font-size:15px;background:#fff;}
.fis-button-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px;align-items:center;}
.fis-btn{border:none;border-radius:12px;padding:11px 16px;font-size:15px;font-weight:700;cursor:pointer;background:var(--fis-main);color:#fff;line-height:1.2;}
.fis-btn:hover{background:var(--fis-main-dark);}
.fis-btn-light{background:#e8f0ff;color:#1d4ed8;}
.fis-btn-light:hover{background:#dbe8ff;}
.fis-btn-sub{background:#475569;color:#fff;}
.fis-btn-sub:hover{background:#334155;}
.fis-btn-warn{background:var(--fis-warn);color:#fff;}
.fis-btn-warn:hover{background:#dc2626;}
.fis-btn:disabled{opacity:.45;cursor:not-allowed;}
.fis-editor-grid{display:grid;grid-template-columns:minmax(300px,1.2fr) minmax(260px,.8fr);gap:16px;}
.fis-canvas-box{background:#111827;border-radius:16px;padding:12px;overflow:auto;min-height:320px;}
.fis-canvas-box canvas{display:block;max-width:100%;margin:0 auto;border-radius:8px;background:#111827;touch-action:none;}
.fis-note{margin:10px 0 0;color:var(--fis-sub);font-size:14px;line-height:1.6;}
.fis-info{background:#f8fafc;border:1px solid var(--fis-line);border-radius:16px;padding:12px;font-size:14px;line-height:1.7;color:#334155;min-height:96px;}
.fis-result-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;}
.fis-result-card{border:1px solid var(--fis-line);border-radius:16px;padding:10px;background:#fff;}
.fis-result-title{display:flex;gap:8px;align-items:center;justify-content:space-between;margin-bottom:8px;font-weight:700;}
.fis-result-title small{color:var(--fis-sub);font-weight:500;}
.fis-result-card canvas{width:100%;border:1px solid #e5e7eb;border-radius:10px;background:#f3f4f6;display:block;}
.fis-result-card .fis-btn{width:100%;margin-top:10px;}
.fis-hidden{display:none!important;}
@media(max-width:900px){.fis-editor-grid{grid-template-columns:1fr;}}

.fis-btn-active{background:#1d4ed8 !important;color:#fff !important;box-shadow:0 0 0 3px rgba(37,99,235,.15) inset;}

.fis-inline-field{display:flex;align-items:center;gap:8px;margin:0;}
.fis-inline-field span{margin:0;font-size:14px;white-space:nowrap;}
.fis-inline-field select{min-width:110px;}