*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,sans-serif;background:#f8f8f8;color:#111}.app{min-height:100vh;padding:24px;display:flex;flex-direction:column;align-items:center}.app-logo{height:200px;margin-bottom:32px}.layout{width:100%;max-width:1200px;display:grid;grid-template-columns:1fr;gap:48px}.preview{position:sticky;top:24px;display:flex;justify-content:center;height:18rem;z-index:10}.guitar{position:relative;width:50rem;height:15rem;filter:drop-shadow(0 18px 30px rgba(0,0,0,.38))}.guitar img{position:absolute;inset:0;width:100%;pointer-events:none}.controls-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.selector{background:#fff;padding:16px;border-radius:12px;border:1px solid #e5e5e5;text-align:center}.controls-grid .selector:first-child{grid-column:span 2}.selector h3{margin-bottom:12px;font-size:15px;font-weight:500;color:#333}.color-options{display:flex;justify-content:center;flex-wrap:wrap;gap:14px}.color-circle{width:34px;height:34px;border-radius:50%;border:2px solid #ddd;cursor:pointer;transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease}.color-circle:hover{transform:scale(1.12)}.color-circle.active{border-color:#111;box-shadow:0 0 0 3px #0000001f;transform:scale(1.15)}.button-options{display:flex;justify-content:center;flex-wrap:wrap;gap:10px}.option-button{padding:7px 14px;border-radius:8px;border:1px solid #ccc;background:#fff;cursor:pointer;font-size:14px;color:#222;transition:background .15s ease,border-color .15s ease,box-shadow .15s ease}.option-button:hover{background:#f3f3f3}.option-button.active{border-color:#111;background:#eaeaea;box-shadow:0 2px 4px #00000014}.selector input[type=checkbox]{margin-right:8px;transform:scale(1.1);cursor:pointer}.selector label{font-size:14px;color:#333}.footer{margin-top:64px;padding:16px;text-align:center;font-size:14px;color:#666}.footer-link{color:#000;font-weight:500;text-decoration:none}.footer-link:hover{text-decoration:underline}.about{max-width:700px;margin:48px auto;padding:0 24px;text-align:center}.about img{width:350px;height:350px;border-radius:50%;object-fit:cover;margin-bottom:24px}.about h2{margin-bottom:16px}.about p{margin-bottom:12px;line-height:1.6;color:#444}@media(max-width:900px){.controls-grid{grid-template-columns:1fr}.controls-grid .selector:first-child{grid-column:span 1}}@media(max-width:600px){.guitar{width:300px;height:200px}.preview{height:10rem}.app-logo{height:150px;margin-bottom:32px}}
