*{margin:0;padding:0;box-sizing:border-box}html{-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;background:linear-gradient(135deg, #0f172a 0%, #1e293b 50%, #334155 100%);min-height:100vh;padding:10px;overflow-x:hidden}@media(min-width: 768px){body{padding:20px}}.container{max-width:1400px;margin:0 auto;background:#fff;border-radius:10px;box-shadow:0 20px 60px rgba(0,0,0,.3);overflow:hidden;width:100%}@media(min-width: 768px){.container{border-radius:20px}}.content{display:grid;grid-template-columns:1fr;gap:20px;padding:15px}@media(min-width: 768px){.content{gap:25px;padding:25px}}@media(min-width: 1024px){.content{grid-template-columns:400px 1fr;gap:30px;padding:30px}}.header{background:linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);color:#fff;padding:20px 15px;text-align:center}@media(min-width: 768px){.header{padding:30px}}.header h1{font-size:1.8em;margin-bottom:8px;line-height:1.2}@media(min-width: 768px){.header h1{font-size:2.5em;margin-bottom:10px}}.header p{font-size:.95em;opacity:1;color:hsla(0,0%,100%,.98)}@media(min-width: 768px){.header p{font-size:1.1em}}.form-section{background:#f8f9fa;padding:20px;border-radius:15px}@media(min-width: 768px){.form-section{padding:25px}}.section-title{font-size:1.1em;font-weight:700;color:#3b82f6;margin:20px 0 12px 0;padding-bottom:8px;border-bottom:2px solid #3b82f6}.section-title:first-child{margin-top:0}@media(min-width: 768px){.section-title{font-size:1.2em;margin:25px 0 15px 0;padding-bottom:10px}}.form-group{margin-bottom:15px}@media(min-width: 768px){.form-group{margin-bottom:20px}}.form-group label{display:block;font-weight:600;margin-bottom:8px;color:#1f2937;font-size:.95em}.form-group small{display:block;margin-top:5px;color:#4b5563;font-size:.85em}.form-group input,.form-group select{width:100%;padding:10px;border:2px solid #e0e0e0;border-radius:8px;font-size:16px;transition:border-color .3s ease;-webkit-appearance:none;appearance:none;background-color:#fff}@media(min-width: 768px){.form-group input,.form-group select{padding:12px;font-size:1em}}.form-group input:focus,.form-group select:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px rgba(59,130,246,.1)}.form-group select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23333' d='M10.293 3.293L6 7.586 1.707 3.293A1 1 0 00.293 4.707l5 5a1 1 0 001.414 0l5-5a1 1 0 10-1.414-1.414z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:35px}@media(min-width: 768px){.form-group select{padding-right:40px}}.grid-inputs{display:grid;grid-template-columns:1fr 1fr;gap:10px}@media(min-width: 768px){.grid-inputs{gap:15px}}.submit-btn{width:100%;padding:14px;background:linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);color:#fff;border:none;border-radius:8px;font-size:1em;font-weight:600;cursor:pointer;transition:all .2s ease;margin-top:10px;touch-action:manipulation}@media(min-width: 768px){.submit-btn{padding:15px;font-size:1.1em}}@media(hover: hover){.submit-btn:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(59,130,246,.4);background:linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%)}}.submit-btn:active{transform:translateY(0)}.artwork-input-group{background:#f8f9fa;padding:15px;border-radius:8px;margin-bottom:15px;border-left:3px solid #3b82f6}@media(min-width: 768px){.artwork-input-group{padding:20px}}.artwork-input-group .form-group{margin-bottom:10px}.artwork-input-group .form-group:last-child{margin-bottom:0}.results-section{background:#f8f9fa;padding:20px;border-radius:15px;width:100%;overflow:hidden}@media(min-width: 768px){.results-section{padding:25px}}.error{background:#fef2f2;color:#dc2626;padding:12px;border-radius:8px;border-left:4px solid #dc2626;margin-bottom:15px;font-size:.9em}@media(min-width: 768px){.error{padding:15px;margin-bottom:20px;font-size:1em}}.placeholder{text-align:center;padding:40px 15px;color:#6b7280}@media(min-width: 768px){.placeholder{padding:60px 20px}}.placeholder svg{width:80px;height:80px;margin-bottom:15px;opacity:.3}@media(min-width: 768px){.placeholder svg{width:100px;height:100px;margin-bottom:20px}}.visualization{background:#fff;border-radius:10px;padding:15px;margin-bottom:15px;box-shadow:0 2px 10px rgba(0,0,0,.1);overflow:hidden}@media(min-width: 768px){.visualization{padding:20px;margin-bottom:20px;overflow:visible}}.visualization h2{font-size:1.1em;margin-bottom:10px;color:#1f2937}@media(min-width: 768px){.visualization h2{font-size:1.2em;margin-bottom:15px}}.visualization-legend{text-align:center;color:#4b5563;margin-top:10px;font-size:.75em;line-height:1.6}@media(min-width: 768px){.visualization-legend{font-size:.9em}}.legend-color{color:#ef4444}.legend-blue{color:#3b82f6}.legend-orange{color:#f59e0b}.legend-purple{color:#a855f7}.mobile-break{display:inline}@media(min-width: 480px){.mobile-break{display:none}}.scroll-hint{display:block;text-align:center;color:#6b7280;margin-top:8px;font-size:.7em;font-style:italic}@media(min-width: 768px){.scroll-hint{display:none}}.wall-wrapper{width:100%;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;padding-bottom:10px;overscroll-behavior-x:contain;display:block}.wall-container{position:relative;margin:15px 0;border:2px solid #333;background:#fafafa;box-shadow:inset 0 0 20px rgba(0,0,0,.05);min-width:280px}@media(min-width: 768px){.wall-container{margin:20px auto;border:3px solid #333}}.artwork{position:absolute;border:2px solid #8b4513;background:linear-gradient(135deg, #f5f5dc 0%, #deb887 100%);box-shadow:0 2px 4px rgba(0,0,0,.3)}@media(min-width: 768px){.artwork{border:3px solid #8b4513;box-shadow:0 4px 8px rgba(0,0,0,.3)}}.artwork-inner{width:100%;height:100%;border:1px solid #654321;background:#fff;display:flex;align-items:center;justify-content:center;font-weight:bold;color:#4b5563;font-size:.8em}@media(min-width: 768px){.artwork-inner{border:2px solid #654321;font-size:1em}}.nail{position:absolute;width:8px;height:8px;background:#f44;border-radius:50%;transform:translate(-50%, -50%);box-shadow:0 2px 4px rgba(0,0,0,.3);z-index:10}.measurement-line{position:absolute;background:#3b82f6;z-index:5}.measurement-line-horizontal{height:2px}.measurement-line-vertical{width:2px}.measurement-label-visual{position:absolute;background:#3b82f6;color:#fff;padding:2px 5px;border-radius:3px;font-size:9px;font-weight:600;white-space:nowrap;z-index:6;box-shadow:0 1px 3px rgba(0,0,0,.3)}@media(min-width: 768px){.measurement-label-visual{padding:2px 6px;font-size:11px}}.measurement-arrow-left{position:absolute;width:0;height:0;border-style:solid;z-index:5;border-width:4px 6px 4px 0;border-color:rgba(0,0,0,0) #3b82f6 rgba(0,0,0,0) rgba(0,0,0,0)}.measurement-arrow-right{position:absolute;width:0;height:0;border-style:solid;z-index:5;border-width:4px 0 4px 6px;border-color:rgba(0,0,0,0) rgba(0,0,0,0) rgba(0,0,0,0) #3b82f6}.measurement-arrow-up{position:absolute;width:0;height:0;border-style:solid;z-index:5;border-width:0 4px 6px 4px;border-color:rgba(0,0,0,0) rgba(0,0,0,0) #3b82f6 rgba(0,0,0,0)}.measurement-arrow-down{position:absolute;width:0;height:0;border-style:solid;z-index:5;border-width:6px 4px 0 4px;border-color:#3b82f6 rgba(0,0,0,0) rgba(0,0,0,0) rgba(0,0,0,0)}.measurements{background:#fff;border-radius:10px;padding:15px;box-shadow:0 2px 10px rgba(0,0,0,.1)}@media(min-width: 768px){.measurements{padding:20px}}.measurements h2{margin-bottom:15px;color:#1f2937}.measurement-grid{display:grid;gap:12px}@media(min-width: 768px){.measurement-grid{gap:15px}}.measurement-item{background:#f8f9fa;padding:12px;border-radius:8px;border-left:4px solid #3b82f6}@media(min-width: 768px){.measurement-item{padding:15px}}.measurement-item h3{color:#3b82f6;margin-bottom:8px;font-size:.95em}@media(min-width: 768px){.measurement-item h3{margin-bottom:10px;font-size:1em}}.measurement-row{display:flex;justify-content:space-between;padding:4px 0;border-bottom:1px solid #e0e0e0;font-size:.85em}@media(min-width: 768px){.measurement-row{padding:5px 0;font-size:1em}}.measurement-row:last-child{border-bottom:none}.measurement-label{color:#4b5563;font-size:.9em}.measurement-value{font-weight:600;color:#1f2937}.instructions{background:#eff6ff;border-left:4px solid #3b82f6;padding:12px;border-radius:8px;margin-top:15px;font-size:.9em}@media(min-width: 768px){.instructions{padding:15px;margin-top:20px;font-size:1em}}.instructions h2{color:#3b82f6;margin-bottom:8px;font-size:1em}@media(min-width: 768px){.instructions h2{margin-bottom:10px;font-size:1.1em}}.instructions ol{margin-left:18px}@media(min-width: 768px){.instructions ol{margin-left:20px}}.instructions li{margin:4px 0;color:#1f2937}@media(min-width: 768px){.instructions li{margin:5px 0}}footer{background:#fff;padding:25px 15px;margin-top:20px;border-top:1px solid #e0e0e0}@media(min-width: 768px){footer{padding:40px 30px;margin-top:30px}}footer .footer-content{max-width:1200px;margin:0 auto}footer nav{display:grid;grid-template-columns:1fr;gap:20px;margin-bottom:25px}@media(min-width: 768px){footer nav{grid-template-columns:repeat(auto-fit, minmax(250px, 1fr));gap:30px;margin-bottom:30px}}footer h2{color:#1d4ed8;margin-bottom:12px;font-size:1em}@media(min-width: 768px){footer h2{font-size:1.1em;margin-bottom:15px}}footer p{color:#4b5563;line-height:1.6;font-size:.9em}@media(min-width: 768px){footer p{font-size:.95em}}footer ul{color:#4b5563;line-height:1.8;font-size:.9em;list-style-position:inside;padding-left:0}@media(min-width: 768px){footer ul{font-size:.95em}}footer .footer-copyright{text-align:center;padding-top:20px;border-top:1px solid #e0e0e0;color:#6b7280;font-size:.85em}footer .footer-copyright p{color:#6b7280;margin-bottom:8px}@media(min-width: 768px){footer .footer-copyright p{font-size:.9em}}footer .footer-copyright strong{color:#1d4ed8}/*# sourceMappingURL=styles.css.map */
