.nomon-composition-area{gap:var(--grid-gap,3rem);grid-template-columns:repeat(12,1fr);align-items:start;width:100%;max-width:1400px;margin:0 auto;display:grid}.nomon-block-vessel{grid-column:span var(--block-span,12);flex-direction:column;width:100%;min-width:0;transition:all .4s cubic-bezier(.16,1,.3,1);display:flex}@media (width<=960px){.nomon-composition-area{grid-template-columns:1fr;gap:2rem;padding:0 1.5rem}.nomon-block-vessel{grid-column:span 1!important}}:root{--bg-primary:#fff;--bg-secondary:#fcfcfc;--bg-tertiary:#f5f5f5;--text-primary:#000;--text-secondary:#666;--border-primary:#eee;--accent-color:#000;--accent-contrast:#fff;--radius-subtle:.2rem;--p-mobile:5%;--p-desktop:8%}.theme-dark{--bg-primary:#000;--bg-secondary:#0a0a0a;--bg-tertiary:#111;--text-primary:#fff;--text-secondary:#aaa;--border-primary:#222;--accent-color:#fff;--accent-contrast:#000}*{box-sizing:border-box}body{background-color:var(--bg-primary);color:var(--text-primary);margin:0;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.5}.main-navbar{padding:1.5rem var(--p-mobile);justify-content:space-between;align-items:center;width:100%;display:flex}.nav-logo{letter-spacing:.15em;text-transform:uppercase;cursor:pointer;font-family:Outfit,sans-serif;font-size:1.2rem;font-weight:400}.nav-links{text-transform:uppercase;letter-spacing:.1em;gap:2.5rem;font-size:.8rem;list-style:none;display:flex}.hero-section{padding:3rem var(--p-mobile);width:100%}.hero-title{letter-spacing:-.02em;text-transform:uppercase;letter-spacing:.05em;margin:0;font-family:Outfit,sans-serif;font-size:12vw;font-weight:300;line-height:1}.hero-subtitle{color:var(--text-secondary);max-width:90%;margin-top:1.5rem;font-size:1.1rem}.grid-container{padding:2rem var(--p-mobile);flex-wrap:wrap;gap:2rem;width:100%;display:flex}.data-card{cursor:pointer;flex-direction:column;flex:100%;margin-bottom:2rem;display:flex}.card-image-placeholder{aspect-ratio:16/9;background-color:var(--bg-tertiary);border-radius:var(--radius-subtle);object-fit:cover;width:100%;margin-bottom:1rem}.card-label{text-transform:uppercase;letter-spacing:.15em;color:var(--text-secondary);margin-bottom:.5rem;font-size:.7rem}.card-title{text-transform:lowercase;margin:0 0 .5rem;font-family:Outfit,sans-serif;font-size:1.5rem;font-weight:400;line-height:1.2}.card-title:first-letter{text-transform:uppercase}.card-summary{color:var(--text-secondary);font-size:1rem}@media (width>=768px){.main-navbar,.hero-section,.grid-container{padding-left:var(--p-desktop);padding-right:var(--p-desktop)}.nav-links{text-transform:uppercase;letter-spacing:.1em;gap:2.5rem;font-size:.8rem;list-style:none;display:flex}.hero-title{font-size:8rem}.data-card{flex:0 calc(33.333% - 1.5rem)}}.materia-forge{padding:4rem var(--p-mobile);max-width:800px}.forge-title{text-transform:uppercase;letter-spacing:.1em;border-bottom:1px solid var(--border-primary);margin-bottom:3rem;padding-bottom:1rem;font-family:Outfit,sans-serif;font-size:2.2rem;font-weight:300}.forge-form{flex-direction:column;gap:1.5rem;display:flex}.forge-form input,.forge-form select,.forge-form textarea{border:1px solid var(--border-primary);background-color:var(--bg-primary);color:var(--text-primary);border-radius:var(--radius-subtle);font-family:inherit;font-size:1rem}.forge-form textarea{min-height:150px}.forge-btn{background-color:var(--accent-color);color:var(--accent-contrast);text-transform:uppercase;letter-spacing:.1em;cursor:pointer;border:none;padding:1.5rem;font-weight:900;transition:opacity .2s}.forge-btn:hover{opacity:.8}.materia-forge-container{padding:4rem var(--p-mobile);flex-wrap:wrap;gap:4rem;display:flex}.forge-main{flex:600px}.forge-inventory{border-left:1px solid var(--border-primary);flex:300px;padding-left:2rem}.inventory-list{flex-direction:column;gap:1rem;margin-top:2rem;display:flex}.inventory-item{border:1px solid var(--border-primary);background-color:var(--bg-secondary);padding:1rem}.inventory-item:hover{background:var(--bg-tertiary)}.inventory-item strong{font-size:.9rem;display:block}.inventory-item span{color:var(--text-secondary);font-size:.7rem}.forge-actions{gap:1rem;display:flex}.forge-btn-delete{color:#fff;text-transform:uppercase;letter-spacing:.1em;cursor:pointer;background-color:#f44;border:none;padding:1.5rem;font-weight:900;transition:opacity .2s}.forge-btn-delete:hover{background-color:#c00}.forge-btn-cancel{border:1px solid var(--accent-color);cursor:pointer;background:0 0;padding:1rem;font-weight:700}.class-selector-header{background:var(--bg-secondary);border-radius:var(--radius-subtle);border:1px solid var(--border-primary);align-items:center;gap:1rem;margin-bottom:2rem;padding:1rem;display:flex}.class-selector-header label{color:var(--text-secondary);font-size:.7rem;font-weight:900}.new-btn{background:var(--accent-color);color:var(--accent-contrast);cursor:pointer;border:none;margin-left:auto;padding:.5rem 1rem;font-size:.7rem;font-weight:900}.form-row{gap:1rem;display:flex}.form-row input{flex:1}.body-editor{background:var(--bg-secondary);color:var(--text-primary);border:1px solid var(--border-primary);min-height:300px!important;font-family:monospace!important}.inventory-group{margin-bottom:2rem}.group-label{text-transform:uppercase;letter-spacing:.2em;color:var(--text-secondary);border-bottom:1px solid var(--border-primary);margin-bottom:1rem;padding-bottom:.3rem;font-size:.6rem;display:block}.inventory-item code{color:var(--text-secondary);margin-top:.2rem;font-size:.6rem;display:block}.banner-info{width:100%;padding:100px var(--p-mobile);background-color:var(--bg-primary);border-top:1px solid var(--border-color);border-bottom:1px solid var(--border-primary);justify-content:flex-start;align-items:center;margin:4rem 0;display:flex}.banner-content{text-align:left;max-width:900px}.banner-title{color:var(--text-primary);letter-spacing:.02em;text-transform:uppercase;margin:0 0 2rem;font-family:Outfit,sans-serif;font-size:3.5rem;font-weight:500;line-height:1.1}.banner-text{color:var(--text-secondary);max-width:800px;margin:0;font-family:Outfit,sans-serif;font-size:1.4rem;font-weight:300;line-height:1.6}@media (width>=768px){.banner-info{padding-left:var(--p-desktop);padding-right:var(--p-desktop)}.banner-title{font-size:4.5rem}}.banner-action{width:100%;padding:120px var(--p-mobile);background-color:var(--bg-secondary);justify-content:center;align-items:center;margin:2rem 0;display:flex}.banner-action-content{text-align:center;max-width:1000px}.banner-action-title{letter-spacing:-.04em;text-transform:uppercase;letter-spacing:.05em;margin-bottom:2rem;font-family:Outfit,sans-serif;font-size:3.5rem;font-weight:500;line-height:1.1}.banner-action-summary{color:var(--text-secondary);margin-bottom:3rem;font-family:Outfit,sans-serif;font-size:1.3rem;font-weight:300;line-height:1.6}.banner-action-btn{background:var(--accent-color);color:var(--accent-contrast);letter-spacing:.1em;cursor:pointer;border:none;align-items:center;gap:10px;padding:1.2rem 3rem;font-family:Outfit,sans-serif;font-size:.9rem;font-weight:600;transition:all .3s;display:inline-flex}.banner-action-btn:hover{background:var(--accent-contrast);color:var(--accent-color);border:1px solid var(--accent-color)}@media (width>=768px){.banner-action{padding-left:var(--p-desktop);padding-right:var(--p-desktop)}.banner-action-title{font-size:4.5rem}}.materia-detail{background-color:var(--bg-primary);width:100%}.detail-hero{background-color:var(--bg-tertiary);width:100%;height:60vh;overflow:hidden}.detail-image{object-fit:cover;width:100%;height:100%;display:block}.detail-container{max-width:800px;padding:4rem var(--p-mobile);margin:0 auto}.detail-header{border-bottom:1px solid var(--border-primary);margin-bottom:4rem;padding-bottom:2rem}.detail-label{text-transform:uppercase;letter-spacing:.2em;color:var(--text-secondary);margin-bottom:1rem;font-size:.7rem;display:block}.detail-title{letter-spacing:.02em;text-transform:uppercase;margin:0;font-family:Outfit,sans-serif;font-size:3rem;font-weight:500;line-height:1.1}.detail-body{color:var(--text-primary);font-family:Inter,sans-serif;font-size:1.2rem;line-height:1.8}.detail-body p{margin-bottom:2rem}.detail-body h2,.detail-body h3{margin:3rem 0 1.5rem;font-family:Outfit,sans-serif;line-height:1.2}@media (width>=768px){.detail-container{padding:6rem 0}.detail-title{font-size:4.5rem}}
