.team-planner-page{max-width:1400px;margin:0 auto;padding:2rem}.page-description{color:#e5e5e5;font-size:1.1rem;line-height:1.6;max-width:800px;margin:0 auto}.team-planner-container{width:100%;max-width:100%;margin:0 auto}.form-section{margin-bottom:2rem}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-bottom:2rem}.form-field{display:flex;flex-direction:column}.section-label{display:block;margin-bottom:1rem;color:#fff;font-weight:600;font-size:1rem}.form-section label,.form-field label{display:block;margin-bottom:.5rem;color:#fff;font-weight:600}.form-section input[type=text],.form-section input[type=email],.form-section textarea,.form-field input[type=text],.form-field input[type=email],.form-field textarea{width:100%;padding:.75rem;background:#0d1116;border:2px solid #2b323b;color:#fff;font-size:1rem;transition:border-color .2s;font-family:inherit}.form-section input:focus,.form-section textarea:focus,.form-field input:focus,.form-field textarea:focus{outline:none;border-color:#ebed63}.row-selector{display:flex;justify-content:center;align-items:center;cursor:pointer;transition:opacity .2s}.row-icon{width:48px;height:auto;pointer-events:none}.composition-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:.75rem;max-width:100%;margin:0 auto}.position-slot{display:flex;flex-direction:column;gap:.5rem}.character-slot{background:#2b323b4d;border:2px solid #2b323b;aspect-ratio:.7;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;position:relative;overflow:hidden}.card-slot,.pet-slot{background:#2b323b4d;border:2px solid #2b323b;aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;position:relative;overflow:hidden}.character-slot:hover,.card-slot:hover,.pet-slot:hover{border-color:#ebed63;background:#ebed631a}.character-slot.filled,.card-slot.filled,.pet-slot.filled{background:#60a5fa1a}.slot-label{color:#999;font-size:.8rem;margin-bottom:.5rem}.add-button{font-size:2rem;color:#2b323b;font-weight:700}.character-slot:hover .add-button,.card-slot:hover .add-button,.pet-slot:hover .add-button{color:#ebed63}.slot-image{width:100%;height:100%;object-fit:cover}.slot-name{position:absolute;bottom:0;left:0;right:0;background:#000000e6;color:#fff;font-size:.7rem;text-align:center;padding:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.gear-slots-mini{display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,1fr);gap:4px}.gear-slot-mini{background:#2b323b4d;border:2px solid #2b323b;aspect-ratio:1;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;overflow:hidden}.gear-slot-mini:hover{border-color:#ebed63;background:#ebed631a}.gear-slot-mini.filled{background:#60a5fa1a}.add-button-mini{font-size:1.2rem;color:#2b323b;font-weight:700}.gear-slot-mini:hover .add-button-mini{color:#ebed63}.slot-image-mini{width:100%;height:100%;object-fit:cover}.team-name-title{font-size:2.5rem;font-weight:700;color:#fff;margin-bottom:2rem;text-align:center;outline:none;transition:all .2s;cursor:text;padding:.5rem;margin-top:0}.team-name-title:hover{background:#ebed630d}.team-name-title:focus{background:#ebed631a;box-shadow:0 0 0 2px #ebed634d}.team-name-title:empty:before{content:attr(data-placeholder);color:#666;font-weight:400}.pets-notes-section{display:grid;grid-template-columns:450px 1fr;gap:2rem;margin-top:2rem}.pets-column,.notes-column{display:flex;flex-direction:column}.notes-textarea{width:100%;padding:.75rem;background:#0d1116;border:2px solid #2b323b;color:#fff;font-size:1rem;transition:border-color .2s;font-family:inherit;resize:vertical;flex:1}.notes-textarea:focus{outline:none;border-color:#ebed63}.pets-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;max-width:450px}.pet-column-wrapper{display:flex;flex-direction:column;gap:.5rem}.line-indicator{display:flex;justify-content:center;align-items:center}.line-icon{width:48px;height:auto}.pet-slot{min-width:134px;max-width:140px;margin:0 auto;width:100%}.pet-slot[data-line="0"]{border-left:4px solid #3b82f6}.pet-slot[data-line="1"]{border-left:4px solid #eab308}.pet-slot[data-line="2"]{border-left:4px solid #ef4444}.entity-popup,.submission-popup{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000c;z-index:1000;align-items:center;justify-content:center;padding:2rem}.popup-content{background:#14181d;width:100%;max-width:1000px;max-height:90vh;overflow:hidden;display:flex;flex-direction:column}.popup-header{display:flex;justify-content:space-between;align-items:center;padding:1.5rem 2rem;background:#0d1116}.popup-header h2{margin:0;color:#fff}.close-btn{background:none;border:none;font-size:2rem;cursor:pointer;color:#fff;width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:background-color .2s}.close-btn:hover{background-color:#ffffff1a}.popup-search{background-color:transparent;border:2px solid #272a2f;margin:2rem;margin-bottom:0;margin-right:2.8rem;padding:.5rem 1rem;font-size:1.2rem;color:#fff;transition:.15s linear}.popup-search:focus{outline:none;background-color:#272a2f}.entities-grid{padding:2rem;display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1rem;overflow-y:auto;max-height:70vh;align-content:start}.entity-option{border:2px solid #0D1116;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:1rem;background:#14181d;overflow:hidden;padding:0;min-height:104px;position:relative}.entity-option:hover{border-color:#ebed63;transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.entity-img-wrapper{overflow:hidden;width:100px;height:100%;display:flex;align-items:center;justify-content:center;flex-shrink:0;background-color:#0003}.entity-option-image{width:auto;height:auto;max-height:80px;max-width:90%;object-fit:contain}.entity-option-info{flex:1;padding:.5rem}.entity-option-name{font-weight:600;color:#fff;margin-bottom:.5rem;line-height:1.3}.submission-popup .popup-content{max-width:600px}.submission-form-content{padding:2rem}.submission-info{background:#ebed631a;border-left:4px solid #ebed63;padding:1rem;margin-bottom:1rem;color:#e5e5e5;font-size:.95rem;line-height:1.5}.submission-note{color:#e5e5e5;font-size:1.1rem;margin-bottom:1.5rem;line-height:1.5}.submission-form-content .form-field{margin-bottom:1.5rem}.submission-form-content .form-field label{display:block;margin-bottom:.5rem;color:#fff;font-weight:600}.submission-form-content .form-field input,.submission-form-content .form-field textarea{width:100%;padding:.75rem;background:#0d1116;border:2px solid #2b323b;color:#fff;font-size:1rem;transition:border-color .2s;font-family:inherit}.submission-form-content .form-field textarea{resize:vertical}.submission-form-content .form-field input:focus,.submission-form-content .form-field textarea:focus{outline:none;border-color:#ebed63}.submission-actions{display:flex;gap:1rem;justify-content:flex-end;margin-top:2rem}.form-actions{margin-top:2rem;text-align:center;display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}.action-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;font-weight:600;font-size:1rem;cursor:pointer;transition:all .2s ease;border:2px solid}.action-btn i{font-size:1.2rem}.primary-btn{background:#ebed63;border-color:#ebed63;color:#000}.primary-btn:hover{background:#d4d558;border-color:#d4d558;transform:translateY(-2px);box-shadow:0 4px 12px #ebed634d}.primary-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.secondary-btn{background:transparent;border-color:#2b323b;color:#fff}.secondary-btn:hover{background:#2b323b;border-color:#ebed63;color:#ebed63}.secondary-btn.copied{background:#22c55e;border-color:#22c55e;color:#fff}.danger-btn{background:transparent;border-color:#dc2626;color:#dc2626}.danger-btn:hover{background:#dc2626;color:#fff}@media (max-width: 1400px){.composition-grid{grid-template-columns:repeat(5,1fr);gap:.6rem}}@media (max-width: 1024px){.composition-grid{grid-template-columns:repeat(3,1fr);gap:.75rem}}@media (max-width: 768px){.team-planner-page{padding:1rem}.page-description{font-size:1rem}.team-name-title{font-size:1.8rem;margin-bottom:1.5rem}.form-row{grid-template-columns:1fr;gap:1rem}.composition-grid{display:flex;flex-direction:row;gap:.75rem;width:max-content;padding-bottom:.5rem;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:#ebed63 #2b323b;cursor:grab;user-select:none}.composition-grid.dragging{cursor:grabbing}.composition-grid::-webkit-scrollbar{height:8px}.composition-grid::-webkit-scrollbar-track{background:#2b323b;border-radius:4px}.composition-grid::-webkit-scrollbar-thumb{background:#ebed63;border-radius:4px}.position-slot{min-width:140px;max-width:140px;flex-shrink:0}.pets-notes-section{grid-template-columns:1fr;gap:1.5rem}.pets-grid{grid-template-columns:repeat(3,1fr);gap:.5rem;max-width:100%}.pet-slot{min-width:0;max-width:none;width:100%}.line-indicators{gap:4px}.line-icon{width:32px}.notes-textarea{max-width:100%;box-sizing:border-box}.entities-grid{grid-template-columns:1fr;padding:1rem}.entity-popup{padding:1rem}.slot-name{font-size:.6rem}.add-button{font-size:1.5rem}.position-slot{gap:.4rem}.action-btn{width:100%;justify-content:center}}@media (max-width: 480px){.composition-grid{grid-template-columns:1fr}.entity-popup{padding:.5rem}.popup-content{max-height:95vh}.popup-search{margin:1rem 1rem 0}.entities-grid{padding:.5rem;gap:.5rem}.entity-option{min-height:80px}.entity-img-wrapper{width:80px}.entity-option-image{max-height:60px}}