:root { --sy-navy:#03172f; --sy-deep:#061f3f; --sy-teal:#18b9b4; --sy-gold:#efb84d; --sy-paper:#f4ecda; }
.shipyard-page { min-height: 100vh; background: var(--sy-navy); color: #fff; }
.shipyard-page button,.shipyard-page input { font: inherit; }
.shipyard-intro { min-height: calc(100svh - 86px); padding: clamp(38px,6vw,90px); position:relative; overflow:hidden; display:grid; grid-template-columns:.82fr 1.18fr; align-items:center; background:radial-gradient(circle at 78% 28%,rgba(20,198,190,.22),transparent 30%),linear-gradient(145deg,#020e22,#083969 65%,#087f8d); isolation:isolate; }
.intro-grid-lines { position:absolute; inset:0; z-index:-1; opacity:.13; background-image:linear-gradient(rgba(255,255,255,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.12) 1px,transparent 1px); background-size:72px 72px; mask-image:linear-gradient(90deg,#000,transparent 75%); }
.intro-crane { position:absolute; z-index:-1; top:6%; right:5%; width:36%; height:54%; opacity:.12; border-left:12px solid #fff; border-top:12px solid #fff; transform:skewY(-6deg); }
.intro-crane i { position:absolute; left:-90px; top:-12px; width:90px; border-top:12px solid #fff; }
.intro-crane b { position:absolute; left:72%; top:0; width:2px; height:52%; background:#fff; }
.shipyard-intro-copy { max-width:680px; position:relative; z-index:3; }
.shipyard-intro-copy>p { display:flex; align-items:center; gap:13px; color:#77e8e0; font-size:10px; font-weight:900; letter-spacing:.22em; }
.shipyard-intro-copy>p span { width:42px; height:1px; background:currentColor; }
.shipyard-intro h1 { margin:18px 0; font-family:Georgia,serif; font-size:clamp(62px,7vw,114px); font-weight:500; line-height:.85; letter-spacing:-.065em; }
.shipyard-intro h1 em { color:var(--sy-gold); font-style:italic; }
.shipyard-intro h2 { max-width:560px; color:rgba(255,255,255,.74); font-size:clamp(17px,1.7vw,24px); line-height:1.45; font-weight:500; }
.intro-actions { margin-top:34px; display:flex; flex-wrap:wrap; gap:12px; }
.intro-actions button { min-height:58px; padding:0 25px; border:1px solid var(--sy-gold); border-radius:99px; background:linear-gradient(135deg,#f3c866,#c88c29); color:#09203a; cursor:pointer; font-size:11px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; box-shadow:0 18px 40px rgba(0,0,0,.26); }
.intro-actions button span { margin-left:18px; font-size:18px; }
.intro-actions .draft-button { border-color:rgba(255,255,255,.35); background:rgba(255,255,255,.08); color:#fff; box-shadow:none; }
.shipyard-intro-copy>small { display:block; margin-top:18px; color:rgba(255,255,255,.42); font-size:10px; }
.intro-ship { min-width:0; position:relative; z-index:2; filter:drop-shadow(0 28px 28px rgba(0,0,0,.24)); }
.intro-ship .ship-preview { border:1px solid rgba(255,255,255,.16); border-radius:50% 50% 6px 6px/28% 28% 6px 6px; }
.intro-ship>span { position:absolute; right:3%; bottom:-24px; color:rgba(255,255,255,.45); font-size:8px; font-weight:900; letter-spacing:.17em; }

.ship-builder { min-height:100svh; position:relative; overflow:hidden; background:linear-gradient(180deg,#061d39,#04142a); }
.builder-header { min-height:72px; padding:0 clamp(18px,3vw,46px); display:grid; grid-template-columns:1fr auto auto; gap:12px; align-items:center; border-bottom:1px solid rgba(255,255,255,.12); background:#03152c; }
.builder-header>div:first-child { display:flex; align-items:center; gap:11px; }
.builder-header>div:first-child>span { width:38px; height:38px; display:grid; place-items:center; border:1px solid var(--sy-gold); border-radius:50%; color:var(--sy-gold); font-family:Georgia,serif; font-size:13px; }
.builder-header p { margin:0; line-height:1; }
.builder-header small,.builder-header strong { display:block; font-size:8px; letter-spacing:.17em; }
.builder-header strong { margin-top:5px; color:var(--sy-gold); font-size:12px; }
.builder-header>button { min-height:38px; padding:0 15px; border:1px solid rgba(255,255,255,.18); border-radius:99px; background:rgba(255,255,255,.04); color:rgba(255,255,255,.7); cursor:pointer; font-size:9px; font-weight:800; letter-spacing:.06em; }
.builder-header>button i { margin-right:7px; color:var(--sy-teal); font-style:normal; }
.mobile-step { display:none; }
.builder-progress { min-height:66px; padding:0 clamp(18px,3vw,46px); display:grid; grid-template-columns:repeat(11,1fr); background:#082443; border-bottom:1px solid rgba(255,255,255,.09); }
.builder-progress button { min-width:0; padding:10px 4px; position:relative; border:0; border-right:1px solid rgba(255,255,255,.08); background:transparent; color:rgba(255,255,255,.34); cursor:pointer; text-align:left; }
.builder-progress button:first-child { border-left:1px solid rgba(255,255,255,.08); }
.builder-progress button::after { content:""; position:absolute; left:0; right:100%; bottom:0; height:3px; background:var(--sy-gold); transition:right .3s ease; }
.builder-progress button[aria-current="step"] { color:#fff; background:rgba(255,255,255,.06); }
.builder-progress button[aria-current="step"]::after { right:0; }
.builder-progress span,.builder-progress strong { display:block; }
.builder-progress span { color:var(--sy-gold); font-size:8px; }
.builder-progress strong { margin-top:6px; overflow:hidden; font-size:8px; letter-spacing:.09em; text-overflow:ellipsis; }
.builder-workspace { min-height:calc(100svh - 138px); display:grid; grid-template-columns:minmax(0,1.6fr) minmax(390px,.74fr); }
.preview-column { min-width:0; position:relative; display:grid; place-items:center; padding:clamp(20px,3vw,44px); background:radial-gradient(circle at 50% 42%,rgba(39,184,184,.13),transparent 42%),#041a35; }
.preview-column::after { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px); background-size:50px 50px; }
.preview-caption { width:calc(100% - 70px); position:absolute; z-index:5; left:35px; bottom:22px; display:flex; justify-content:space-between; align-items:end; color:rgba(255,255,255,.5); font-size:9px; letter-spacing:.06em; }
.preview-caption p { margin:0; }.preview-caption p span { margin-right:12px; color:var(--sy-teal); font-weight:900; }.preview-caption strong { color:#fff; font-family:Georgia,serif; font-size:18px; font-weight:500; }
.ship-preview { width:100%; aspect-ratio:16/9; position:relative; overflow:hidden; background:linear-gradient(180deg,#72d2d3 0%,#b8ddd1 48%,#3f9cae 49%,#0b5d80 100%); isolation:isolate; }
.sky-glow { position:absolute; inset:0; background:radial-gradient(circle at 77% 18%,rgba(255,235,164,.9) 0 4%,rgba(255,235,164,.18) 5% 15%,transparent 28%); }
.shipyard-sun { position:absolute; top:9%; right:17%; width:9%; aspect-ratio:1; border-radius:50%; background:#ffe7a2; box-shadow:0 0 50px rgba(255,225,135,.55); }
.distant-city { position:absolute; inset:auto 0 43% 0; height:16%; display:flex; align-items:end; opacity:.32; }
.distant-city i { width:18%; height:55%; border-radius:6px 6px 0 0; background:#245e72; }.distant-city i:nth-child(2){height:85%}.distant-city i:nth-child(3){height:42%}.distant-city i:nth-child(4){height:72%}.distant-city i:nth-child(5){height:33%}.distant-city i:nth-child(6){height:61%}
.ship-motion-wrapper { position:absolute; z-index:4; inset:4% 0 0; animation:ship-float 6.4s ease-in-out infinite; transform-origin:50% 72%; transition:transform 2.2s cubic-bezier(.2,.7,.2,1),opacity 1s ease; }
.ship-svg { width:100%; height:100%; overflow:visible; filter:drop-shadow(0 18px 13px rgba(0,21,43,.25)); }
.layer { transform-box:fill-box; transform-origin:center; }.sail-shape { animation:sail-breathe 5s ease-in-out infinite; transform-origin:right center; }.sail-right { animation-delay:-2s; transform-origin:left center; }.flag-layer .flag { animation:flag-wave 1.8s ease-in-out infinite; transform-origin:left center; }.smoke circle { animation:smoke-rise 3s ease-out infinite; }.smoke circle+circle { animation-delay:-1.4s; }
.painted-name { position:absolute; left:43%; top:70%; z-index:7; transform:translate(-50%,-50%) rotate(2deg); color:#fff; font-family:Georgia,serif; font-size:clamp(9px,1.2vw,20px); letter-spacing:.09em; text-shadow:0 1px 3px #00172f; white-space:nowrap; }
.preview-emblem { position:absolute; z-index:8; left:33%; top:69%; transform:translate(-50%,-50%); }
.ship-emblem { width:118px; aspect-ratio:1; position:relative; display:grid; place-items:center; border:8px double #d5a743; border-radius:50%; background:radial-gradient(circle,#f7edcd 0 46%,#0b345c 47% 64%,#f0b847 65% 70%,#082947 71%); color:#0a2b5b; box-shadow:0 10px 25px rgba(0,0,0,.25); }
.ship-emblem b { font-size:48px; font-weight:500; }.ship-emblem i { position:absolute; right:15px; bottom:13px; width:33px; height:33px; display:grid; place-items:center; border-radius:50%; background:#ed3e3a; color:#fff; font-size:20px; font-style:normal; }.ship-emblem-compact { width:clamp(20px,2.8vw,42px); border-width:3px; }.ship-emblem-compact b { font-size:clamp(10px,1.4vw,20px); }.ship-emblem-compact i { right:0; bottom:-2px; width:42%; font-size:clamp(7px,.9vw,12px); }
.crew-on-deck { position:absolute; z-index:8; inset:0; pointer-events:none; }.crew-person { position:absolute; width:3.5%; aspect-ratio:.72; border-radius:50% 50% 22% 22%; background:linear-gradient(90deg,#e8c392 0 35%,#f2d3a6 36% 64%,#bd875c 65%); border:2px solid rgba(4,31,59,.65); box-shadow:0 5px 5px rgba(0,0,0,.18); }.crew-person::after { content:""; position:absolute; left:-28%; right:-28%; top:36%; bottom:0; border-radius:40% 40% 13% 13%; background:#f0efe4; border:2px solid #0a2b5b; }.crew-person i { position:absolute; z-index:2; left:50%; top:54%; transform:translateX(-50%); color:#0a2b5b; font-size:clamp(6px,.8vw,11px); font-style:normal; }.crew-slot-1{left:45%;top:51%}.crew-slot-2{left:51%;top:49%}.crew-slot-3{left:57%;top:51%}.crew-slot-4{left:63%;top:50%}.crew-slot-5{left:69%;top:51%}
.wave { position:absolute; z-index:2; left:-12%; width:124%; height:12%; border-radius:50%; background:repeating-radial-gradient(ellipse at 50% 0,rgba(255,255,255,.28) 0 2px,transparent 3px 45px); animation:wave-drift 9s linear infinite; }.wave-back{bottom:32%;opacity:.25}.wave-mid{bottom:21%;z-index:5;animation-duration:7s}.wave-front{bottom:-3%;z-index:10;height:20%;background:linear-gradient(180deg,rgba(82,190,202,.65),#075878 58%),repeating-radial-gradient(ellipse at 50% 0,#fff 0 2px,transparent 4px 35px);animation-direction:reverse}.foam { position:absolute; z-index:9; left:12%; right:8%; bottom:15%; height:6%; opacity:.45; background:radial-gradient(ellipse,#fff 0 16%,transparent 17%) 0 0/37px 14px repeat-x; filter:blur(1px); transition:opacity .3s,transform .5s; }.foam-active{opacity:1;transform:scaleX(1.18)}
.gulls { position:absolute; z-index:3; inset:0; }.gulls i { position:absolute; left:-8%; top:20%; color:rgba(7,49,72,.58); font-family:Georgia,serif; font-size:24px; font-style:normal; animation:gull-flight 13s linear infinite; }.gulls i:nth-child(2){top:29%;animation-duration:18s;animation-delay:-6s;font-size:15px}.gulls i:nth-child(3){top:11%;animation-duration:22s;animation-delay:-14s;font-size:10px}
.preview-readout { position:absolute; z-index:12; left:3%; top:4%; padding:11px 14px; border-left:2px solid var(--sy-gold); background:rgba(2,24,47,.45); color:#fff; backdrop-filter:blur(6px); }.preview-readout>*{display:block}.preview-readout span{color:#8eeee7;font-size:7px;letter-spacing:.15em}.preview-readout strong{margin-top:5px;font-family:Georgia,serif;font-size:15px}.preview-readout i{margin-top:3px;color:rgba(255,255,255,.64);font-size:8px;font-style:normal}
.launch-sailing .ship-motion-wrapper { transform:translateX(42%) scale(.72); opacity:.82; }.launch-complete .ship-motion-wrapper{animation:ship-float 6.4s ease-in-out infinite}.launch-launching .wave-front,.launch-sailing .wave-front{animation-duration:2s}
.builder-controls { min-width:0; display:flex; flex-direction:column; background:#f6f0e3; color:#10203a; box-shadow:-20px 0 50px rgba(0,0,0,.2); }
.step-heading { padding:28px 30px 22px; display:grid; grid-template-columns:52px 1fr; gap:18px; align-items:start; border-bottom:1px solid rgba(6,27,60,.14); }
.step-heading>span { width:46px; height:46px; display:grid; place-items:center; border:1px solid #cda041; border-radius:50%; color:#9b6b19; font-family:Georgia,serif; font-size:12px; }
.step-heading small { color:#0a8d8b; font-size:8px; font-weight:900; letter-spacing:.17em; }.step-heading h2 { margin:6px 0 0; color:#0a2b5b; font-family:Georgia,serif; font-size:clamp(23px,2vw,34px); line-height:1.04; font-weight:500; }
.step-content { min-height:0; padding:22px 30px; flex:1; overflow:auto; overscroll-behavior:contain; }
.builder-choice-grid { display:grid; grid-template-columns:1fr; gap:9px; }.builder-choice-grid.compact { grid-template-columns:repeat(2,minmax(0,1fr)); }
.builder-choice { min-height:76px; padding:12px 38px 12px 13px; position:relative; display:grid; grid-template-columns:42px 1fr; grid-template-rows:auto auto; column-gap:11px; align-items:center; border:1px solid rgba(6,27,60,.13); border-radius:8px; background:#fff; color:#10203a; cursor:pointer; text-align:left; transition:border-color .2s,transform .2s,background .2s; }
.builder-choice:hover,.builder-choice:focus-visible{transform:translateY(-2px);border-color:#0aa8a5}.builder-choice[aria-pressed="true"]{border-color:#0aa8a5;background:#e9f8f4;box-shadow:inset 4px 0 #0aa8a5}.builder-choice>span{grid-row:1/3;width:40px;height:40px;display:grid;place-items:center;border-radius:50%;background:#eef1ed;color:#0a5a79;font-family:Georgia,serif;font-size:21px}.builder-choice strong{align-self:end;color:#0a2b5b;font-size:12px}.builder-choice small{align-self:start;margin-top:4px;color:#6a7380;font-size:9px;line-height:1.35}.builder-choice>i{position:absolute;right:12px;top:50%;transform:translateY(-50%);width:21px;height:21px;display:grid;place-items:center;border:1px solid rgba(6,27,60,.2);border-radius:50%;color:#0aa8a5;font-size:11px;font-style:normal}
.control-label { margin:22px 0 10px; color:#6b7480; font-size:9px; font-weight:900; letter-spacing:.13em; text-transform:uppercase; }.control-label.first{margin-top:0}.color-palette{display:flex;flex-wrap:wrap;gap:12px}.color-palette button{width:46px;height:46px;position:relative;border:4px solid #fff;border-radius:50%;cursor:pointer;box-shadow:0 0 0 1px rgba(6,27,60,.2)}.color-palette button[aria-pressed="true"]{box-shadow:0 0 0 3px #0aa8a5}.color-palette span{position:absolute;left:50%;top:54px;transform:translateX(-50%);display:none;white-space:nowrap;color:#526170;font-size:8px}.color-palette button:focus span,.color-palette button:hover span{display:block}.sail-colors{display:flex;flex-wrap:wrap;gap:8px}.sail-colors button{min-height:40px;padding:0 15px;border:1px solid rgba(6,27,60,.16);border-radius:99px;background:#fff;color:#0a2b5b;cursor:pointer;font-size:10px;font-weight:800}.sail-colors button[aria-pressed="true"]{border-color:#0aa8a5;background:#dff5f1}
.term-note{margin-bottom:15px;padding:12px 14px;display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;border-left:3px solid #f0a91f;background:#fff}.term-note span{color:#0a8d8b;font-size:9px;font-weight:900;letter-spacing:.13em}.term-note p{margin:0;color:#596574;font-size:10px}.term-note a{color:#0a2b5b;font-size:9px;font-weight:800;text-decoration:none}
.emblem-builder{display:grid;grid-template-columns:140px 1fr;gap:22px;align-items:start}.large-emblem{padding-top:8px}.symbol-row{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.symbol-row button{min-height:58px;padding:7px;border:1px solid rgba(6,27,60,.14);border-radius:7px;background:#fff;color:#0a2b5b;cursor:pointer}.symbol-row button[aria-pressed="true"]{border-color:#0aa8a5;background:#e4f6f2}.symbol-row b,.symbol-row span{display:block}.symbol-row b{font-family:Georgia,serif;font-size:20px}.symbol-row span{margin-top:3px;font-size:8px}
.name-studio,.captain-studio{max-width:560px}.name-studio>label,.captain-studio>label{display:block;color:#0a8d8b;font-size:9px;font-weight:900;letter-spacing:.15em}.name-studio>input,.captain-studio input{width:100%;margin-top:9px;padding:17px 2px;border:0;border-bottom:2px solid #b69a64;outline:0;background:transparent;color:#0a2b5b;font-family:Georgia,serif;font-size:clamp(30px,3vw,48px)}.name-studio>input:focus,.captain-studio input:focus{border-color:#0aa8a5}.name-studio>span{display:block;margin-top:7px;color:#7b7f83;font-size:8px;text-align:right}.name-suggestions{margin-top:30px}.name-suggestions small{display:block;margin-bottom:10px;color:#737b83}.name-suggestions button{margin:0 7px 7px 0;padding:9px 12px;border:1px solid rgba(6,27,60,.15);border-radius:99px;background:#fff;color:#0a2b5b;cursor:pointer;font-size:9px}.captain-studio label input{font-size:29px}
.crew-count{margin-bottom:14px;padding:13px;display:flex;align-items:center;gap:13px;border:1px solid rgba(6,27,60,.13);background:#fff}.crew-count>span{width:44px;height:44px;display:grid;place-items:center;border-radius:50%;background:#0a2b5b;color:#fff;font-family:Georgia,serif;font-size:20px}.crew-count p{margin:0}.crew-count strong,.crew-count small{display:block}.crew-count strong{font-size:11px}.crew-count small{margin-top:4px;color:#68727e;font-size:9px}
.builder-controls-footer{min-height:70px;padding:12px 24px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;border-top:1px solid rgba(6,27,60,.14);background:#efe5d2}.builder-controls-footer>button{justify-self:start;min-height:42px;padding:0 14px;border:1px solid rgba(6,27,60,.16);border-radius:99px;background:transparent;color:#0a2b5b;cursor:pointer;font-size:10px;font-weight:900;text-transform:uppercase}.builder-controls-footer>button.next,.builder-controls-footer>.launch-button{justify-self:end;border-color:#0a2b5b;background:#0a2b5b;color:#fff}.builder-controls-footer>.launch-button{padding-inline:18px;background:linear-gradient(135deg,#ddaa43,#a96c1c);border-color:#b67a24;color:#071c31}.launch-button span{margin-left:8px}.builder-controls-footer>span{display:flex;gap:4px}.builder-controls-footer>span i{width:7px;height:7px;border-radius:50%;background:rgba(6,27,60,.17)}.builder-controls-footer>span i.done{background:#0aa8a5}.builder-controls-footer button:disabled{opacity:.35;cursor:not-allowed}
.launch-overlay{position:absolute;z-index:30;inset:138px 0 0;display:grid;place-items:center;background:rgba(2,13,28,.35);backdrop-filter:blur(2px);pointer-events:none}.launch-overlay>div{min-width:min(420px,calc(100% - 36px));padding:27px;border:1px solid rgba(255,255,255,.24);border-radius:8px;background:rgba(3,23,47,.88);box-shadow:0 25px 70px rgba(0,0,0,.4);text-align:center;pointer-events:auto}.launch-overlay small,.launch-overlay strong{display:block}.launch-overlay small{color:#69ded6;font-size:8px;font-weight:900;letter-spacing:.18em}.launch-overlay strong{margin-top:9px;font-family:Georgia,serif;font-size:28px}.launch-overlay>div>span{height:4px;margin:20px 0;display:block;overflow:hidden;border-radius:99px;background:rgba(255,255,255,.12)}.launch-overlay>div>span i{display:block;width:45%;height:100%;background:#f0b74b;animation:launch-progress 1.3s ease-in-out infinite}.launch-overlay button{border:0;background:transparent;color:rgba(255,255,255,.64);cursor:pointer;font-size:9px;text-decoration:underline;text-underline-offset:4px}
.ship-result{min-height:calc(100svh - 80px);padding:clamp(25px,5vw,70px);display:grid;grid-template-columns:minmax(0,1.2fr) minmax(360px,.8fr);gap:clamp(24px,4vw,60px);align-items:center;background:radial-gradient(circle at 15% 30%,rgba(24,185,180,.16),transparent 30%),#03172f}.result-sea{overflow:hidden;border:1px solid rgba(255,255,255,.15);box-shadow:0 35px 80px rgba(0,0,0,.35)}.registry-card{padding:clamp(24px,3vw,42px);position:relative;overflow:hidden;background:#f3ead6;color:#10203a;box-shadow:0 25px 80px rgba(0,0,0,.36)}.registry-card::before{content:"";position:absolute;inset:12px;border:1px double rgba(127,91,30,.42);pointer-events:none}.registry-card header{position:relative;z-index:2;display:grid;grid-template-columns:90px 1fr;gap:18px;align-items:center}.registry-card header .ship-emblem{width:82px;border-width:5px}.registry-card header .ship-emblem b{font-size:34px}.registry-card header small{color:#0a8d8b;font-size:8px;font-weight:900;letter-spacing:.17em}.registry-card h1{margin:5px 0 1px;color:#0a2b5b;font-family:Georgia,serif;font-size:clamp(30px,4vw,52px);line-height:.95;font-weight:500}.registry-card header p{margin:6px 0 0;color:#9a6c20;font-size:10px;font-weight:900;letter-spacing:.12em}.registry-story{margin:25px 0;padding:16px 0;border-block:1px solid rgba(6,27,60,.15);font-family:Georgia,serif;font-size:15px;line-height:1.6}.registry-card dl{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin:0}.registry-card dl div{padding-bottom:9px;border-bottom:1px solid rgba(6,27,60,.12)}.registry-card dt{color:#77808a;font-size:8px;font-weight:900;letter-spacing:.09em;text-transform:uppercase}.registry-card dd{margin:5px 0 0;color:#0a2b5b;font-size:11px;font-weight:800}.registry-note{display:block;margin-top:18px;color:#777;font-size:8px}.result-actions{margin-top:20px;display:flex;flex-wrap:wrap;gap:7px}.result-actions button{min-height:42px;padding:0 14px;border:1px solid #0a2b5b;border-radius:99px;background:#0a2b5b;color:#fff;cursor:pointer;font-size:9px;font-weight:900;text-transform:uppercase}.result-actions button.secondary{background:transparent;color:#0a2b5b}.registry-card nav{margin-top:18px;display:flex;flex-direction:column;gap:5px}.registry-card nav a{padding:10px 0;display:flex;justify-content:space-between;border-bottom:1px solid rgba(6,27,60,.13);color:#0a2b5b;font-size:10px;font-weight:800;text-decoration:none}
@keyframes ship-float{0%,100%{transform:translateY(0) rotate(-.3deg)}50%{transform:translateY(-7px) rotate(.4deg)}}@keyframes sail-breathe{50%{transform:scaleX(.97) rotate(.5deg)}}@keyframes flag-wave{50%{transform:skewY(2deg) scaleX(.94)}}@keyframes smoke-rise{to{transform:translate(35px,-80px) scale(1.4);opacity:0}}@keyframes wave-drift{to{transform:translateX(8%)}}@keyframes gull-flight{to{transform:translateX(125vw) translateY(-25px)}}@keyframes launch-progress{0%{transform:translateX(-100%)}100%{transform:translateX(240%)}}
@media(max-width:1000px){.shipyard-intro{grid-template-columns:1fr;padding:60px 28px}.intro-ship{margin-top:30px}.builder-workspace{grid-template-columns:1fr;grid-template-rows:auto 1fr}.preview-column{position:sticky;top:0;z-index:10;padding:0}.preview-column .ship-preview{max-height:46svh}.preview-caption{display:none}.builder-controls{min-height:48svh;box-shadow:0 -20px 40px rgba(0,0,0,.2)}.step-content{max-height:none}.ship-result{grid-template-columns:1fr}.result-sea{max-width:850px}.builder-progress{display:none}.builder-header{grid-template-columns:1fr auto auto auto}.mobile-step{display:flex;gap:7px;align-items:center}.mobile-step b{font-size:9px}.mobile-step span{color:#64d8d1;font-size:8px;font-weight:900;letter-spacing:.1em}.launch-overlay{inset:72px 0 0}}
@media(max-width:640px){.shipyard-intro{min-height:calc(100svh - 66px);padding:34px 20px 52px;align-content:center}.shipyard-intro h1{font-size:58px}.shipyard-intro h2{font-size:15px}.intro-actions{margin-top:22px}.intro-actions button{width:100%}.builder-header{min-height:62px;padding:0 12px;grid-template-columns:1fr auto auto}.builder-header>div:first-child p{display:none}.builder-header>button{padding:0 10px;font-size:0}.builder-header>button i{margin:0;font-size:12px}.builder-header>button:last-child{font-size:8px}.mobile-step{grid-column:2}.builder-header>button:nth-of-type(1){grid-column:3}.builder-header>button:nth-of-type(2){display:none}.builder-workspace{min-height:calc(100svh - 62px)}.preview-column .ship-preview{height:39svh;aspect-ratio:auto}.builder-controls{min-height:calc(61svh - 62px)}.step-heading{padding:17px 17px 13px;grid-template-columns:39px 1fr;gap:12px}.step-heading>span{width:37px;height:37px}.step-heading h2{font-size:23px}.step-content{padding:16px 17px 20px}.builder-choice-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.builder-choice-grid.compact{grid-template-columns:repeat(2,minmax(0,1fr))}.builder-choice{min-height:94px;padding:10px 25px 10px 9px;display:block}.builder-choice>span{width:32px;height:32px;margin-bottom:7px;font-size:16px}.builder-choice strong,.builder-choice small{display:block}.builder-choice small{font-size:8px}.builder-controls-footer{min-height:62px;padding:8px 12px}.builder-controls-footer>span{display:none}.builder-controls-footer{grid-template-columns:1fr 1fr}.emblem-builder{grid-template-columns:1fr}.large-emblem{display:grid;place-items:center}.symbol-row{grid-template-columns:repeat(3,1fr)}.term-note{grid-template-columns:auto 1fr}.term-note a{grid-column:1/3}.ship-result{padding:18px 12px 40px}.registry-card{padding:28px 23px}.registry-card header{grid-template-columns:65px 1fr}.registry-card header .ship-emblem{width:60px}.registry-card header .ship-emblem b{font-size:25px}.registry-card dl{grid-template-columns:1fr}.launch-overlay{inset:62px 0 0}.gulls i:nth-child(n+2){display:none}}
@media(prefers-reduced-motion:reduce){.ship-motion-wrapper,.sail-shape,.flag-layer .flag,.smoke circle,.wave,.gulls i,.launch-overlay>div>span i{animation:none!important;transition-duration:.01ms!important}.launch-sailing .ship-motion-wrapper{transform:translateX(15%) scale(.9)}}
@media print{body>*{display:none!important}body>.site-intro{display:none!important}.site-header,.site-footer{display:none!important}.shipyard-page{display:block!important}.ship-result{min-height:auto;display:block;background:#fff}.result-sea{display:none}.registry-card{max-width:800px;margin:auto;box-shadow:none}.result-actions,.registry-card nav{display:none}}

/* Tersane Studio 2.0 */
.shipyard-intro{background:radial-gradient(circle at 76% 30%,rgba(25,201,193,.16),transparent 28%),linear-gradient(135deg,#010a17 0%,#061d37 56%,#063f50 100%)}
.shipyard-intro::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(115deg,transparent 0 52%,rgba(255,255,255,.035) 52.1% 52.3%,transparent 52.4%),radial-gradient(ellipse at 55% 100%,rgba(0,0,0,.55),transparent 55%)}
.shipyard-intro h1{letter-spacing:-.055em}.shipyard-intro h2{max-width:620px}.intro-ship .ship-preview{border-radius:3px;border-color:rgba(115,226,218,.3);box-shadow:0 0 0 1px rgba(255,255,255,.04),0 40px 90px rgba(0,0,0,.42)}
.intro-ship .layer-status{display:none}.intro-ship .preview-specs{bottom:5%;left:3%}.intro-ship .preview-readout{top:5%}

.builder-header{min-height:76px;grid-template-columns:1fr auto auto auto;background:linear-gradient(90deg,#020b18,#061b31 65%,#041222);box-shadow:0 12px 45px rgba(0,0,0,.22);position:relative;z-index:40}
.builder-header>div:first-child>span{border-radius:2px;transform:rotate(45deg)}.builder-header>div:first-child>span::first-letter{transform:rotate(-45deg)}
.builder-header strong{font-size:11px;letter-spacing:.13em}.studio-version{padding:0 22px;border-inline:1px solid rgba(255,255,255,.1);text-align:right}.studio-version span,.studio-version b{display:block}.studio-version span{color:rgba(255,255,255,.38);font-size:7px;letter-spacing:.18em}.studio-version b{margin-top:5px;color:#74e1d9;font-size:8px;letter-spacing:.13em}
.builder-progress{min-height:62px;background:linear-gradient(180deg,#09243d,#071c31)}.builder-progress button{padding-inline:8px}.builder-progress button[aria-current="step"]{background:linear-gradient(180deg,rgba(23,190,181,.14),rgba(23,190,181,.04));box-shadow:inset 0 0 22px rgba(31,211,201,.08)}
.builder-workspace{min-height:calc(100svh - 138px);grid-template-columns:minmax(0,1.72fr) minmax(410px,.68fr)}
.preview-column{padding:clamp(54px,5vw,82px) clamp(25px,3.5vw,56px) 58px;background:radial-gradient(circle at 46% 40%,rgba(21,174,174,.13),transparent 38%),linear-gradient(135deg,#020b17,#061b31 65%,#041425)}
.preview-column::before{content:"GEMİ TASARIM MATRİSİ / 1600 × 900";position:absolute;left:26px;top:23px;color:rgba(128,224,218,.38);font-size:7px;font-weight:800;letter-spacing:.19em}
.preview-column::after{background:linear-gradient(90deg,rgba(94,211,204,.04) 1px,transparent 1px),linear-gradient(rgba(94,211,204,.04) 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(90deg,#000,transparent 92%)}
.preview-toolbar{position:absolute;z-index:25;right:clamp(25px,3.5vw,56px);top:17px;display:flex;border:1px solid rgba(118,224,217,.2);background:rgba(2,15,29,.65);backdrop-filter:blur(14px)}
.preview-toolbar button{min-width:82px;min-height:36px;padding:0 12px;border:0;border-right:1px solid rgba(118,224,217,.12);background:transparent;color:rgba(255,255,255,.46);cursor:pointer;font-size:8px;font-weight:900;letter-spacing:.1em;text-transform:uppercase}.preview-toolbar button:last-child{border:0}.preview-toolbar button span{margin-right:8px;color:#68d9d1;font-size:12px}.preview-toolbar button[aria-pressed="true"]{background:rgba(24,185,180,.17);color:#fff;box-shadow:inset 0 -2px #efb84d}

.ship-preview{border:1px solid rgba(100,218,211,.2);border-radius:2px;background:linear-gradient(180deg,#83ccd0 0%,#c7ddd0 48%,#3c94a9 49%,#07506f 100%);box-shadow:0 32px 75px rgba(0,0,0,.38);transition:background .45s ease}
.ship-preview::after{content:"";position:absolute;inset:0;z-index:20;pointer-events:none;border:1px solid rgba(255,255,255,.08);box-shadow:inset 0 0 90px rgba(0,16,31,.28)}
.technical-grid{position:absolute;z-index:1;inset:0;opacity:0;background-image:linear-gradient(rgba(94,226,217,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(94,226,217,.09) 1px,transparent 1px),linear-gradient(rgba(94,226,217,.17) 1px,transparent 1px),linear-gradient(90deg,rgba(94,226,217,.17) 1px,transparent 1px);background-size:25px 25px,25px 25px,100px 100px,100px 100px;transition:opacity .35s ease}
.ship-motion-wrapper{inset:0;z-index:6}.ship-svg{filter:drop-shadow(0 22px 18px rgba(0,16,31,.34));transition:transform .45s ease,filter .35s ease}.detail-layer{transition:opacity .28s ease,filter .28s ease}.dimension-layer{opacity:0;transition:opacity .35s ease}
.mode-technical{background:radial-gradient(circle at 63% 34%,#0e4560,#031524 68%)}.mode-technical .technical-grid,.mode-technical .dimension-layer{opacity:1}.mode-technical .sky-glow,.mode-technical .shipyard-sun,.mode-technical .distant-city,.mode-technical .gulls,.mode-technical .wave,.mode-technical .foam{opacity:.06}.mode-technical .detail-layer{opacity:.28}.mode-technical .ship-motion-wrapper{animation:none}.mode-technical .ship-svg{filter:drop-shadow(0 0 14px rgba(85,225,216,.25))}
.mode-detail .ship-svg{transform:scale(1.14) translate(-1.5%,-1.2%)}.mode-detail .preview-specs{transform:translateY(115%);opacity:0}.mode-detail .layer-status{right:2.5%;bottom:4%}
.focus-architecture [data-layer="architecture"],.focus-hull [data-layer="hull"],.focus-bow [data-layer="bow"],.focus-superstructure [data-layer="superstructure"],.focus-rigging [data-layer="rigging"],.focus-flag [data-layer="flag"],.focus-emblem [data-layer="emblem"],.focus-name [data-layer="name"],.focus-bridge [data-layer="bridge"],.focus-systems [data-layer="systems"],.focus-crew [data-layer="crew"]{opacity:1;filter:drop-shadow(0 0 10px rgba(239,184,77,.8))}
.mode-sailing .focus-marker{display:none}.lifeboat{transform-origin:center;animation:equipment-sway 7s ease-in-out infinite}
.preview-readout{top:3%;left:2.5%;padding:10px 13px;border-left:2px solid #efb84d;background:rgba(1,15,29,.58);box-shadow:0 12px 35px rgba(0,0,0,.2)}.preview-readout span{font-size:6px}.preview-readout strong{font-size:14px}.preview-readout i{font-size:7px;letter-spacing:.08em}
.preview-specs{position:absolute;z-index:15;left:2.5%;bottom:4%;display:grid;grid-template-columns:repeat(4,auto);gap:0;border:1px solid rgba(128,225,218,.22);background:rgba(2,21,38,.7);color:#fff;backdrop-filter:blur(10px);transition:opacity .3s,transform .3s}.preview-specs span{min-width:77px;padding:8px 10px;border-right:1px solid rgba(128,225,218,.15)}.preview-specs span:last-child{border:0}.preview-specs small,.preview-specs b{display:block}.preview-specs small{color:#69d7cf;font-size:5px;font-weight:900;letter-spacing:.12em}.preview-specs b{margin-top:4px;font-family:Georgia,serif;font-size:11px;font-weight:500}
.layer-status{position:absolute;z-index:15;right:2.5%;bottom:4%;padding:9px 12px;border-right:2px solid #efb84d;background:rgba(2,21,38,.7);color:#fff;text-align:right;backdrop-filter:blur(10px)}.layer-status span,.layer-status strong,.layer-status i{display:block}.layer-status span{color:rgba(255,255,255,.4);font-size:5px;letter-spacing:.16em}.layer-status strong{margin-top:4px;font-size:8px;letter-spacing:.11em}.layer-status i{margin-top:4px;color:#68ddd5;font-size:5px;font-style:normal;letter-spacing:.1em}
.preview-caption{bottom:17px;color:rgba(255,255,255,.42)}.preview-caption strong{font-size:17px}.preview-caption p span{color:#6fe0d7}

.builder-controls{background:#071827;color:#dce8e5;box-shadow:-25px 0 70px rgba(0,0,0,.38);border-left:1px solid rgba(114,220,213,.14)}
.step-heading{padding:26px 28px 21px;border-color:rgba(118,224,217,.14);background:linear-gradient(135deg,#0a2137,#08192b)}.step-heading>span{border-radius:2px;border-color:rgba(239,184,77,.62);color:#efb84d;background:rgba(239,184,77,.06)}.step-heading small{color:#65d7cf}.step-heading h2{color:#f2ecdc;font-size:clamp(22px,1.7vw,31px)}
.step-content{padding:20px 28px;background:radial-gradient(circle at 100% 0,rgba(24,185,180,.07),transparent 30%),#071827}.builder-choice-grid{gap:8px}
.builder-choice{min-height:74px;border-color:rgba(119,216,210,.14);border-radius:2px;background:linear-gradient(135deg,#0c243a,#091d31);color:#dce8e5;box-shadow:0 8px 20px rgba(0,0,0,.12)}.builder-choice:hover,.builder-choice:focus-visible{border-color:#34c7bf;background:#0d2a42}.builder-choice[aria-pressed="true"]{border-color:#28beb6;background:linear-gradient(135deg,rgba(19,165,157,.26),#0b283e);box-shadow:inset 3px 0 #efb84d,0 0 20px rgba(24,185,180,.08)}.builder-choice>span{border-radius:2px;background:#102e47;color:#73ddd5;border:1px solid rgba(115,221,213,.14)}.builder-choice strong{color:#f2ecdc;font-size:11px;letter-spacing:.02em}.builder-choice small{color:#8fa5ad}.builder-choice>i{border-color:rgba(115,221,213,.26);color:#69d9d1}
.control-label{color:#7f9aa4}.color-palette button{border-color:#0a1e31;box-shadow:0 0 0 1px rgba(119,216,210,.25)}.color-palette button[aria-pressed="true"]{box-shadow:0 0 0 3px #2ac0b8,0 0 20px rgba(42,192,184,.25)}.color-palette span{color:#a6b8bd}.sail-colors button{border-color:rgba(119,216,210,.18);border-radius:2px;background:#0c243a;color:#dce8e5}.sail-colors button[aria-pressed="true"]{border-color:#2ac0b8;background:#123c4b;color:#fff}
.term-note{border-left-color:#efb84d;background:#0c243a}.term-note span{color:#69d9d1}.term-note p{color:#9eb1b8}.term-note a{color:#efb84d}.symbol-row button{border-color:rgba(119,216,210,.15);border-radius:2px;background:#0c243a;color:#f0e8d7}.symbol-row button[aria-pressed="true"]{border-color:#2ac0b8;background:#123c4b}.name-studio>label,.captain-studio>label{color:#6edbd3}.name-studio>input,.captain-studio input{border-color:#876d37;color:#f2ecdc}.name-suggestions small{color:#8ca1a9}.name-suggestions button{border-color:rgba(119,216,210,.16);border-radius:2px;background:#0c243a;color:#dce8e5}.crew-count{border-color:rgba(119,216,210,.14);background:#0c243a}.crew-count>span{border-radius:2px;background:#123c4b}.crew-count small{color:#8fa6ae}
.builder-controls-footer{background:#051321;border-color:rgba(118,224,217,.14)}.builder-controls-footer>button{border-radius:2px;border-color:rgba(118,224,217,.22);color:#cddbd9}.builder-controls-footer>button.next{border-color:#1db4ad;background:#0f817d}.builder-controls-footer>.launch-button{border-color:#dca946;background:linear-gradient(135deg,#efc461,#b87a20);color:#06172a;box-shadow:0 10px 25px rgba(0,0,0,.25)}.builder-controls-footer>span i{border-radius:1px;background:rgba(118,224,217,.15)}
.launch-overlay{background:rgba(1,9,18,.64);backdrop-filter:blur(5px)}.launch-overlay>div{border-radius:2px;border-color:rgba(111,223,215,.28);background:linear-gradient(145deg,rgba(4,22,39,.97),rgba(7,45,58,.95))}.launch-overlay>div::before{content:"";display:block;width:42px;height:2px;margin:0 auto 18px;background:#efb84d}.launch-overlay p{margin:-8px 0 18px;color:rgba(255,255,255,.46);font-size:8px;letter-spacing:.12em;text-transform:uppercase}
.registry-card dl{grid-template-columns:repeat(2,1fr)}
@keyframes equipment-sway{50%{transform:translateY(-2px) rotate(.4deg)}}

@media(max-width:1000px){.studio-version{display:none}.builder-header{grid-template-columns:1fr auto auto auto}.builder-workspace{grid-template-rows:auto 1fr}.preview-column{padding:47px 0 0}.preview-column::before{left:13px;top:14px}.preview-toolbar{right:8px;top:8px}.preview-toolbar button{min-width:66px;min-height:31px;padding:0 7px}.preview-column .ship-preview{height:43svh;max-height:none;border-inline:0}.preview-caption{display:none}.builder-controls{min-height:49svh}.step-content{background:#071827}.launch-overlay{inset:76px 0 0}}
@media(max-width:640px){.builder-header{min-height:62px}.builder-workspace{min-height:calc(100svh - 62px)}.preview-column{padding-top:40px}.preview-column::before{font-size:5px}.preview-toolbar button{min-width:54px;font-size:6px}.preview-toolbar button span{margin-right:4px;font-size:9px}.preview-column .ship-preview{height:36svh}.preview-specs{left:1.8%;bottom:2.5%;grid-template-columns:repeat(2,auto)}.preview-specs span{min-width:60px;padding:5px 7px}.preview-specs span:nth-child(2){border-right:0}.preview-specs span:nth-child(-n+2){border-bottom:1px solid rgba(128,225,218,.15)}.layer-status{right:1.8%;bottom:2.5%;padding:7px}.preview-readout{left:1.8%;top:2.5%;padding:7px 8px}.preview-readout strong{font-size:11px}.preview-readout i{display:none}.builder-controls{min-height:calc(64svh - 62px)}.step-heading{padding:15px 15px 12px}.step-content{padding:14px 15px 18px}.builder-choice{min-height:96px}.builder-choice small{color:#91a8af}.registry-card dl{grid-template-columns:1fr}.mode-detail .ship-svg{transform:scale(1.22) translate(-2%,-2%)}.launch-overlay{inset:62px 0 0}}
@media(prefers-reduced-motion:reduce){.lifeboat{animation:none!important}}

/* Mobil canlı önizleme: Studio 2.0 masaüstü kolon kuralını kesin olarak sıfırlar. */
@media(max-width:1000px){
  .builder-workspace{
    width:100%;
    min-width:0;
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:auto auto;
  }
  .preview-column{
    width:100%;
    min-width:0;
    position:sticky;
    top:78px;
    z-index:30;
  }
  .builder-controls{
    width:100%;
    min-width:0;
  }
}

@media(max-width:640px){
  .preview-column{
    padding:38px 0 0;
    border-bottom:1px solid rgba(111,223,215,.24);
    box-shadow:0 18px 42px rgba(0,0,0,.38);
  }
  .preview-column .ship-preview{
    width:100%;
    height:auto;
    max-height:none;
    aspect-ratio:16/9;
  }
  .preview-column::before{
    top:13px;
  }
  .preview-toolbar{
    top:5px;
  }
  .builder-controls{
    min-height:auto;
  }
}