:root{color-scheme:dark;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.5}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100vh;background:#1a1a2e;color:#fafafa;overflow-x:hidden}.app{min-height:100vh;display:flex;flex-direction:column;align-items:center;padding:1.5rem}.header{text-align:center;margin-bottom:1.5rem}.header h1{font-size:2rem;font-weight:700;letter-spacing:-.03em;margin:0;background:linear-gradient(135deg,#f59e0b,#ef4444);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.header p{color:#ffffff80;font-size:.85rem;margin-top:.25rem}.workspace{display:flex;gap:1.5rem;width:100%;max-width:1100px;flex-wrap:wrap;justify-content:center}.canvas-area{flex:1;min-width:600px;max-width:750px}.controls-panel{width:280px;display:flex;flex-direction:column;gap:1rem}.card{background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:.75rem;padding:1.25rem}.card-title{font-size:.7rem;text-transform:uppercase;letter-spacing:.15em;color:#fff6;margin-bottom:1rem;font-weight:600}.plane-canvas{width:100%;height:400px;border-radius:.5rem;cursor:crosshair;background:#0d0d1a;border:1px solid rgba(255,255,255,.06);display:block}.slider-group{margin-bottom:1rem}.slider-group:last-child{margin-bottom:0}.slider-label{display:flex;justify-content:space-between;align-items:center;margin-bottom:.4rem}.slider-label span:first-child{font-size:.85rem;color:#ffffffbf}.slider-value{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.8rem;color:#f59e0b;background:#f59e0b1a;padding:.15rem .45rem;border-radius:.25rem}input[type=range]{width:100%;height:6px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#ffffff14;border-radius:3px;outline:none}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:#f59e0b;cursor:pointer;border:2px solid #1a1a2e;box-shadow:0 0 6px #f59e0b66}.stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.stat-item{text-align:center;padding:.6rem;background:#ffffff08;border-radius:.5rem}.stat-value{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:1.1rem;font-weight:700;color:#10b981}.stat-label{font-size:.65rem;color:#fff6;text-transform:uppercase;letter-spacing:.1em;margin-top:.15rem}.btn{width:100%;padding:.7rem;border:1px solid rgba(255,255,255,.12);border-radius:.5rem;background:#ffffff0d;color:#fafafa;font-size:.85rem;font-weight:500;cursor:pointer;transition:all .15s}.btn:hover{background:#ffffff1a;border-color:#fff3}.btn-primary{background:linear-gradient(135deg,#f59e0b,#d97706);border-color:transparent;color:#000;font-weight:600}.btn-primary:hover{background:linear-gradient(135deg,#fbbf24,#f59e0b)}.btn-group{display:flex;gap:.5rem}.btn-group .btn{flex:1}.power-indicator{display:flex;align-items:center;gap:.5rem;margin-bottom:1rem}.power-dot{width:10px;height:10px;border-radius:50%;background:#ef4444;box-shadow:0 0 8px #ef444480;transition:all .3s}.power-dot.on{background:#10b981;box-shadow:0 0 8px #10b98199}.power-text{font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em}.wood-select{display:flex;gap:.4rem;flex-wrap:wrap}.wood-option{flex:1;min-width:70px;padding:.45rem .5rem;border:1px solid rgba(255,255,255,.1);border-radius:.35rem;background:#ffffff08;color:#fff9;font-size:.75rem;cursor:pointer;text-align:center;transition:all .15s}.wood-option:hover{border-color:#fff3}.wood-option.active{border-color:#f59e0b;background:#f59e0b1a;color:#f59e0b}.instructions{text-align:center;padding:.6rem;background:#f59e0b14;border:1px solid rgba(245,158,11,.15);border-radius:.5rem;margin-bottom:1rem}.instructions p{margin:0;font-size:.8rem;color:#fff9}.depth-display{text-align:center;margin-top:.5rem}.depth-number{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:2.5rem;font-weight:700;color:#f59e0b;line-height:1}.depth-unit{font-size:.8rem;color:#fff6;margin-top:.15rem}@media(max-width:900px){.canvas-area{min-width:100%}.controls-panel{width:100%;flex-direction:row;flex-wrap:wrap}.controls-panel .card{flex:1;min-width:240px}}
