.ccc-wrap{max-width:1200px}.ccc-app{display:grid;gap:24px}.ccc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:24px;align-items:start}.ccc-panel{background:#fff;border:1px solid #dcdcde;border-radius:10px;padding:20px;box-sizing:border-box;min-width:0}.ccc-panel h2,.ccc-panel h3{margin-top:0}.ccc-help{color:#50575e;font-size:13px}.ccc-message{padding:10px 12px;border-radius:8px;margin-bottom:16px}.ccc-message--success{background:#edfaef;border:1px solid #9ad7a0}.ccc-message--error{background:#fcf0f1;border:1px solid #e6a8ad}.ccc-form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px}.ccc-field{display:flex;flex-direction:column;gap:6px}.ccc-field input,.ccc-field select,.ccc-field textarea{width:100%;box-sizing:border-box}.ccc-field textarea{min-height:80px}.ccc-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}.ccc-elements-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(92px,1fr));gap:10px;max-height:360px;overflow:auto;padding-right:4px}.ccc-element-input label{font-size:12px;font-weight:600}.ccc-element-input input{width:100%}.ccc-table-wrap{overflow-x:auto;max-width:100%}.ccc-table{width:100%;border-collapse:collapse;min-width:640px}.ccc-table th,.ccc-table td{border:1px solid #dcdcde;padding:8px;text-align:left;vertical-align:top;white-space:nowrap}.ccc-table th{background:#f6f7f7}.ccc-list{display:grid;gap:14px}.ccc-card{border:1px solid #dcdcde;border-radius:10px;padding:14px;background:#fff;min-width:0}.ccc-card-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;flex-wrap:wrap;margin-bottom:10px}.ccc-card-head h4{margin:0}.ccc-inline-actions{display:flex;gap:8px;flex-wrap:wrap}.ccc-recipe-scroll{overflow-x:auto;max-width:100%;border:1px solid #dcdcde;border-radius:8px}.ccc-recipe-table{width:max-content;min-width:100%;border-collapse:collapse}.ccc-recipe-table th,.ccc-recipe-table td{border:1px solid #dcdcde;padding:8px;white-space:nowrap}.ccc-recipe-table th{background:#f6f7f7}.ccc-recipe-meta{font-size:12px;color:#50575e;margin-top:8px}.ccc-item-row{display:grid;grid-template-columns:minmax(160px,2fr) minmax(110px,1fr) auto;gap:10px;align-items:end;margin-bottom:10px}.ccc-item-row .ccc-field{margin:0}.ccc-loading{padding:24px;text-align:center}.ccc-empty{color:#50575e;font-style:italic}.ccc-strong{font-weight:600}.ccc-material-chip{display:inline-block;background:#f6f7f7;border:1px solid #dcdcde;border-radius:999px;padding:3px 8px;margin:2px 6px 2px 0;font-size:12px}.ccc-recipe-section,.ccc-recipe-form-section{width:100%;min-width:0}.ccc-section-stack{display:grid;gap:24px}.ccc-small{font-size:12px;color:#50575e}.button-link-delete{color:#b32d2e}
@media (max-width:782px){.ccc-item-row{grid-template-columns:1fr}.ccc-panel{padding:16px}}

.ccc-recipe-notes{margin-top:10px;padding:12px;border:1px solid #dcdcde;border-radius:8px;background:#f6f7f7}
.ccc-recipe-notes-title{font-weight:600;margin-bottom:6px}
.ccc-recipe-notes-body{font-size:13px;color:#1d2327;line-height:1.5;word-break:break-word}

.ccc-materials-scroll{max-height:360px;overflow:auto;border:1px solid #dcdcde;border-radius:8px}
.ccc-materials-scroll .ccc-table{margin:0}

.ccc-periodic-panel{margin-bottom:24px}
.ccc-periodic-wrap{overflow:auto;max-width:100%;padding-bottom:6px}
.ccc-periodic-grid{display:grid;grid-template-columns:repeat(18,minmax(52px,1fr));grid-auto-rows:minmax(58px,auto);gap:6px;min-width:1000px}
.ccc-element-tile{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:2px;padding:6px;border:1px solid #dcdcde;border-radius:8px;background:#fff;cursor:pointer;text-align:left;min-width:0}
.ccc-element-tile.is-active{outline:2px solid #2271b1;outline-offset:1px}
.ccc-element-number{font-size:10px;color:#50575e}
.ccc-element-symbol{font-size:16px;font-weight:700;line-height:1}
.ccc-element-name{font-size:10px;color:#50575e;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.ccc-element-detail{margin-top:16px;border:1px solid #dcdcde;border-radius:10px;padding:16px;background:#f6f7f7}
.ccc-element-detail-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;flex-wrap:wrap}
.ccc-element-detail-head h3{margin:4px 0 0}
.ccc-element-detail-number{font-size:12px;color:#50575e}
.ccc-element-badges{display:flex;gap:8px;flex-wrap:wrap}
.ccc-badge{display:inline-block;background:#fff;border:1px solid #dcdcde;border-radius:999px;padding:4px 8px;font-size:12px}
.ccc-element-detail-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:12px;margin-top:14px}
.ccc-element-summary{margin:14px 0 0}
.ccc-element-tile--alkali-metal{background:#fff1f1}
.ccc-element-tile--alkaline-earth{background:#fff7e8}
.ccc-element-tile--transition-metal{background:#f3f7ff}
.ccc-element-tile--post-transition-metal{background:#eef8f5}
.ccc-element-tile--metalloid{background:#f7f6e9}
.ccc-element-tile--nonmetal{background:#eefbf1}
.ccc-element-tile--halogen{background:#fef1fb}
.ccc-element-tile--noble-gas{background:#f2f0ff}
.ccc-element-tile--lanthanide{background:#fff6f0}
.ccc-element-tile--actinide{background:#fff0f5}
.ccc-element-tile--unknown{background:#f6f7f7}
@media (max-width:782px){.ccc-periodic-grid{grid-template-columns:repeat(18,minmax(48px,1fr));min-width:920px}}

.ccc-version-banner{margin-bottom:16px;padding:10px 12px;border:1px solid #c3c4c7;border-radius:8px;background:#f6f7f7;font-weight:600}
