:root{
    --ink:#232323;--ink-soft:#767676;--line:#e6e6e6;--surface:#fff;--bg:#f7f7f7;
    --accent:#04a9fc;--accent-ink:#0284c7;--good:#0a8f5b;--good-bg:#e6f6ee;
    --red:#c0304a;--amber:#b8860b;--warn:#b25e00;--warn-bg:#fff3e0;--radius:14px;
    --shadow:0 1px 2px rgba(15,34,51,.06),0 8px 24px rgba(15,34,51,.07);
    --font-ui:"Sora",Arial,Helvetica,sans-serif;
  }
  *{box-sizing:border-box} html,body{margin:0}
  body{font-family:var(--font-ui);color:var(--ink);background:var(--bg);line-height:1.5;-webkit-font-smoothing:antialiased}
  .wrap{max-width:1560px;margin:0 auto;padding:24px 20px 90px}
  header.masthead h1{font-size:clamp(24px,3.2vw,40px);font-weight:800;letter-spacing:-.02em;margin:2px 0 0}
  header.masthead .eyebrow{font-size:13px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--accent-ink)}
  header.masthead p{margin:6px 0 0;color:var(--ink-soft);font-size:15px}
  .flag{display:inline-flex;gap:6px;align-items:center;margin-top:12px;background:var(--warn-bg);color:var(--warn);border:1px solid #ffe0b2;border-radius:999px;padding:6px 12px;font-size:12.5px;font-weight:600}

  .grid{display:grid;grid-template-columns:minmax(0,1fr) 306px;grid-template-areas:"steps cart" "design cart";column-gap:20px;row-gap:16px;align-items:start;margin-top:22px}
  #steps{grid-area:steps} .rcol{grid-area:cart}
  .rcol-preview{max-width:158px;margin:0 auto 12px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:8px}
  .rcol-preview canvas{filter:contrast(1.16) saturate(1.05)} #resultArea{grid-area:design;margin:0}
  @media (max-width:960px){.grid{grid-template-columns:1fr;grid-template-areas:"steps" "design" "cart"}}
  .s1inner{display:inline-block}
  .rcol{display:flex;flex-direction:column;gap:18px}
  .card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
  .card h2{font-size:13px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--ink-soft);margin:0;padding:16px 18px 0;display:flex;align-items:center;gap:10px}
  .card .body{padding:16px 18px 18px}

  #steps{display:flex;flex-direction:column;gap:16px}
  .step{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px 18px;position:relative}
  #resultArea{position:relative}
  .step.hidden{display:none}
  .step.in{animation:slidein .28s ease}
  @keyframes slidein{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
  .sthd{display:flex;align-items:center;gap:12px;font-weight:600;font-size:14px}
  .sno{width:28px;height:28px;border-radius:50%;background:var(--accent);color:#fff;display:grid;place-items:center;font-size:15px;flex:0 0 auto}
  .sthd .stock{font-size:12.5px;font-weight:700}
  .palwrap{display:inline-block}
  .stockline{text-align:right;min-height:17px;margin-bottom:5px}
  .stock.inn{color:var(--good)} .stock.ut{color:var(--red)} .stock.best{color:var(--amber)}
  .sbody{margin-top:8px}

  select{width:100%;max-width:280px;font:inherit;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:10px;padding:11px 12px}
  input[type=text]{width:100%;font:inherit;border:1px solid var(--line);border-radius:10px;padding:10px 12px}
  label.lbl{display:block;font-size:13px;font-weight:600;margin-bottom:7px}
  select:focus,button:focus-visible,.swatch:focus-visible,input:focus{outline:3px solid rgba(0,105,180,.35);outline-offset:1px}
  .row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}

  .palette{display:flex;flex-wrap:wrap;gap:6px}
  .swatch{flex:0 0 auto;width:30px;height:30px;border-radius:7px;border:1px solid rgba(0,0,0,.15);cursor:pointer;padding:0;transition:transform .12s ease}
  .swatch:hover{transform:scale(1.22);box-shadow:0 2px 8px rgba(0,0,0,.25);position:relative;z-index:2}
  .swatch[aria-pressed="true"]{box-shadow:0 0 0 2px #fff,0 0 0 3px var(--accent)}

  button{font:inherit;cursor:pointer;border-radius:10px;border:1px solid transparent}
  .btn-primary{background:var(--accent);color:#fff;min-height:42px;padding:5px 20px;border-radius:5px;font-size:13px;line-height:15.6px;text-transform:uppercase;font-weight:600;letter-spacing:normal}
  .btn-primary:hover{background:var(--accent-ink)} .btn-primary:disabled{background:#c3c6d6;cursor:not-allowed}
  .btn-go{background:var(--good)} .btn-go:hover{background:#097a4d}
  .btn-ghost{background:#fff;border-color:var(--line);color:var(--ink);min-height:42px;padding:5px 20px;border-radius:5px;font-size:13px;line-height:15.6px;text-transform:uppercase;font-weight:600;letter-spacing:normal}
  .btn-ghost:hover{border-color:#b9c6d6} .btn-ghost.on{border-color:var(--accent);color:var(--accent-ink);background:#eaf3fb}
  .btn-mini{background:transparent;border:0;color:var(--ink-soft);padding:4px 6px;font-size:13px}
  .btn-mini:hover{color:var(--ink)} .btn-mini.danger:hover{color:var(--red)} .btn-mini.edit:hover{color:var(--accent-ink)}
  .yn{display:flex;gap:10px}.yn button{min-width:120px;text-align:center}

  /* BÅND */
  .bandbox{background:#fff}
  .band{position:relative;width:100%;display:flex;align-items:stretch;border-radius:0;overflow:hidden;background:#fff;box-shadow:0 4px 14px rgba(15,34,51,.14),inset 0 0 0 1px rgba(0,0,0,.06);aspect-ratio:250/20;min-height:26px;user-select:none;touch-action:none}
  .band.edit{box-shadow:0 10px 30px rgba(0,0,0,.28),inset 0 0 0 1px rgba(255,255,255,.1)}
  .zone-left{flex:0 0 12.68%;position:relative;background:transparent;border-right:none}
  .zz{display:none;position:absolute;left:0;top:0;bottom:0;width:100%;opacity:.72;background-repeat:no-repeat;background-position:left center;background-size:100% 100%;background-image:url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2252%22%20height%3D%2253.8583%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20viewBox%3D%220%200%2052%2053.8583%22%20preserveAspectRatio%3D%22xMidYMid%20meet%22%20%3E%3Cdefs%3E%3Cg%3E%3Cg%20id%3D%22glyph-0-0%22%3E%3Cpath%20d%3D%22M%206.984375%200.234375%20L%203.5625%202.578125%20L%200%200.109375%20L%200%201.5%20L%201.578125%202.5%20C%202%202.765625%202.375%203%202.78125%203.234375%20L%202.78125%203.265625%20C%202.375%203.5%201.984375%203.734375%201.578125%204%20L%200%205.015625%20L%200%206.453125%20L%203.609375%204.015625%20L%206.984375%206.375%20L%206.984375%205.015625%20L%205.5%204.046875%20C%205.125%203.8125%204.765625%203.59375%204.34375%203.359375%20L%204.34375%203.3125%20C%204.734375%203.09375%205.09375%202.875%205.484375%202.609375%20L%206.984375%201.625%20Z%20M%206.984375%200.234375%20%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3CclipPath%20id%3D%22clip-0%22%3E%3Cpath%20clip-rule%3D%22nonzero%22%20d%3D%22M%2089%200%20L%20707.5625%200%20L%20707.5625%2053.71875%20L%2089%2053.71875%20Z%20M%2089%200%20%22%2F%3E%3C%2FclipPath%3E%3CclipPath%20id%3D%22clip-1%22%3E%3Cpath%20clip-rule%3D%22nonzero%22%20d%3D%22M%200.761719%200%20L%2090%200%20L%2090%2053.71875%20L%200.761719%2053.71875%20Z%20M%200.761719%200%20%22%2F%3E%3C%2FclipPath%3E%3CclipPath%20id%3D%22clip-2%22%3E%3Cpath%20clip-rule%3D%22nonzero%22%20d%3D%22M%200.761719%200%20L%2091%200%20L%2091%2053.71875%20L%200.761719%2053.71875%20Z%20M%200.761719%200%20%22%2F%3E%3C%2FclipPath%3E%3CclipPath%20id%3D%22clip-3%22%3E%3Cpath%20clip-rule%3D%22nonzero%22%20d%3D%22M%2052%200%20L%2081%200%20L%2081%2053.71875%20L%2052%2053.71875%20Z%20M%2052%200%20%22%2F%3E%3C%2FclipPath%3E%3CclipPath%20id%3D%22clip-4%22%3E%3Cpath%20clip-rule%3D%22nonzero%22%20d%3D%22M%2041%200%20L%2070%200%20L%2070%2053.71875%20L%2041%2053.71875%20Z%20M%2041%200%20%22%2F%3E%3C%2FclipPath%3E%3CclipPath%20id%3D%22clip-5%22%3E%3Cpath%20clip-rule%3D%22nonzero%22%20d%3D%22M%2031%200%20L%2060%200%20L%2060%2053.71875%20L%2031%2053.71875%20Z%20M%2031%200%20%22%2F%3E%3C%2FclipPath%3E%3CclipPath%20id%3D%22clip-6%22%3E%3Cpath%20clip-rule%3D%22nonzero%22%20d%3D%22M%2020%200%20L%2049%200%20L%2049%2053.71875%20L%2020%2053.71875%20Z%20M%2020%200%20%22%2F%3E%3C%2FclipPath%3E%3CclipPath%20id%3D%22clip-7%22%3E%3Cpath%20clip-rule%3D%22nonzero%22%20d%3D%22M%209%200%20L%2038%200%20L%2038%2053.71875%20L%209%2053.71875%20Z%20M%209%200%20%22%2F%3E%3C%2FclipPath%3E%3CclipPath%20id%3D%22clip-8%22%3E%3Cpath%20clip-rule%3D%22nonzero%22%20d%3D%22M%200.761719%200%20L%2027%200%20L%2027%2053.71875%20L%200.761719%2053.71875%20Z%20M%200.761719%200%20%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3Cg%20clip-path%3D%22url%28%23clip-0%29%22%3E%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22none%22%20fill-opacity%3D%221%22%20d%3D%22M%2089.878906%2053.71875%20L%20707.558594%2053.71875%20L%20707.558594%200.269531%20L%2089.878906%200.269531%20Z%20M%2089.878906%2053.71875%20%22%2F%3E%3C%2Fg%3E%3Cg%20clip-path%3D%22url%28%23clip-1%29%22%3E%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22rgb%28100%25%2C%20100%25%2C%20100%25%29%22%20fill-opacity%3D%221%22%20d%3D%22M%200.761719%2053.71875%20L%2089.847656%2053.71875%20L%2089.847656%200.269531%20L%200.761719%200.269531%20Z%20M%200.761719%2053.71875%20%22%2F%3E%3C%2Fg%3E%3Cg%20clip-path%3D%22url%28%23clip-2%29%22%3E%3Cpath%20fill%3D%22none%22%20stroke-width%3D%220.5%22%20stroke-linecap%3D%22butt%22%20stroke-linejoin%3D%22miter%22%20stroke%3D%22rgb%2813.729858%25%2C%2012.159729%25%2C%2012.548828%25%29%22%20stroke-opacity%3D%221%22%20stroke-miterlimit%3D%2210%22%20d%3D%22M%2089.321308%20-0.272023%20L%20-0.00684597%20-0.272023%20L%20-0.00684597%2053.58806%20L%2089.321308%2053.58806%20Z%20M%2089.321308%20-0.272023%20%22%20transform%3D%22matrix%280.997376%2C%200%2C%200%2C%20-0.997376%2C%200.760734%2C%2053.716972%29%22%2F%3E%3C%2Fg%3E%3Cg%20fill%3D%22rgb%2813.729858%25%2C%2012.159729%25%2C%2012.548828%25%29%22%20fill-opacity%3D%221%22%3E%3Cuse%20xlink%3Ahref%3D%22%23glyph-0-0%22%20x%3D%2275.365251%22%20y%3D%2210.131444%22%2F%3E%3Cuse%20xlink%3Ahref%3D%22%23glyph-0-0%22%20x%3D%2275.365251%22%20y%3D%2216.754181%22%2F%3E%3Cuse%20xlink%3Ahref%3D%22%23glyph-0-0%22%20x%3D%2275.365251%22%20y%3D%2223.376917%22%2F%3E%3Cuse%20xlink%3Ahref%3D%22%23glyph-0-0%22%20x%3D%2275.365251%22%20y%3D%2229.999654%22%2F%3E%3Cuse%20xlink%3Ahref%3D%22%23glyph-0-0%22%20x%3D%2275.365251%22%20y%3D%2236.62239%22%2F%3E%3C%2Fg%3E%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22rgb%28100%25%2C%20100%25%2C%20100%25%29%22%20fill-opacity%3D%221%22%20d%3D%22M%2072.839844%203.949219%20L%2066.566406%203.949219%20L%2059.519531%208.453125%20L%2067.257812%2014.460938%20L%2059.519531%2020.898438%20L%2066.738281%2026.90625%20L%2059.519531%2032.914062%20L%2067.425781%2037.847656%20L%2059.519531%2043.429688%20L%2068.113281%2049.433594%20L%2073.445312%2049.433594%20L%2065.449219%2043.644531%20L%2072.410156%2037.421875%20L%2064.503906%2032.054688%20L%2072.066406%2027.125%20L%2064.160156%2020.683594%20L%2072.066406%2014.890625%20L%2064.675781%209.097656%20Z%20M%2072.839844%203.949219%20%22%2F%3E%3Cg%20clip-path%3D%22url%28%23clip-3%29%22%3E%3Cpath%20fill%3D%22none%22%20stroke-width%3D%220.5%22%20stroke-linecap%3D%22butt%22%20stroke-linejoin%3D%22miter%22%20stroke%3D%22rgb%286.307983%25%2C%205.787659%25%2C%205.090332%25%29%22%20stroke-opacity%3D%221%22%20stroke-miterlimit%3D%2210%22%20d%3D%22M%20-0.00145196%200.00119094%20L%20-6.291395%200.00119094%20L%20-13.35681%20-4.514565%20L%20-5.598169%20-10.538184%20L%20-13.35681%20-16.992621%20L%20-6.119068%20-23.01624%20L%20-13.35681%20-29.039859%20L%20-5.429759%20-33.986433%20L%20-13.35681%20-39.58315%20L%20-4.74045%20-45.602852%20L%200.60561%20-45.602852%20L%20-7.411522%20-39.798559%20L%20-0.43227%20-33.559531%20L%20-8.359321%20-28.178223%20L%20-0.776924%20-23.235565%20L%20-8.703976%20-16.777212%20L%20-0.776924%20-10.969002%20L%20-8.186994%20-5.160792%20L%20-0.00145196%200.00119094%20%22%20transform%3D%22matrix%280.997376%2C%200%2C%200%2C%20-0.997376%2C%2072.841292%2C%203.950407%29%22%2F%3E%3C%2Fg%3E%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22rgb%28100%25%2C%20100%25%2C%20100%25%29%22%20fill-opacity%3D%221%22%20d%3D%22M%2062.25%203.949219%20L%2055.976562%203.949219%20L%2048.925781%208.453125%20L%2056.664062%2014.460938%20L%2048.925781%2020.898438%20L%2056.148438%2026.90625%20L%2048.925781%2032.914062%20L%2056.835938%2037.847656%20L%2048.925781%2043.429688%20L%2057.523438%2049.433594%20L%2062.851562%2049.433594%20L%2054.859375%2043.644531%20L%2061.820312%2037.421875%20L%2053.914062%2032.054688%20L%2061.476562%2027.125%20L%2053.566406%2020.683594%20L%2061.476562%2014.890625%20L%2054.082031%209.097656%20Z%20M%2062.25%203.949219%20%22%2F%3E%3Cg%20clip-path%3D%22url%28%23clip-4%29%22%3E%3Cpath%20fill%3D%22none%22%20stroke-width%3D%220.5%22%20stroke-linecap%3D%22butt%22%20stroke-linejoin%3D%22miter%22%20stroke%3D%22rgb%286.307983%25%2C%205.787659%25%2C%205.090332%25%29%22%20stroke-opacity%3D%221%22%20stroke-miterlimit%3D%2210%22%20d%3D%22M%200.000642643%200.00119094%20L%20-6.2893%200.00119094%20L%20-13.358632%20-4.514565%20L%20-5.599991%20-10.538184%20L%20-13.358632%20-16.992621%20L%20-6.116973%20-23.01624%20L%20-13.358632%20-29.039859%20L%20-5.427664%20-33.986433%20L%20-13.358632%20-39.58315%20L%20-4.738355%20-45.602852%20L%200.603788%20-45.602852%20L%20-7.409427%20-39.798559%20L%20-0.430175%20-33.559531%20L%20-8.357227%20-28.178223%20L%20-0.77483%20-23.235565%20L%20-8.705797%20-16.777212%20L%20-0.77483%20-10.969002%20L%20-8.188816%20-5.160792%20L%200.000642643%200.00119094%20%22%20transform%3D%22matrix%280.997376%2C%200%2C%200%2C%20-0.997376%2C%2062.249359%2C%203.950407%29%22%2F%3E%3C%2Fg%3E%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22rgb%28100%25%2C%20100%25%2C%20100%25%29%22%20fill-opacity%3D%221%22%20d%3D%22M%2051.875%203.949219%20L%2045.601562%203.949219%20L%2038.550781%208.453125%20L%2046.289062%2014.460938%20L%2038.550781%2020.898438%20L%2045.769531%2026.90625%20L%2038.550781%2032.914062%20L%2046.460938%2037.847656%20L%2038.550781%2043.429688%20L%2047.144531%2049.433594%20L%2052.476562%2049.433594%20L%2044.480469%2043.644531%20L%2051.445312%2037.421875%20L%2043.535156%2032.054688%20L%2051.101562%2027.125%20L%2043.191406%2020.683594%20L%2051.101562%2014.890625%20L%2043.710938%209.097656%20Z%20M%2051.875%203.949219%20%22%2F%3E%3Cg%20clip-path%3D%22url%28%23clip-5%29%22%3E%3Cpath%20fill%3D%22none%22%20stroke-width%3D%220.5%22%20stroke-linecap%3D%22butt%22%20stroke-linejoin%3D%22miter%22%20stroke%3D%22rgb%286.307983%25%2C%205.787659%25%2C%205.090332%25%29%22%20stroke-opacity%3D%221%22%20stroke-miterlimit%3D%2210%22%20d%3D%22M%200.000146247%200.00119094%20L%20-6.289797%200.00119094%20L%20-13.359128%20-4.514565%20L%20-5.600488%20-10.538184%20L%20-13.359128%20-16.992621%20L%20-6.121386%20-23.01624%20L%20-13.359128%20-29.039859%20L%20-5.428161%20-33.986433%20L%20-13.359128%20-39.58315%20L%20-4.742768%20-45.602852%20L%200.603291%20-45.602852%20L%20-7.41384%20-39.798559%20L%20-0.430672%20-33.559531%20L%20-8.361639%20-28.178223%20L%20-0.775326%20-23.235565%20L%20-8.706294%20-16.777212%20L%20-0.775326%20-10.969002%20L%20-8.185396%20-5.160792%20L%200.000146247%200.00119094%20%22%20transform%3D%22matrix%280.997376%2C%200%2C%200%2C%20-0.997376%2C%2051.874854%2C%203.950407%29%22%2F%3E%3C%2Fg%3E%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22rgb%28100%25%2C%20100%25%2C%20100%25%29%22%20fill-opacity%3D%221%22%20d%3D%22M%2041.28125%203.949219%20L%2035.007812%203.949219%20L%2027.960938%208.453125%20L%2035.695312%2014.460938%20L%2027.960938%2020.898438%20L%2035.179688%2026.90625%20L%2027.960938%2032.914062%20L%2035.867188%2037.847656%20L%2027.960938%2043.429688%20L%2036.558594%2049.433594%20L%2041.886719%2049.433594%20L%2033.890625%2043.644531%20L%2040.851562%2037.421875%20L%2032.945312%2032.054688%20L%2040.507812%2027.125%20L%2032.601562%2020.683594%20L%2040.507812%2014.890625%20L%2033.117188%209.097656%20Z%20M%2041.28125%203.949219%20%22%2F%3E%3Cg%20clip-path%3D%22url%28%23clip-6%29%22%3E%3Cpath%20fill%3D%22none%22%20stroke-width%3D%220.5%22%20stroke-linecap%3D%22butt%22%20stroke-linejoin%3D%22miter%22%20stroke%3D%22rgb%286.307983%25%2C%205.787659%25%2C%205.090332%25%29%22%20stroke-opacity%3D%221%22%20stroke-miterlimit%3D%2210%22%20d%3D%22M%20-0.00117568%200.00119094%20L%20-6.291118%200.00119094%20L%20-13.356534%20-4.514565%20L%20-5.60181%20-10.538184%20L%20-13.356534%20-16.992621%20L%20-6.118791%20-23.01624%20L%20-13.356534%20-29.039859%20L%20-5.429482%20-33.986433%20L%20-13.356534%20-39.58315%20L%20-4.736257%20-45.602852%20L%200.605886%20-45.602852%20L%20-7.411245%20-39.798559%20L%20-0.431994%20-33.559531%20L%20-8.359045%20-28.178223%20L%20-0.776648%20-23.235565%20L%20-8.703699%20-16.777212%20L%20-0.776648%20-10.969002%20L%20-8.186718%20-5.160792%20L%20-0.00117568%200.00119094%20%22%20transform%3D%22matrix%280.997376%2C%200%2C%200%2C%20-0.997376%2C%2041.282423%2C%203.950407%29%22%2F%3E%3C%2Fg%3E%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22rgb%28100%25%2C%20100%25%2C%20100%25%29%22%20fill-opacity%3D%221%22%20d%3D%22M%2029.910156%203.949219%20L%2023.636719%203.949219%20L%2016.585938%208.453125%20L%2024.324219%2014.460938%20L%2016.585938%2020.898438%20L%2023.808594%2026.90625%20L%2016.585938%2032.914062%20L%2024.496094%2037.847656%20L%2016.585938%2043.429688%20L%2025.183594%2049.433594%20L%2030.511719%2049.433594%20L%2022.519531%2043.644531%20L%2029.484375%2037.421875%20L%2021.574219%2032.054688%20L%2029.136719%2027.125%20L%2021.230469%2020.683594%20L%2029.136719%2014.890625%20L%2021.746094%209.097656%20Z%20M%2029.910156%203.949219%20%22%2F%3E%3Cg%20clip-path%3D%22url%28%23clip-7%29%22%3E%3Cpath%20fill%3D%22none%22%20stroke-width%3D%220.5%22%20stroke-linecap%3D%22butt%22%20stroke-linejoin%3D%22miter%22%20stroke%3D%22rgb%286.307983%25%2C%205.787659%25%2C%205.090332%25%29%22%20stroke-opacity%3D%221%22%20stroke-miterlimit%3D%2210%22%20d%3D%22M%20-0.000586523%200.00119094%20L%20-6.290529%200.00119094%20L%20-13.359861%20-4.514565%20L%20-5.601221%20-10.538184%20L%20-13.359861%20-16.992621%20L%20-6.118202%20-23.01624%20L%20-13.359861%20-29.039859%20L%20-5.428893%20-33.986433%20L%20-13.359861%20-39.58315%20L%20-4.739585%20-45.602852%20L%200.602559%20-45.602852%20L%20-7.410656%20-39.798559%20L%20-0.427488%20-33.559531%20L%20-8.358456%20-28.178223%20L%20-0.776059%20-23.235565%20L%20-8.70311%20-16.777212%20L%20-0.776059%20-10.969002%20L%20-8.186128%20-5.160792%20L%20-0.000586523%200.00119094%20%22%20transform%3D%22matrix%280.997376%2C%200%2C%200%2C%20-0.997376%2C%2029.910741%2C%203.950407%29%22%2F%3E%3C%2Fg%3E%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22rgb%28100%25%2C%20100%25%2C%20100%25%29%22%20fill-opacity%3D%221%22%20d%3D%22M%2019.320312%203.949219%20L%2013.046875%203.949219%20L%205.996094%208.453125%20L%2013.734375%2014.460938%20L%205.996094%2020.898438%20L%2013.21875%2026.90625%20L%205.996094%2032.914062%20L%2013.90625%2037.847656%20L%205.996094%2043.429688%20L%2014.59375%2049.433594%20L%2019.921875%2049.433594%20L%2011.929688%2043.644531%20L%2018.890625%2037.421875%20L%2010.984375%2032.054688%20L%2018.546875%2027.125%20L%2010.636719%2020.683594%20L%2018.546875%2014.890625%20L%2011.152344%209.097656%20Z%20M%2019.320312%203.949219%20%22%2F%3E%3Cg%20clip-path%3D%22url%28%23clip-8%29%22%3E%3Cpath%20fill%3D%22none%22%20stroke-width%3D%220.5%22%20stroke-linecap%3D%22butt%22%20stroke-linejoin%3D%22miter%22%20stroke%3D%22rgb%286.307983%25%2C%205.787659%25%2C%205.090332%25%29%22%20stroke-opacity%3D%221%22%20stroke-miterlimit%3D%2210%22%20d%3D%22M%200.000508082%200.00119094%20L%20-6.289435%200.00119094%20L%20-13.358766%20-4.514565%20L%20-5.600126%20-10.538184%20L%20-13.358766%20-16.992621%20L%20-6.117107%20-23.01624%20L%20-13.358766%20-29.039859%20L%20-5.427799%20-33.986433%20L%20-13.358766%20-39.58315%20L%20-4.73849%20-45.602852%20L%200.603653%20-45.602852%20L%20-7.409561%20-39.798559%20L%20-0.43031%20-33.559531%20L%20-8.357361%20-28.178223%20L%20-0.774964%20-23.235565%20L%20-8.705932%20-16.777212%20L%20-0.774964%20-10.969002%20L%20-8.18895%20-5.160792%20L%200.000508082%200.00119094%20%22%20transform%3D%22matrix%280.997376%2C%200%2C%200%2C%20-0.997376%2C%2019.319806%2C%203.950407%29%22%2F%3E%3C%2Fg%3E%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22rgb%2813.729858%25%2C%2012.159729%25%2C%2012.548828%25%29%22%20fill-opacity%3D%221%22%20d%3D%22M%20686.191406%2042.976562%20L%20686.191406%2040.960938%20C%20685.808594%2040.992188%20685.523438%2041.070312%20685.332031%2041.207031%20C%20685.058594%2041.402344%20684.921875%2041.652344%20684.921875%2041.957031%20C%20684.921875%2042.230469%20685.035156%2042.464844%20685.265625%2042.65625%20C%20685.492188%2042.851562%20685.804688%2042.957031%20686.191406%2042.976562%20M%20687.839844%2041.050781%20L%20687.9375%2040.421875%20C%20688.828125%2040.644531%20688.929688%2041.523438%20688.929688%2041.929688%20C%20688.929688%2042.441406%20688.734375%2042.855469%20688.34375%2043.167969%20C%20687.953125%2043.484375%20687.390625%2043.640625%20686.652344%2043.640625%20C%20685.890625%2043.640625%20685.308594%2043.484375%20684.90625%2043.164062%20C%20684.503906%2042.847656%20684.300781%2042.441406%20684.300781%2041.953125%20C%20684.300781%2041.484375%20684.5%2041.097656%20684.898438%2040.785156%20C%20685.292969%2040.472656%20685.859375%2040.316406%20686.609375%2040.316406%20L%20686.808594%2040.320312%20L%20686.808594%2043.011719%20C%20687.304688%2042.988281%20687.683594%2042.875%20687.933594%2042.671875%20C%20688.1875%2042.464844%20688.3125%2042.214844%20688.3125%2041.925781%20C%20688.3125%2041.464844%20688.308594%2041.398438%20687.839844%2041.050781%20%22%2F%3E%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22rgb%2813.729858%25%2C%2012.159729%25%2C%2012.548828%25%29%22%20fill-opacity%3D%221%22%20d%3D%22M%20686.191406%2035.667969%20L%20686.191406%2033.652344%20C%20685.808594%2033.683594%20685.523438%2033.765625%20685.332031%2033.898438%20C%20685.058594%2034.09375%20684.921875%2034.34375%20684.921875%2034.648438%20C%20684.921875%2034.921875%20685.035156%2035.15625%20685.265625%2035.347656%20C%20685.492188%2035.542969%20685.804688%2035.648438%20686.191406%2035.667969%20M%20687.839844%2033.742188%20L%20687.9375%2033.113281%20C%20688.828125%2033.335938%20688.929688%2034.214844%20688.929688%2034.621094%20C%20688.929688%2035.132812%20688.734375%2035.546875%20688.34375%2035.859375%20C%20687.953125%2036.175781%20687.390625%2036.335938%20686.652344%2036.335938%20C%20685.890625%2036.335938%20685.308594%2036.175781%20684.90625%2035.855469%20C%20684.503906%2035.539062%20684.300781%2035.132812%20684.300781%2034.644531%20C%20684.300781%2034.175781%20684.5%2033.789062%20684.898438%2033.476562%20C%20685.292969%2033.164062%20685.859375%2033.007812%20686.609375%2033.007812%20L%20686.808594%2033.011719%20L%20686.808594%2035.703125%20C%20687.304688%2035.679688%20687.683594%2035.566406%20687.933594%2035.363281%20C%20688.1875%2035.15625%20688.3125%2034.90625%20688.3125%2034.617188%20C%20688.3125%2034.15625%20688.308594%2034.09375%20687.839844%2033.742188%20%22%2F%3E%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22rgb%2813.729858%25%2C%2012.159729%25%2C%2012.548828%25%29%22%20fill-opacity%3D%221%22%20d%3D%22M%20688.828125%2038.554688%20L%20684.40625%2039.929688%20L%20684.40625%2039.28125%20L%20687.054688%2038.503906%20C%20687.355469%2038.417969%20687.652344%2038.339844%20687.945312%2038.273438%20C%20687.714844%2038.222656%20687.433594%2038.144531%20687.105469%2038.050781%20L%20684.40625%2037.242188%20L%20684.40625%2036.613281%20L%20688.828125%2037.984375%20Z%20M%20688.828125%2038.554688%20%22%2F%3E%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22rgb%2813.729858%25%2C%2012.159729%25%2C%2012.548828%25%29%22%20fill-opacity%3D%221%22%20d%3D%22M%20688.828125%2032.214844%20L%20684.40625%2032.214844%20L%20684.40625%2031.660156%20L%20685.03125%2031.660156%20C%20684.785156%2031.53125%20684.605469%2031.367188%20684.484375%2031.175781%20C%20684.363281%2030.984375%20684.304688%2030.765625%20684.304688%2030.519531%20C%20684.304688%2030.324219%20684.34375%2030.144531%20684.417969%2029.980469%20C%20684.496094%2029.816406%20684.597656%2029.683594%20684.71875%2029.585938%20C%20684.84375%2029.484375%20685.003906%2029.410156%20685.199219%2029.359375%20C%20685.398438%2029.308594%20685.699219%2029.285156%20686.109375%2029.285156%20L%20688.828125%2029.285156%20L%20688.828125%2029.894531%20L%20686.132812%2029.894531%20C%20685.808594%2029.894531%20685.574219%2029.921875%20685.421875%2029.976562%20C%20685.269531%2030.03125%20685.15625%2030.117188%20685.070312%2030.238281%20C%20684.992188%2030.355469%20684.949219%2030.488281%20684.949219%2030.640625%20C%20684.949219%2030.9375%20685.058594%2031.167969%20685.277344%2031.34375%20C%20685.5%2031.515625%20685.875%2031.605469%20686.410156%2031.605469%20L%20688.828125%2031.605469%20Z%20M%20688.828125%2032.214844%20%22%2F%3E%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22rgb%2813.729858%25%2C%2012.159729%25%2C%2012.548828%25%29%22%20fill-opacity%3D%221%22%20d%3D%22M%20688.160156%2026.984375%20L%20688.820312%2026.902344%20C%20688.863281%2027.070312%20688.886719%2027.222656%20688.886719%2027.359375%20C%20688.886719%2027.570312%20688.84375%2027.742188%20688.761719%2027.871094%20C%20688.675781%2028%20688.558594%2028.089844%20688.414062%2028.136719%20C%20688.265625%2028.1875%20687.972656%2028.210938%20687.535156%2028.210938%20L%20684.988281%2028.210938%20L%20684.988281%2028.660156%20L%20684.40625%2028.660156%20L%20684.40625%2028.210938%20L%20683.308594%2028.210938%20L%20682.859375%2027.601562%20L%20684.40625%2027.601562%20L%20684.40625%2026.984375%20L%20684.988281%2026.984375%20L%20684.988281%2027.601562%20L%20687.574219%2027.601562%20C%20687.816406%2027.601562%20687.96875%2027.585938%20688.035156%2027.546875%20C%20688.136719%2027.496094%20688.1875%2027.398438%20688.1875%2027.253906%20C%20688.1875%2027.183594%20688.175781%2027.097656%20688.160156%2026.984375%20%22%2F%3E%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22rgb%2813.729858%25%2C%2012.159729%25%2C%2012.548828%25%29%22%20fill-opacity%3D%221%22%20d%3D%22M%20688.828125%2026.410156%20L%20684.40625%2026.410156%20L%20684.40625%2025.855469%20L%20685.074219%2025.855469%20C%20684.761719%2025.71875%20684.558594%2025.589844%20684.457031%2025.46875%20C%20684.355469%2025.351562%20684.304688%2025.222656%20684.304688%2025.078125%20C%20684.304688%2024.871094%20684.382812%2024.664062%20684.546875%2024.449219%20L%20685.242188%2024.65625%20C%20685.132812%2024.808594%20685.078125%2024.957031%20685.078125%2025.101562%20C%20685.078125%2025.230469%20685.125%2025.347656%20685.21875%2025.457031%20C%20685.308594%2025.5625%20685.4375%2025.640625%20685.597656%2025.683594%20C%20685.882812%2025.761719%20686.191406%2025.800781%20686.515625%2025.800781%20L%20688.828125%2025.800781%20Z%20M%20688.828125%2026.410156%20%22%2F%3E%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22rgb%2813.729858%25%2C%2012.159729%25%2C%2012.548828%25%29%22%20fill-opacity%3D%221%22%20d%3D%22M%20686.613281%2023.699219%20C%20687.1875%2023.699219%20687.613281%2023.597656%20687.894531%2023.390625%20C%20688.171875%2023.183594%20688.3125%2022.925781%20688.3125%2022.617188%20C%20688.3125%2022.332031%20688.171875%2022.085938%20687.886719%2021.878906%20C%20687.609375%2021.671875%20687.179688%2021.570312%20686.613281%2021.570312%20C%20686.046875%2021.570312%20685.621094%2021.675781%20685.339844%2021.882812%20C%20685.058594%2022.089844%20684.921875%2022.347656%20684.921875%2022.652344%20C%20684.921875%2022.941406%20685.0625%2023.191406%20685.34375%2023.394531%20C%20685.625%2023.597656%20686.046875%2023.699219%20686.613281%2023.699219%20M%20686.617188%2024.328125%20C%20685.851562%2024.328125%20685.277344%2024.167969%20684.886719%2023.847656%20C%20684.5%2023.527344%20684.304688%2023.125%20684.304688%2022.636719%20C%20684.304688%2022.15625%20684.5%2021.753906%20684.886719%2021.429688%20C%20685.277344%2021.105469%20685.839844%2020.945312%20686.570312%2020.945312%20C%20687.367188%2020.945312%20687.957031%2021.105469%20688.347656%2021.421875%20C%20688.734375%2021.738281%20688.929688%2022.144531%20688.929688%2022.636719%20C%20688.929688%2023.117188%20688.734375%2023.519531%20688.34375%2023.84375%20C%20687.953125%2024.164062%20687.378906%2024.328125%20686.617188%2024.328125%20%22%2F%3E%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22rgb%2813.729858%25%2C%2012.159729%25%2C%2012.548828%25%29%22%20fill-opacity%3D%221%22%20d%3D%22M%20688.828125%2020.035156%20L%20687.976562%2020.035156%20L%20687.976562%2019.335938%20L%20688.828125%2019.335938%20Z%20M%20688.828125%2020.035156%20%22%2F%3E%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22rgb%2813.729858%25%2C%2012.159729%25%2C%2012.548828%25%29%22%20fill-opacity%3D%221%22%20d%3D%22M%20688.828125%2018.289062%20L%20684.40625%2018.289062%20L%20684.40625%2017.738281%20L%20685.03125%2017.738281%20C%20684.785156%2017.605469%20684.605469%2017.445312%20684.484375%2017.253906%20C%20684.363281%2017.0625%20684.304688%2016.839844%20684.304688%2016.59375%20C%20684.304688%2016.398438%20684.34375%2016.222656%20684.417969%2016.058594%20C%20684.496094%2015.894531%20684.597656%2015.761719%20684.71875%2015.660156%20C%20684.84375%2015.558594%20685.003906%2015.484375%20685.199219%2015.433594%20C%20685.398438%2015.386719%20685.699219%2015.359375%20686.109375%2015.359375%20L%20688.828125%2015.359375%20L%20688.828125%2015.96875%20L%20686.132812%2015.96875%20C%20685.808594%2015.96875%20685.574219%2015.996094%20685.421875%2016.050781%20C%20685.269531%2016.109375%20685.15625%2016.195312%20685.070312%2016.3125%20C%20684.992188%2016.429688%20684.949219%2016.566406%20684.949219%2016.71875%20C%20684.949219%2017.011719%20685.058594%2017.246094%20685.277344%2017.417969%20C%20685.5%2017.59375%20685.875%2017.683594%20686.410156%2017.683594%20L%20688.828125%2017.683594%20Z%20M%20688.828125%2018.289062%20%22%2F%3E%3Cpath%20fill-rule%3D%22nonzero%22%20fill%3D%22rgb%2813.729858%25%2C%2012.159729%25%2C%2012.548828%25%29%22%20fill-opacity%3D%221%22%20d%3D%22M%20686.613281%2014.027344%20C%20687.1875%2014.027344%20687.613281%2013.921875%20687.894531%2013.714844%20C%20688.171875%2013.507812%20688.3125%2013.253906%20688.3125%2012.945312%20C%20688.3125%2012.660156%20688.171875%2012.410156%20687.886719%2012.207031%20C%20687.609375%2012%20687.179688%2011.898438%20686.613281%2011.898438%20C%20686.046875%2011.898438%20685.621094%2012%20685.339844%2012.207031%20C%20685.058594%2012.414062%20684.921875%2012.671875%20684.921875%2012.976562%20C%20684.921875%2013.269531%20685.0625%2013.515625%20685.34375%2013.71875%20C%20685.625%2013.921875%20686.046875%2014.027344%20686.613281%2014.027344%20M%20686.617188%2014.652344%20C%20685.851562%2014.652344%20685.277344%2014.492188%20684.886719%2014.171875%20C%20684.5%2013.855469%20684.304688%2013.449219%20684.304688%2012.964844%20C%20684.304688%2012.480469%20684.5%2012.078125%20684.886719%2011.757812%20C%20685.277344%2011.433594%20685.839844%2011.273438%20686.570312%2011.273438%20C%20687.367188%2011.273438%20687.957031%2011.429688%20688.347656%2011.746094%20C%20688.734375%2012.066406%20688.929688%2012.46875%20688.929688%2012.964844%20C%20688.929688%2013.445312%20688.734375%2013.847656%20688.34375%2014.171875%20C%20687.953125%2014.492188%20687.378906%2014.652344%20686.617188%2014.652344%20%22%2F%3E%3C%2Fsvg%3E")}
  .zone-left .serial{display:none;position:absolute;top:50%;right:4px;transform:translateY(-50%) rotate(-90deg);font:500 9px "Arial Narrow",var(--font-ui);letter-spacing:1.5px;color:rgba(0,0,0,.62);white-space:nowrap}
  .pboard{position:relative;flex:1;overflow:hidden}
  .band.edit .pboard{overflow:visible}
  .band.guides{overflow:visible}
  .safebox{position:absolute;left:0;right:0;top:7.5%;bottom:7.5%;border-top:1px dashed rgba(0,0,0,.35);border-bottom:1px dashed rgba(0,0,0,.35);pointer-events:none;display:none}
  .band.guides .safebox{display:block}
  .designclip{position:absolute;inset:0;clip-path:inset(7.5% 0.6% 7.5% 0.6%);z-index:1}
  .hlayer{position:absolute;inset:0;pointer-events:none;z-index:6}
  .hlayer .handle{pointer-events:auto}
  .wm-x{position:absolute;right:7px;top:8px;width:18px;height:18px;border-radius:50%;background:#111;color:#fff;border:2px solid #fff;font-size:12px;line-height:1;cursor:pointer;z-index:8;display:grid;place-items:center;box-shadow:0 2px 6px rgba(0,0,0,.35)}
  .wm-x.hidden{display:none}
  .hset{position:absolute;transform-origin:center center;pointer-events:none}
  .pboard .ovlline,.pboard .ovlshade,.pboard .safebox{z-index:3}
  .pboard.editing{outline:1px dashed rgba(0,0,0,.22);outline-offset:-4px}
  .pboard .brand{position:absolute;right:5px;top:50%;transform:translateY(-50%) rotate(-90deg);font:700 11px var(--font-ui);white-space:nowrap;pointer-events:auto;cursor:default;z-index:3}
  .pboard .ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:clamp(11px,3vw,20px);opacity:.85;pointer-events:none}
  .qtycap{text-align:center;font-weight:700;color:var(--ink);margin-top:8px;font-size:15px}

  .obj{position:absolute;transform-origin:center center;white-space:nowrap}
  .obj.edito{cursor:move}
  .obj .t{display:inline-block;line-height:1}
  .obj img{display:block;pointer-events:none}
  .obj.sel{outline:3px solid #10d9e8;outline-offset:6px;box-shadow:0 0 0 1px rgba(16,217,232,.28)}
  .obj.editing-text{cursor:text}
  .obj.editing-text .t{outline:1px dashed var(--accent);outline-offset:2px;cursor:text;min-width:8px}
  .handle{position:absolute;width:18px;height:18px;border-radius:50%;background:#111;border:2px solid #111;display:none;place-items:center;color:#fff;font-size:13px;line-height:1;box-shadow:0 1px 3px rgba(0,0,0,.4)}
  .hset.solo .handle{display:grid}
  .gframe{position:absolute;border:3px solid #10d9e8;box-shadow:0 0 0 1px rgba(16,217,232,.28);pointer-events:none;z-index:6}
  .gframe.hidden{display:none}
  .gframe .handle{display:grid;pointer-events:auto}
  .pboard.multi .obj.sel{outline:none;box-shadow:none}
  .handle.scale{right:-9px;bottom:-9px;cursor:nwse-resize}
  .handle.rotate{left:-9px;top:-9px;cursor:grab}
  .handle.del{right:-9px;top:-9px;cursor:pointer;font-size:14px;font-weight:700}
  .handle.edge{width:9px;height:9px;border-radius:50%;background:#10d9e8;border:2px solid #fff;box-shadow:0 0 0 1px rgba(16,217,232,.55);font-size:0;padding:0}
  .handle.eTop{top:-13px;left:50%;transform:translateX(-50%);cursor:ns-resize}
  .handle.eBot{bottom:-13px;left:50%;transform:translateX(-50%);cursor:ns-resize}
  .handle.eLeft{left:-13px;top:50%;transform:translateY(-50%);cursor:ew-resize}
  .handle.eRight{right:-13px;top:50%;transform:translateY(-50%);cursor:ew-resize}

  /* result/design fullbredde */
  #resultArea.hidden{display:none}
  .stage{background:linear-gradient(180deg,#ffffff,#eef2f7);border:1px solid var(--line);padding:20px 16px;border-radius:14px;box-shadow:inset 0 1px 3px rgba(15,34,51,.06)}
  .resActions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
  #designTools.hidden{display:none}
  .tools{display:flex;flex-wrap:wrap;gap:10px;align-items:stretch;width:100%;margin-top:14px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px;box-shadow:0 6px 20px rgba(0,0,0,.12)}
  .tools>.tgrp{flex:0 1 auto;min-width:0}
  .tools>.tgrp:first-child{flex:0 1 auto}
  .tgrp{display:flex;flex-wrap:wrap;gap:6px;padding:6px;border:1px solid var(--line);border-radius:10px;background:#f7fafd;box-shadow:0 1px 3px rgba(15,34,51,.06)}
  .tbtn{flex:0 1 auto;min-width:0;min-height:40px;display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:8px 12px;background:#fff;border:1px solid var(--line);border-radius:9px;color:var(--ink);font-size:15px;line-height:1.15;white-space:nowrap}
  .tbtn .tlbl{font-size:13px;font-weight:600;line-height:1.1}
  .tbtn:hover{border-color:var(--accent);color:var(--accent-ink)} .tbtn:disabled{opacity:.4;cursor:not-allowed}
  .tbtn svg{width:20px;height:20px;fill:currentColor;flex:0 0 auto}
  .tbtn.wide{flex:0 1 auto;min-width:0;padding:8px 12px;font-size:13.5px;font-weight:600;gap:6px;white-space:nowrap}
  #designTools{position:relative}
  .inksel{flex:0 1 auto;min-width:0;min-height:40px;padding:6px 10px;border:1px solid var(--line);border-radius:9px;background:#eef3f9;font-size:13.5px;font-weight:600;color:var(--ink);cursor:pointer}
  .inksel option:disabled{color:#aeb9c6}
  .ink-hint{position:fixed;transform:translate(-50%,-100%);margin-top:-6px;background:#eef2f7;color:#22303f;font-size:13px;padding:10px 14px;border-radius:12px;max-width:420px;text-align:center;z-index:1200;border:1px solid #c3d1e2;box-shadow:0 8px 22px rgba(15,34,51,.22);display:flex;flex-direction:column;align-items:center;gap:2px}
  .ink-hint .ink-arrow{color:#e2001a;font-size:18px;line-height:1;margin-top:-2px}
  .ink-hint:not(.hidden) .ink-arrow{animation:blbounce .5s ease 6}
  /* Sideplassering for trykkfarge-hint: native select-dropdown kan ligge over vanlig DOM. */
  .ink-hint.ink-hint-side{transform:translateY(-50%);margin-top:0;max-width:min(420px,30vw);text-align:left;align-items:flex-start;z-index:5000}
  .ink-hint.ink-hint-side .ink-arrow{position:absolute;left:-14px;top:50%;transform:translateY(-50%);margin:0;font-size:22px;line-height:1}
  .ink-hint.ink-hint-side.ink-hint-left{transform:translate(-100%,-50%)}
  .ink-hint.ink-hint-side.ink-hint-left .ink-arrow{left:auto;right:-14px}
  @media (prefers-reduced-motion:reduce){.ink-hint .ink-arrow{animation:none}}
  .ctrls{margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
  .seg{display:inline-flex;border:1px solid var(--line);border-radius:10px;overflow:hidden}
  .seg button{border:0;border-radius:0;padding:8px 12px;background:#fff;font-weight:600;color:var(--ink-soft)}
  .seg button.on{background:var(--accent);color:#fff}
  input[type=range]{width:100%;max-width:360px}
   .wm input{width:16px;height:16px}
  .ed-foot{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px;justify-content:flex-end}
  .as-choice .choice-body{padding:18px}
  .choice-new{display:block;width:100%;padding:16px;font-size:16px;font-weight:700;background:#0069b4;color:#fff;border:none;border-radius:10px;cursor:pointer;margin-bottom:18px}
  .choice-new:hover{background:#0a5bb0}
  .choice-keep h3{font-size:13px;text-transform:uppercase;letter-spacing:.03em;color:var(--ink-soft);margin:0 0 10px}
  .choice-keep-list{display:flex;flex-direction:column;gap:10px}
  .choice-row{display:flex;align-items:center;gap:12px;width:100%;background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px 12px;cursor:pointer;text-align:left}
  .choice-row:hover{border-color:#0069b4;box-shadow:0 2px 8px rgba(0,0,0,.12)}
  .choice-row-lbl{font-weight:600;font-size:13px;white-space:nowrap;color:var(--ink)}
  .choice-row img{flex:1;min-width:0;height:26px;object-fit:contain}
  .muted{color:var(--ink-soft);font-size:13px}

  .cart{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
  .cart:empty::after{content:"Tom ennå. Fullfør et bånd.";color:var(--ink-soft);font-size:13px}
  .citem{display:flex;flex-direction:column;gap:8px;align-items:stretch;border:1px solid var(--line);border-radius:12px;padding:9px 11px}
  .citem1{flex-direction:row;align-items:center;gap:7px;padding:2px 6px;border-radius:9px}
  #cartList{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:5px}
  .cback{width:22px;height:22px;flex:0 0 auto;border:1px solid var(--line);border-radius:6px;background:#fff;color:#0069b4;font-size:13px;cursor:pointer;display:grid;place-items:center;padding:0}
  .cback:hover{background:#eef4fb}
  .cbandimg{flex:1;min-width:0}
  .cbandimg img{width:100%;height:auto;display:block;border:1px solid var(--line)}
  .cqty{flex:0 0 70px;text-align:right;font-weight:700;font-size:13px;white-space:nowrap;color:var(--ink)}
  .cart-typehdr{font-weight:700;font-size:12px;letter-spacing:.03em;text-transform:uppercase;color:var(--ink-soft);margin:2px 0 8px}
  .cthumbwrap{cursor:pointer}
  .bl-bandimg.clickable{cursor:pointer}
  .bl-bandimg.clickable:hover{filter:brightness(1.04)}
  .cthumb{width:100%;height:auto;display:block;border:1px solid var(--line);border-radius:6px}
  .crow{display:flex;gap:10px;align-items:center}
  .crow .m{flex:1}
  .m.clickable{cursor:pointer}
  .m.clickable:hover .t{text-decoration:underline}
  .citem .dot{width:24px;height:24px;border-radius:6px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.15);flex:0 0 auto}
  .citem .m{flex:1;min-width:0} .citem .m .t{font-weight:600;font-size:14px} .citem .m .s{font-size:12.5px;color:var(--ink-soft)}
  .citem .ca{display:flex;flex-direction:column;gap:1px;flex:0 0 auto}
  .tag{display:inline-block;font-size:11px;font-weight:700;border-radius:6px;padding:1px 6px;margin-left:6px}
  .tag.design{background:#eaf3fb;color:var(--accent-ink)} .tag.free{background:var(--good-bg);color:var(--good)}
  .price .line{display:flex;justify-content:space-between;gap:12px;font-size:14px;padding:5px 0}
  .price .line .lbl2{color:var(--ink-soft)} .price .line.free .val{color:var(--good);font-weight:600}
  .price hr{border:0;border-top:1px solid var(--line);margin:8px 0}
  .price .total{display:flex;justify-content:space-between;align-items:baseline;margin-top:4px}
  .price .total .t{font-size:15px;font-weight:700} .price .total .v{font-size:24px;font-weight:800}
  .price .mva{font-size:12.5px;color:var(--ink-soft);text-align:right}
  .savebar{background:var(--good-bg);color:var(--good);border-radius:10px;padding:8px 12px;font-size:13px;font-weight:600;margin-top:12px}
  .actions{display:flex;flex-direction:column;gap:9px;margin-top:14px}
  .note{font-size:12px;color:var(--ink-soft);margin-top:10px} .note strong{color:var(--warn)}

  dialog{border:1px solid var(--line);border-radius:var(--radius);padding:0;max-width:640px;width:calc(100% - 40px);box-shadow:var(--shadow)}
  dialog::backdrop{background:rgba(10,12,20,.45)}
  dialog .dhead{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid var(--line)}
  dialog .dhead h3{margin:0;font-size:15px}
  dialog pre{margin:0;padding:16px 18px;max-height:60vh;overflow:auto;font-size:12.5px;background:#0e0f15;color:#e6e7ef;border-radius:0 0 var(--radius) var(--radius)}
  .selhint{display:none}
  .stage{position:relative}
  .helpbtn{display:none;position:absolute;top:8px;right:10px;z-index:6;width:27px;height:27px;border-radius:50%;border:none;background:rgba(255,255,255,.92);color:#1c2230;font-weight:800;font-size:15px;cursor:pointer;box-shadow:0 1px 5px rgba(0,0,0,.4);place-items:center}
  .helpbtn:hover{background:#fff}
  .helpbody{padding:16px 18px;max-width:470px;line-height:1.5}
  .helpbody .hsub{font-weight:700;margin:12px 0 6px}
  .hrow{display:flex;gap:10px;align-items:center;margin:5px 0}
  .hrow .hicon{flex:0 0 30px;height:26px;display:grid;place-items:center;border:1px solid var(--line);border-radius:6px;font-size:15px;color:var(--ink)}
  .hrow .hicon svg{width:18px;height:18px;fill:currentColor}
  .hrow span:last-child{font-size:13px}
  .cartbar{background:#fff;border:1px solid var(--line);border-radius:12px;padding:8px 12px;margin-bottom:12px;text-align:center}
  .cartbar .cbt{font-weight:700;font-size:13px}
  .cartbar .cbl{font-size:13px;color:var(--ink-soft);margin-top:2px}
  .btn-back{position:absolute;top:12px;right:12px;width:32px;height:32px;background:#fff;border:1px solid var(--line);border-radius:8px;color:var(--ink);font:400 20px var(--font-ui);line-height:1;cursor:pointer;padding:0;display:grid;place-items:center;z-index:6;box-shadow:0 2px 6px rgba(0,0,0,.16)}
  .btn-back:hover{background:#f3f6fb}
  .pal-sep{border:none;border-top:1px solid var(--line);margin:8px 0}
  .s1row{display:flex;gap:18px;align-items:stretch}
  .s1left{flex:1 1 auto;min-width:0}
  .s1preview{flex:0 0 300px;max-width:46%;align-self:stretch}
  .s1prevcard{background:#fff;border:1px solid var(--line);border-radius:10px;padding:6px;overflow:hidden;height:100%;display:flex}
  .arm-photo{display:block;width:100%;height:100%;object-fit:cover;border-radius:7px}
  @media(max-width:820px){.s1row{flex-direction:column;align-items:stretch}.s1preview{flex:0 0 auto;width:100%;max-width:100%}}
  .chosen-wrap{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
  .chosen-lbl{font-size:13px;color:var(--ink-soft)}
  .chosen-colors{display:flex;gap:6px;flex-wrap:wrap}
  .chosen-chip{width:22px;height:22px;border-radius:6px;border:1px solid rgba(0,0,0,.15)}
  .chosen-none{font-size:13px;color:var(--ink-soft)}
  #bandList{display:flex;flex-direction:column;gap:12px;margin-top:14px}
  .bandline{background:linear-gradient(180deg,#ffffff 0%,#eef3f9 100%);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 2px 6px rgba(15,34,51,.09),0 12px 26px rgba(15,34,51,.07);padding:12px 14px;position:relative;display:grid;grid-template-columns:124px 22px minmax(0,1fr) 118px;grid-template-areas:"ctrl move band act";gap:11px;align-items:stretch}
  .bl-close{position:absolute;top:-8px;right:-8px;width:22px;height:22px;border-radius:50%;border:1px solid var(--line);background:#fff;color:#8494a6;font-size:15px;line-height:1;cursor:pointer;z-index:6;display:grid;place-items:center;padding:0;box-shadow:0 1px 4px rgba(0,0,0,.22)}
  .bl-close:hover{background:#f2f4f7;color:#e2001a}
  .bl-move{grid-area:move;align-self:stretch;width:22px;min-height:40px;border:1px solid var(--line);border-radius:7px;background:#fff;color:#5b7086;cursor:grab;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:6px 0;font-size:13px;line-height:1;touch-action:none;box-shadow:0 1px 3px rgba(0,0,0,.12)}
  .bl-move:active{cursor:grabbing}
  .bl-move span{pointer-events:none}
  .bl-move .ar{font-size:10px}
  .bl-move .gr{font-size:12px;color:#93a1b3}
  .bl-reorder:hover{background:#f2f4f7;color:var(--ink)}
  .bl-reorder:active{cursor:grabbing;background:#eaf1fb}
  .bl-ctrl{grid-area:ctrl;display:flex;flex-direction:column;gap:6px;min-width:104px;align-self:stretch;justify-content:space-between}
  .bl-antall{position:relative}
  .bl-antall label{font-size:11px;color:var(--ink-soft)}
  .bl-antsel{width:100%;padding:6px 10px;border:1px solid #8fc3ef;border-radius:8px;background:#d6ebff;font-weight:600;color:var(--ink);font-size:13.5px}
  .bl-trykk-wrap{position:relative;width:100%}
  .bl-trykk{width:100%;padding:6px 10px;border:1px solid #8fc3ef;border-radius:8px;background:#d6ebff;font-weight:600;color:var(--ink);cursor:pointer;font-size:13.5px}
  .bl-cta{width:100%;border-radius:8px;padding:6px 10px;font-weight:700;font-size:13px;cursor:pointer;border:1px solid transparent;text-align:center}
  .bl-cta.go{background:var(--good);color:#fff}
  .bl-cta.ghost{background:#fff;border-color:var(--line);color:var(--ink);font-weight:600}
  .bl-antsel:focus{outline:none;border-color:#d9c14a;box-shadow:0 0 0 3px rgba(224,196,60,.28)}
  @keyframes antflash{0%,100%{background:#d6ebff}50%{background:#ffffff}}@media(prefers-reduced-motion:reduce){}
  .bl-arrow{position:absolute;left:50%;top:-15px;transform:translateX(-50%);color:#e2001a;font-size:16px;pointer-events:none;font-weight:700}
  .bl-band{grid-area:band;min-width:0;position:relative;align-self:stretch}
  .bl-bandimg{position:relative;min-width:0;height:100%}
  .bl-act{grid-area:act;display:flex;flex-direction:column;gap:6px;align-self:stretch;min-width:100px}
  .bl-del{border:1px solid var(--line);background:#fff;color:#b23b3b;border-radius:8px;padding:6px 12px;font-weight:600;font-size:13px;cursor:pointer}
  .bl-del:hover{background:#fff2f2;border-color:#e0b4b4}
  .bl-cart{flex:1;border:1px solid transparent;background:#3a8dd6;color:#fff;border-radius:8px;padding:8px 10px;font-weight:400;font-size:13.5px;cursor:pointer;line-height:1.3;text-align:center}
  .bl-band img{width:100%;height:100%;object-fit:fill;display:block;border:1px solid var(--line);border-radius:0}
  .bl-actions{grid-area:act;display:flex;gap:10px;flex-wrap:wrap;justify-self:end}
  .bl-btn{background:#e7f1fc;color:#0a5bb0;border:1px solid #b9d6f2;padding:8px 14px;border-radius:9px;cursor:pointer;font-weight:600;font-size:13.5px}
  .bl-btn:hover{background:#d7e8fb;border-color:#8ec0ee}
  @keyframes blbounce{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,7px)}}
  .bl-arrow.arrow-anim{animation:blbounce .45s ease 5}
  @media (prefers-reduced-motion:reduce){.bl-arrow.arrow-anim{animation:none}}
  .design-backdrop{position:fixed;inset:0;background:rgba(18,23,33,.55);z-index:900;display:none}
  .design-backdrop.show{display:block}
  #resultArea.as-modal,#designChoice.as-modal{position:fixed;top:5vh;left:0;right:0;margin:0 auto;width:min(1180px,96vw);max-height:86vh;z-index:1000;overflow:auto;background:#eef1f6;box-shadow:0 24px 70px rgba(0,0,0,.30);will-change:transform,opacity}
  #designChoice.as-modal{width:min(680px,94vw)}
  #resultArea h2{display:flex;align-items:center;gap:12px}
  .btn-back:hover{color:var(--ink);text-decoration:underline}
  .pvstage{background:#fff;border-radius:12px;padding:14px 8px 10px;text-align:center}
  .pvstage .qtycap{color:var(--ink);margin-top:10px}
  .pricebox{background:#f2f4f7;border-radius:10px;padding:10px 12px;margin:2px 0 12px}
  .pricebox .showall{width:100%;margin-top:8px}
  .alldlg{border:none;border-radius:14px;padding:0;max-width:900px;width:92vw}
  .keep-dlg{border:none;border-radius:14px;padding:0;max-width:760px;width:92vw}
  .keep-dlg .dhead{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--line)}
  .keep-dlg .dhead h3{margin:0}
  .keep-body{padding:12px 16px;max-height:70vh;overflow:auto;display:flex;flex-direction:column;gap:10px}
  .keep-row{display:flex;align-items:center;gap:12px;padding:8px 10px;border:1px solid var(--line);border-radius:10px;cursor:pointer;background:#fff}
  .keep-row:hover{background:#eef5fd;border-color:#8ec0ee}
  .keep-row img{flex:1;min-width:0;width:100%;height:auto;border:1px solid var(--line);border-radius:6px;display:block}
  .keep-row .keep-lbl{flex:0 0 auto;font-weight:600;font-size:13px;white-space:nowrap;color:var(--ink)}
  .multi-hint{position:absolute;top:54px;left:50%;transform:translateX(-50%);background:#10222e;color:#fff;font-size:13px;padding:8px 14px;border-radius:20px;z-index:30;box-shadow:0 6px 18px rgba(0,0,0,.32);max-width:90%;text-align:center}
  .multi-hint b{color:#7fe4ee}
  .alldlg .dhead{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--line)}
  .alldlg .dhead h3{margin:0}
  .xclose{border:none;background:none;font-size:26px;line-height:1;cursor:pointer;color:#5b7086}
  .allbody{padding:10px 16px;max-height:70vh;overflow:auto}
  .allrow{display:flex;align-items:center;gap:12px;padding:3px 0}
  .allrow img{flex:1;min-width:0;width:100%;height:auto;border:1px solid var(--line);border-radius:4px;display:block}
  .allqty{flex:0 0 auto;font-weight:700;white-space:nowrap;font-size:14px}
  .allfoot{padding:12px 16px;border-top:1px solid var(--line);text-align:right}
  .zones{display:flex;font-size:11px;font-weight:600;margin-top:8px}
  .zones.hidden{display:none}
  .zones .z{padding:3px 6px;text-align:center;border-top:2px solid transparent}
  .zones .lock{flex:0 0 12%}
  .zones .vis{flex:1;border-top-color:var(--good);color:var(--good)}
  .zones .ovl{flex:0 0 20%;border-top-color:var(--amber);color:var(--amber);background:repeating-linear-gradient(45deg,rgba(184,134,11,.10),rgba(184,134,11,.10) 4px,transparent 4px,transparent 8px)}
  .ovlline,.ovlshade{display:none;position:absolute;top:0;bottom:0;pointer-events:none;z-index:1}
  .band.guides .ovlshade{display:block;left:77.27%;right:0;background:repeating-linear-gradient(45deg,rgba(120,120,120,.14),rgba(120,120,120,.14) 5px,transparent 5px,transparent 10px)}
  .band.guides .ovlline{display:block;left:77.27%;width:0;border-left:2px dashed rgba(120,120,120,.9)}
  .hidden{display:none!important}
  @media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

  /* v72 mobil: bånd-linje stables (antall/trykk + kurv OVER, bånd full bredde) */
  @media (max-width:640px){
    .bandline{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"ctrl move" "band band" "act act";gap:8px;align-items:center}
    .bl-ctrl{flex-direction:row;flex-wrap:nowrap;gap:8px;align-self:center;min-width:0}
    .bl-ctrl>*{flex:1 1 0;min-width:0}
    .bl-move{flex-direction:row;width:auto;min-height:0;height:auto;align-self:center;justify-content:center;gap:16px;padding:5px 12px}
    .bl-act{min-width:0;align-self:stretch}
    .bl-cart{flex:1;white-space:nowrap;padding:9px 12px;line-height:1.2;font-size:14px}
    .bl-band,.bl-bandimg{align-self:stretch;height:auto}
    .bl-band img{height:auto;aspect-ratio:250/20}
  }
  /* v72 mobil: snu-telefonen-beskjed i designeren (kun stående) */
  .rotmsg{display:none}
  @media (max-width:820px) and (orientation:portrait){
    #resultArea.as-modal .rotmsg:not(.dismissed){display:flex;position:absolute;inset:0;z-index:20;background:rgba(14,15,21,.94);color:#fff;align-items:center;justify-content:center;text-align:center;border-radius:12px;padding:22px}
  }
  .rotmsg-in{max-width:280px;display:flex;flex-direction:column;gap:10px;align-items:center}
  .rotmsg-ic{font-size:46px;line-height:1;animation:rotwig 1.7s ease-in-out infinite}
  .rotmsg-in b{font-size:18px}
  .rotmsg-in small{color:#c7d0da;font-size:13px;line-height:1.4}
  @keyframes rotwig{0%,55%{transform:rotate(0)}80%,100%{transform:rotate(90deg)}}
  @media (prefers-reduced-motion:reduce){.rotmsg-ic{animation:none}}
  .rotmsg-x{margin-top:4px;background:#fff;color:#12324e;border:none;border-radius:8px;padding:9px 18px;font-weight:600;cursor:pointer;font-size:14px}
  .tbtn.on{background:#0069b4;color:#fff;border-color:#0069b4;font-weight:700}
  /* v75 touch: verktøylinja stables i familie-rader m/ tekst-etikett (ingen muspeker på mobil) */
  @media (pointer:coarse){
    .edit-right .tbtn{height:80px;min-height:0;flex-basis:108px}
    .edit-right .tbtn .tlbl{font-size:13px}
    .edit-left .create-row>.tbtn{min-height:50px}
  }
  /* v77 designer: to kolonner (venstre legg til/rediger, høyre like verktøyknapper) */
  .edit-cols{display:flex;flex-wrap:wrap;gap:16px;margin-top:12px;align-items:stretch}
  .edit-left{flex:1 1 0;min-width:300px;display:flex;flex-direction:column;gap:10px;background:#f7fafd;border:1px solid var(--line);border-radius:12px;padding:12px}
  .edit-left .create-row{display:flex;gap:8px}
  .edit-left .create-row>.tbtn{flex:0 0 auto}
  .edit-left .create-row .inksel{flex:0 0 auto;width:auto;min-width:92px;max-width:140px}
  .edit-left #tFont{width:100%}
  .edit-left>#keepInDesign,.edit-left>.inksel{width:100%}
  .edit-left #textCtrls,.edit-left #logoCtrls{margin-top:2px}
  .edit-right{flex:1 1 0;min-width:320px;display:flex;flex-direction:column;gap:0;background:#f7fafd;border:1px solid var(--line);border-radius:12px;padding:12px}
  .band-helpers{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
  .band-helpers .tbtn{flex:0 0 auto;flex-direction:row;min-height:34px;padding:6px 12px;gap:6px;font-size:15px;background:#eef3f9}
  .band-helpers .tbtn .tlbl{font-size:12px}
  .band-helpers .tbtn svg{width:18px;height:18px}
  .edit-right .tgrp{background:none;border:none;box-shadow:none;padding:10px 0;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
  .edit-right .tgrp+.tgrp{border-top:1px solid var(--line)}
  .edit-right .tbtn{flex:0 0 104px;height:72px;min-height:0;flex-direction:column;gap:5px;justify-content:center;align-items:center;white-space:normal;line-height:1.12;text-align:center;padding:6px;font-size:16px}
  .edit-right .tbtn .tlbl{font-size:12px;font-weight:600}
  .edit-right .tbtn svg{width:22px;height:22px}
  /* v79 design-løft: seksjons-overskrifter, OK-knapp, tittel */
  .sec-hdr{font-size:11.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:#8494a6;margin:0 0 2px}
  #step4title{text-transform:uppercase;letter-spacing:.04em;font-size:15px;color:#5b7086}
  .ink-ok{margin-top:6px;background:#0069b4;color:#fff;border:none;border-radius:8px;padding:6px 18px;font-weight:600;cursor:pointer;font-size:13px}
  .edit-right .tbtn{background:#fff}
  .band-helpers .tbtn{background:#f4f7fb}
  /* v80: tekst/logo-panel som nedrullende gardin + Angre/Gjør om/Slett nederst i høyre kort */
  .edit-left #textCtrls,.edit-left #logoCtrls{background:#fff;border:1px solid var(--line);border-radius:10px;padding:12px;margin-top:2px}
  #textCtrls:not(.hidden),#logoCtrls:not(.hidden){animation:curtain .3s ease}
  @keyframes curtain{from{opacity:.25;clip-path:inset(0 0 100% 0)}to{opacity:1;clip-path:inset(0 0 0 0)}}
  @media (prefers-reduced-motion:reduce){#textCtrls:not(.hidden),#logoCtrls:not(.hidden){animation:none}}
  .edit-right .band-helpers{margin-top:0;border-top:1px solid var(--line);padding:10px 0 0}
  /* v81: Stil som symbol-knapper til høyre for Font */
  .font-row{display:flex;gap:12px;align-items:flex-end;margin-top:12px}
  .font-col{flex:0 0 220px;min-width:0}
  .font-col select{width:100%}
  .style-col{flex:0 0 auto}
  .stylebtns{display:flex;gap:6px;margin-top:2px}
  .stylebtns button{width:42px;height:40px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink);font-size:17px;cursor:pointer;line-height:1}
  .stylebtns button.on{background:var(--accent);color:#fff;border-color:var(--accent)}
  /* v82: blå create-knapper */
  .edit-left .create-row>.tbtn{background:#2f86cc;color:#fff;border-color:#2f86cc}
  .edit-left .create-row>.tbtn:hover{background:#2373b3;border-color:#2373b3;color:#fff}

/* v83: tre tydelig skilte designerpaneler + kompakte produktkontroller */
.edit-cols{display:grid;grid-template-columns:minmax(300px,1.05fr) minmax(320px,1.08fr) minmax(280px,.9fr);gap:18px;align-items:stretch}
.edit-left,.edit-right,.edit-simple{min-width:0;background:#f7fafd;border:1px solid #bfc7d0;border-radius:16px;padding:14px;box-shadow:0 0 14px rgba(45,50,56,.42),0 5px 12px rgba(15,34,51,.12)}
.edit-simple{display:flex;flex-direction:column;gap:8px}
.edit-left .create-row{flex-wrap:wrap}
.edit-left .ink-row{display:flex;align-items:center;margin-top:-2px}
.edit-left .ink-row .inksel{width:auto;min-width:130px;max-width:180px}
.edit-left #logoCtrls input[type=range]{width:min(260px,100%)}
.simple-intro{margin:2px 0 4px;color:#5b6572;font-size:12px;line-height:1.45}
.simple-btn{width:100%;display:flex;align-items:flex-start;gap:10px;text-align:left;background:#fff;border:1px solid #d8dee7;border-radius:10px;padding:11px 12px;cursor:pointer;color:#222;box-shadow:0 1px 2px rgba(15,34,51,.04)}
.simple-btn:hover{border-color:#9fc3ec;background:#f8fbff}
.simple-btn>b{font-size:19px;line-height:1.15;width:24px;text-align:center;flex:0 0 24px}
.simple-btn span{display:flex;flex-direction:column;gap:4px}
.simple-btn strong{font-size:13px;line-height:1.25}
.simple-btn small{font-size:11px;line-height:1.35;color:#687583;font-weight:400}
.edit-right .center-btn:not(:disabled){border-color:#2f8ef0;box-shadow:0 0 0 2px rgba(47,142,240,.14)}
@media(max-width:1050px){.edit-cols{grid-template-columns:1fr 1fr}.edit-simple{grid-column:1/-1}}
@media(max-width:720px){.edit-cols{grid-template-columns:1fr}.edit-simple{grid-column:auto}}
nn/* v84: kompakt tekstil-fargepanel + responsiv designer uten intern hovedscroll */n.edit-cols{grid-template-columns:minmax(330px,1.16fr) minmax(315px,1fr) minmax(275px,.88fr);gap:16px}n.weave-wrap{padding:10px!important;margin-top:8px!important}n.weave-hdr{font-size:13px!important;margin-bottom:5px!important}n.weave-row{display:grid!important;grid-template-columns:38px 38px minmax(0,1fr) 58px!important;align-items:center!important;gap:6px!important;min-height:30px!important}n.weave-head{min-height:20px!important}n.weave-head .weave-hex{grid-column:3/5}n.weave-sw{width:22px!important;height:22px!important;border-radius:5px!important}n.weave-pick{width:24px!important;height:24px!important;min-width:24px!important;padding:0!important;border-radius:6px!important;cursor:pointer;transition:transform .14s ease,box-shadow .14s ease,filter .14s ease}n.weave-pick:hover,.weave-pick:focus-visible{transform:scale(1.16);box-shadow:0 0 0 3px rgba(47,142,240,.24),0 0 10px rgba(47,142,240,.65);filter:saturate(1.08);outline:none}n.weave-hex{font-size:12px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}n.weave-hcol{font-size:9.5px!important}n.weave-note{font-size:11px!important;margin-top:4px!important}n.weave-vis{font-size:11.5px!important;padding:6px 10px!important;margin-top:5px!important}n.weave-row-vis{border:1px solid #9fc7f3;background:#fff;color:#1878d1;border-radius:8px;padding:4px 7px;font-size:11px;font-weight:700;cursor:pointer}n.weave-row-vis:hover{background:#f2f8ff;border-color:#2f8ef0}n/* Stor visning: ett valgt fargelag per klikk. */n.weave-big{width:min(1180px,94vw)!important;height:min(720px,86vh)!important;max-height:86vh!important}n.weave-big-img{min-height:0!important}n.weave-big-img img{max-width:96%!important;max-height:96%!important}n/* Hold selve designmodalen innenfor skjermen; komprimer heller kontroller ved lav høyde. */n.editor-modal,.design-modal,.editor-card{max-height:calc(100vh - 28px)!important}n@media(max-height:900px) and (min-width:721px){n  .edit-left,.edit-right,.edit-simple{padding:10px!important}n  .edit-cols{gap:12px!important}n  .edit-right .tgrp{padding:6px 0!important;gap:6px!important}n  .edit-right .tbtn{height:60px!important;flex-basis:92px!important;padding:4px!important}n  .edit-right .tbtn .tlbl{font-size:11px!important}n  .simple-btn{padding:8px 9px!important;gap:7px!important}n  .simple-btn strong{font-size:12px!important}.simple-btn small{font-size:10px!important}n  .simple-intro{font-size:11px!important;margin:0 0 2px!important}n  .edit-left #textCtrls,.edit-left #logoCtrls{padding:8px!important}n  .weave-wrap{padding:7px!important}.weave-row{min-height:26px!important}.weave-sw{width:19px!important;height:19px!important}.weave-pick{width:21px!important;height:21px!important;min-width:21px!important}n}n@media(max-height:760px) and (min-width:721px){n  .edit-left,.edit-right,.edit-simple{padding:8px!important}.edit-cols{gap:9px!important}n  .edit-right .tbtn{height:52px!important;flex-basis:84px!important}.sec-hdr{font-size:10px!important}n  .simple-btn{padding:6px 8px!important}.simple-btn small{display:none}n}n@media (prefers-reduced-motion:reduce){.weave-pick{transition:none}.weave-pick:hover,.weave-pick:focus-visible{transform:none}}n

/* v85: designer skal passe i viewport + produksjonsvennlig kompakt tekstilpanel */
#resultArea.as-modal{top:2vh!important;max-height:96vh!important;overflow:hidden!important}
#resultArea.as-modal>.body{padding-top:10px!important;padding-bottom:10px!important}
@media(max-height:900px) and (min-width:721px){
  #resultArea.as-modal h2{margin:0!important;padding:9px 14px!important;font-size:18px!important}
  #resultArea.as-modal>.body{padding:7px 12px!important}
  #resultArea.as-modal .selhint,#resultArea.as-modal #step4hint{display:none!important}
  #resultArea.as-modal .stage{padding:8px 10px!important;border-radius:10px!important}
  #resultArea.as-modal .edit-cols{margin-top:7px!important;gap:9px!important}
  #resultArea.as-modal .edit-left,#resultArea.as-modal .edit-right,#resultArea.as-modal .edit-simple{padding:8px!important;border-radius:12px!important}
  #resultArea.as-modal .create-row{gap:5px!important}
  #resultArea.as-modal .create-row>.tbtn{min-height:38px!important;padding:6px 9px!important;font-size:12px!important}
  #resultArea.as-modal .ink-row{margin-top:-4px!important}
  #resultArea.as-modal .inksel{min-height:34px!important;font-size:12px!important}
  #resultArea.as-modal #inkNote{font-size:10px!important;line-height:1.15!important}
  #resultArea.as-modal .edit-left #logoCtrls{padding:6px!important;margin-top:0!important}
  #resultArea.as-modal .edit-left #logoCtrls .lbl{font-size:11px!important;margin-bottom:2px!important}
  #resultArea.as-modal .edit-left #logoCtrls .muted{font-size:10px!important;margin-top:2px!important}
  #resultArea.as-modal .weave-wrap{padding:6px!important;margin-top:5px!important}
  #resultArea.as-modal .weave-row{min-height:23px!important;grid-template-columns:31px 31px minmax(0,1fr) 50px!important;gap:4px!important}
  #resultArea.as-modal .weave-sw{width:17px!important;height:17px!important}.weave-pick{width:19px!important;height:19px!important;min-width:19px!important}
  #resultArea.as-modal .weave-hex{font-size:10.5px!important}.weave-row-vis{font-size:10px!important;padding:3px 5px!important}
  #resultArea.as-modal .weave-note{font-size:9.5px!important}.weave-vis{font-size:10px!important;padding:4px 7px!important}
  #resultArea.as-modal .edit-right .tgrp{padding:4px 0!important;gap:5px!important}
  #resultArea.as-modal .edit-right .tbtn{height:48px!important;flex-basis:78px!important;font-size:13px!important;gap:2px!important}
  #resultArea.as-modal .edit-right .tbtn svg{width:17px!important;height:17px!important}.edit-right .tbtn .tlbl{font-size:9.5px!important}
  #resultArea.as-modal .band-helpers{padding-top:5px!important}
  #resultArea.as-modal .simple-intro{font-size:10px!important;margin:0 0 3px!important}
  #resultArea.as-modal .simple-btn{padding:5px 7px!important;min-height:0!important;gap:5px!important}
  #resultArea.as-modal .simple-btn strong{font-size:10.5px!important}.simple-btn small{font-size:9px!important;line-height:1.15!important}
  #resultArea.as-modal .resActions{margin-top:6px!important;gap:6px!important}
}
@media(max-height:760px) and (min-width:721px){
  #resultArea.as-modal{top:1vh!important;max-height:98vh!important}
  #resultArea.as-modal h2{padding:6px 12px!important;font-size:16px!important}
  #resultArea.as-modal>.body{padding:5px 10px!important}
  #resultArea.as-modal .stage{padding:5px 8px!important}
  #resultArea.as-modal .edit-cols{margin-top:5px!important;gap:7px!important}
  #resultArea.as-modal .sec-hdr{font-size:9px!important;margin-bottom:3px!important}
  #resultArea.as-modal .edit-right .tbtn{height:42px!important;flex-basis:72px!important}
  #resultArea.as-modal .simple-btn small{display:none!important}
}


/* v86: justerbart detaljnivaa for fysisk vev */
.weave-detail{grid-column:1/-1;padding:5px 2px 7px;margin-bottom:3px;border-bottom:1px solid #dce4ec}
.weave-detail-top{display:flex;justify-content:space-between;align-items:center;font-size:11px;font-weight:750;color:#243746;margin-bottom:2px}
.weave-detail-line{display:grid;grid-template-columns:auto minmax(90px,1fr) auto;align-items:center;gap:6px;font-size:9.5px;color:#71808e}
.weave-detail-line input{width:100%;height:16px;accent-color:#2f8ef0;cursor:pointer}
@media(max-height:900px) and (min-width:721px){.weave-detail{padding:2px 1px 4px}.weave-detail-top{font-size:10px}.weave-detail-line{font-size:8.5px;gap:4px}.weave-detail-line input{height:13px}}
/* linje76: punktzoom + traad-farge-kalibrering */
.zoom-point{min-width:42px!important;font-weight:800}.zoom-point.active{background:#1677e8!important;color:#fff!important;box-shadow:0 0 0 3px rgba(22,119,232,.18)}
.design-zoom-wrap.point-zoom,.design-zoom-wrap.point-zoom *{cursor:zoom-in!important}
.weave-actions{display:flex;gap:6px;flex-wrap:wrap;margin-top:4px}.weave-cal-btn{border:1px solid #2f8ef0;background:#fff;color:#176fc2;border-radius:8px;padding:5px 8px;font-weight:750;font-size:10px;cursor:pointer}.weave-cal-btn:hover{background:#eef7ff}
.thread-cal-ov{position:fixed;inset:0;z-index:16000;background:rgba(10,16,24,.62);display:none;align-items:center;justify-content:center;padding:2vh 2vw}.thread-cal-ov.open{display:flex}.thread-cal{position:relative;width:min(1120px,96vw);max-height:94vh;overflow:auto;background:#f8fafc;border-radius:18px;padding:18px;box-shadow:0 28px 90px rgba(0,0,0,.38)}.thread-cal h3{margin:0 40px 4px 0;font-size:22px}.thread-cal>p{margin:0 0 14px;color:#526273;max-width:850px}.thread-cal-x{position:absolute;right:14px;top:12px;border:0;background:#fff;border-radius:9px;width:34px;height:34px;font-size:24px;cursor:pointer;box-shadow:0 2px 9px #0002}.thread-cal-body{display:grid;grid-template-columns:minmax(280px,.8fr) minmax(420px,1.5fr);gap:16px}.thread-cal-palette{display:grid;grid-template-columns:1fr 1fr;gap:7px}.thread-color{display:flex;align-items:center;gap:8px;border:1px solid #d8e0e8;background:#fff;border-radius:9px;padding:7px;cursor:pointer;font-size:12px}.thread-color:has(input:checked){border-color:#2589ee;box-shadow:0 0 0 2px rgba(37,137,238,.13)}.thread-color input{accent-color:#2589ee}.thread-color-sw{width:24px;height:24px;border-radius:6px;border:1px solid #0002;flex:none}.thread-stroke{margin-top:14px;background:#fff;border:1px solid #d8e0e8;border-radius:10px;padding:11px}.thread-stroke label{display:flex;justify-content:space-between;font-weight:750;font-size:12px}.thread-stroke input{width:100%;accent-color:#2589ee}.thread-stroke>div{display:flex;justify-content:space-between;color:#71808e;font-size:9px}.thread-cal-preview{background:#eef2f6;border-radius:12px;padding:12px;display:flex;flex-direction:column;justify-content:center}.thread-cal-band{background:#fff;min-height:150px;display:flex;align-items:center;justify-content:center;overflow:auto;border-radius:8px}.thread-cal-band img{display:block;width:100%;height:auto;image-rendering:auto}.thread-cal-preview small{margin-top:7px;color:#687887}.thread-cal-foot{display:flex;justify-content:flex-end;align-items:center;gap:12px;margin-top:14px;font-weight:750}.thread-cal-ok{border:0;background:#0a9c69;color:#fff;border-radius:10px;padding:10px 28px;font-weight:800;cursor:pointer}
@media(max-width:800px){.thread-cal-body{grid-template-columns:1fr}.thread-cal-palette{grid-template-columns:1fr 1fr}.thread-cal-band{min-height:90px}}
@media(max-height:820px) and (min-width:721px){.thread-cal{padding:11px;max-height:97vh}.thread-cal h3{font-size:17px}.thread-cal>p{font-size:11px;margin-bottom:7px}.thread-color{padding:4px}.thread-color-sw{width:18px;height:18px}.thread-stroke{margin-top:7px;padding:7px}.thread-cal-band{min-height:100px}.thread-cal-foot{margin-top:7px}}

/* linje78: fullbredde tråd-preview + unike detaljsnapshots + punktzoom */
.thread-cal{width:min(1260px,97vw);max-height:95vh;overflow:auto}
.thread-cal-overview{background:#eef2f6;border-radius:12px;padding:10px;margin:10px 0 14px}
.thread-cal-overview .thread-cal-band{background:#fff;min-height:115px;width:100%;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:8px}
.thread-cal-overview .thread-cal-band img{display:block;width:100%;height:auto;max-height:190px;object-fit:contain}
.thread-cal-overview small{display:block;margin-top:5px;color:#687887}
.thread-cal-body{grid-template-columns:minmax(280px,.72fr) minmax(520px,1.55fr);align-items:start}
.thread-cal-details{background:#eef2f6;border-radius:12px;padding:10px;min-width:0}.thread-cal-details h4{margin:0 0 2px;font-size:15px}.thread-cal-details>p{margin:0 0 8px;color:#687887;font-size:11px}
.thread-cal-snaps{display:flex;flex-direction:column;gap:9px}.thread-snap{background:#fff;border:1px solid #d8e0e8;border-radius:10px;padding:8px}.thread-snap-title{font-weight:750;font-size:11px;margin-bottom:5px;color:#334155}.thread-snap-img{height:150px;background:#111;border-radius:7px;display:flex;align-items:center;justify-content:center;overflow:hidden;color:#9aa4b2;font-size:11px}.thread-snap-img img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}
.design-zoom-wrap.zoom-tool{cursor:zoom-in}.design-zoom-wrap.zoom-out-tool{cursor:zoom-out}.design-zoom-wrap.zoom-tool *{cursor:inherit!important}.zoom-point{min-width:46px!important}.zoom-point.active{background:#1677e8!important;color:#fff!important;box-shadow:0 0 0 3px rgba(22,119,232,.18)}
@media(max-width:800px){.thread-cal-body{grid-template-columns:1fr}.thread-snap-img{height:120px}}
@media(max-height:820px) and (min-width:721px){.thread-cal-overview{margin:5px 0 7px;padding:6px}.thread-cal-overview .thread-cal-band{min-height:72px}.thread-cal-overview .thread-cal-band img{max-height:110px}.thread-snap-img{height:105px}.thread-cal-snaps{gap:5px}.thread-cal-details{padding:7px}}

/* linje79: kompakt zoomverktøy + Illustrator-lignende redigeringspil */
.zoom-point.zoom-edit{min-width:36px!important;width:36px!important;padding:0!important;display:inline-flex!important;align-items:center;justify-content:center}
.zoom-arrow{display:block;width:0;height:0;border-top:0 solid transparent;border-bottom:17px solid transparent;border-left:11px solid #111;transform:rotate(-12deg);filter:drop-shadow(0 1px 0 #fff)}
.zoom-point.zoom-edit.active .zoom-arrow{border-left-color:#111}
.zoom-point.zoom-reset{min-width:38px!important;width:38px!important;padding:0 5px!important;font-size:12px!important;line-height:1!important}
.thread-cal-ok{font-size:13px!important;padding:9px 22px!important}

/* Linje 80: eksplisitt regenerering av tråd-forhåndsvisning */
.thread-cal-refresh{width:100%;margin-top:10px;border:0;border-radius:9px;background:#2589ee;color:#fff;padding:10px 12px;font-weight:800;cursor:pointer;box-shadow:0 2px 7px rgba(37,137,238,.18)}
.thread-cal-refresh:hover{filter:brightness(.97)}.thread-cal-refresh:disabled{opacity:.65;cursor:wait}
.thread-stroke small{display:block;margin-top:6px;color:#71808e;font-size:10px;line-height:1.3}


/* Bugfix 109: produkter uten toppvalg i designeren (Tyvek/plast/vinyl/refleks)
   trenger samme vertikale klaring mellom modal-header og båndflate som produkter
   som naturlig får en ekstra valgrad. Holder X over hjelp-knappen i stedet for oppå. */
#resultArea.as-modal.designer-uten-toppvalg>.body{padding-top:42px!important}
@media(max-height:760px) and (min-width:721px){
  #resultArea.as-modal.designer-uten-toppvalg>.body{padding-top:36px!important}
}


/* Bugfix 110: designer header + oppdatert hjelpemanual */
#resultArea.as-modal #helpBtn{position:fixed!important;top:calc(2vh + 12px)!important;right:calc(2vw + 54px)!important;z-index:1007!important}
#helpDlg .dhead{display:flex;align-items:center;justify-content:space-between;gap:16px}
#helpDlg .dhead .xclose{margin-left:auto}
#helpDlg{width:min(760px,92vw);max-height:86vh}
#helpDlg .helpbody{max-width:none;overflow:auto}
.help-tool-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:6px 0 12px}
.help-tool{display:flex;align-items:flex-start;gap:9px;border:1px solid #d8dee7;border-radius:9px;background:#fff;padding:8px 10px}
.help-tool>span:last-child{display:flex;flex-direction:column;gap:2px}
.help-tool small{color:#687583;font-size:11px;line-height:1.3}
.help-chip{width:27px;height:27px;flex:0 0 27px;display:grid;place-items:center;border:1px solid #d8dee7;border-radius:7px;background:#f4f7fb;font-weight:800;color:#263746}
@media(max-width:720px){.help-tool-grid{grid-template-columns:1fr}}
/* Litt mer luft over båndflaten for produktene uten egen toppvalgsrad. */
#resultArea.as-modal.designer-uten-toppvalg .stage{padding-top:18px!important}


/* Bugfix 111: ? ligger i samme headerlinje mellom "Behold design fra …" og X. */
#resultArea.as-modal #helpBtn{
  position:absolute!important;
  top:12px!important;
  right:54px!important;
  width:32px!important;
  height:32px!important;
  z-index:1007!important;
}
#resultArea.as-modal #keepInDesign{
  margin-right:44px!important;
}
@media(max-height:760px) and (min-width:721px){
  #resultArea.as-modal #helpBtn{top:6px!important}
}


/* L112 v2: ingen DOM-endring. Behold eksisterende modalbredde/layout.
   Hjelp-? plasseres absolutt mot selve resultArea, rett til venstre for X. */
#resultArea.as-modal{position:fixed!important}
#resultArea.as-modal #helpBtn{
  position:absolute!important;
  top:12px!important;
  right:52px!important;
  left:auto!important;
  width:32px!important;
  height:32px!important;
  margin:0!important;
  z-index:1007!important;
  display:grid!important;
}
@media(max-height:760px) and (min-width:721px){
  #resultArea.as-modal #helpBtn{top:6px!important}
}
/* Kun litt ekstra luft INNE i stage; endrer ikke modalens bredde/grid. */
#resultArea.as-modal.designer-uten-toppvalg .stage{padding-top:30px!important}
@media(max-height:760px) and (min-width:721px){
  #resultArea.as-modal.designer-uten-toppvalg .stage{padding-top:26px!important}
}


/* L113: korriger ? uten DOM-endring. Stage er containing block, saa plasser den
   i stage-hjoernet som visuelt tilsvarer headeren, ikke ute paa baandet. */
#resultArea.as-modal .stage #helpBtn{
  position:absolute!important;
  top:-54px!important;
  right:44px!important;
  left:auto!important;
  width:32px!important;
  height:32px!important;
  margin:0!important;
  z-index:1008!important;
  display:grid!important;
}
@media(max-height:760px) and (min-width:721px){
  #resultArea.as-modal .stage #helpBtn{top:-48px!important}
}
/* Egen toppsone inne i stage til omraadeteksten. */
#resultArea.as-modal.designer-uten-toppvalg .stage{padding-top:42px!important}


/* L114: finjustering – ? skal ha samme vertikale senterlinje som headerknappene. */
#resultArea.as-modal .stage #helpBtn{
  top:-70px!important;
}
@media(max-height:760px) and (min-width:721px){
  #resultArea.as-modal .stage #helpBtn{top:-64px!important}
}


/* L115: siste header-finjustering – ? litt nærmere X. */
#resultArea.as-modal .stage #helpBtn{right:30px!important}


/* L116: stage-boksen skal selv eie toppteksten + luft over/under baandet.
   Header/? fra L115 roeres ikke. */
#resultArea.as-modal.designer-uten-toppvalg .stage{
  padding-top:54px!important;
  padding-bottom:18px!important;
}


/* L117: faktisk flytt selve baandet NED inne i stage-boksen.
   Padding alene flyttet ikke det posisjonerte baandet. */
#resultArea.as-modal.designer-uten-toppvalg .stage{padding-top:22px!important}
#resultArea.as-modal.designer-uten-toppvalg #bigBand{
  transform:translateY(28px)!important;
  margin-bottom:46px!important;
}


/* L118: finpuss av godkjent L117-geometri.
   Litt mindre luft mellom modalheader og indre stage, litt mer luft INNE i stage-toppen. */
#resultArea.as-modal.designer-uten-toppvalg>.body{padding-top:28px!important}
#resultArea.as-modal.designer-uten-toppvalg #bigBand{
  transform:translateY(34px)!important;
  margin-bottom:52px!important;
}


/* L119 koordinater: KUN posisjon av hjelp-?. Ingen layout/DOM-endring. */
#resultArea.as-modal .stage #helpBtn{
  top:-56px!important;
  right:40px!important;
}
@media(max-height:760px) and (min-width:721px){
  #resultArea.as-modal .stage #helpBtn{top:-50px!important}
}

/* =========================================================
   L310 — Eventro visuell standard: dialoger / modaler
   Kun presentasjon. Ingen dialog-state eller funksjonslogikk.
   ========================================================= */
dialog,
.alldlg,
.keep-dlg,
#helpDlg,
#ovlDlg,
#jsonDlg{
  font-family:var(--font-ui);
  color:var(--ink);
  background:#fff;
  border:1px solid rgba(0,0,0,.10);
  border-radius:12px;
  box-shadow:0 18px 48px rgba(1,37,65,.18),0 3px 10px rgba(1,37,65,.10);
  overflow:hidden;
}
dialog::backdrop{
  background:rgba(1,37,65,.42);
  backdrop-filter:blur(1.5px);
}
dialog .dhead,
.alldlg .dhead,
.keep-dlg .dhead,
#helpDlg .dhead{
  min-height:54px;
  padding:12px 18px;
  background:#f6fcff;
  border-bottom:1px solid rgba(0,0,0,.10);
}
dialog .dhead h3,
.alldlg .dhead h3,
.keep-dlg .dhead h3,
#helpDlg .dhead h3{
  margin:0;
  font-family:var(--font-ui);
  font-size:18px;
  line-height:1.3;
  font-weight:600;
  letter-spacing:normal;
  color:#242424;
}
.xclose{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  flex:0 0 34px;
  padding:0;
  border:1px solid rgba(0,0,0,.10);
  border-radius:50%;
  background:#fff;
  color:#767676;
  font-family:Arial,sans-serif;
  font-size:24px;
  line-height:1;
  box-shadow:none;
  transition:border-color .15s ease,color .15s ease,background .15s ease;
}
.xclose:hover{
  color:#232323;
  border-color:#04a9fc;
  background:#f6fcff;
}
.allbody,
.keep-body,
.helpbody{
  color:#232323;
  font-family:var(--font-ui);
  font-size:16px;
  line-height:1.6;
}
.allfoot,
.keep-dlg .allfoot{
  padding:12px 18px;
  border-top:1px solid rgba(0,0,0,.10);
  background:#fff;
}
#helpDlg .helpbody{padding:18px 20px}
#helpDlg .helpbody .hsub{
  color:#242424;
  font-size:14px;
  font-weight:600;
}
.help-tool{
  border-color:rgba(0,0,0,.10);
  border-radius:12px;
  background:#fff;
  box-shadow:0 1px 2px rgba(1,37,65,.04);
}
.help-tool small{color:#767676}
.help-chip{
  border-color:rgba(0,0,0,.10);
  border-radius:8px;
  background:#f6fcff;
  color:#0284c7;
}
#helpOvl{color:#767676!important}
#ovlDlg>div:not(.dhead){font-family:var(--font-ui);font-size:16px;line-height:1.6;color:#232323}
#ovlLiten{color:#767676!important}


/* =========================================================
   L311 — Hjelpemodal: scrollbar + dokumentasjon av eksisterende tegneverktøy
   Kun presentasjon/manualtekst. Ingen tegne- eller designerlogikk.
   ========================================================= */
#helpDlg{
  max-height:min(86vh,860px);
  display:flex;
  flex-direction:column;
  overflow:hidden;
}
#helpDlg .dhead{
  flex:0 0 auto;
}
#helpDlg .helpbody{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  scrollbar-gutter:stable;
  overscroll-behavior:contain;
}
#helpDlg .helpbody::-webkit-scrollbar{width:11px}
#helpDlg .helpbody::-webkit-scrollbar-track{background:#f6fcff;border-left:1px solid rgba(0,0,0,.06)}
#helpDlg .helpbody::-webkit-scrollbar-thumb{background:#a5a5a5;border:3px solid #f6fcff;border-radius:10px}
#helpDlg .helpbody::-webkit-scrollbar-thumb:hover{background:#767676}
#helpDlg .helpbody{scrollbar-width:thin;scrollbar-color:#a5a5a5 #f6fcff}


/* =========================================================
   L315 — Felles kontrollstandarder på bestillingssiden
   Kun CSS. Funksjonelle tool-buttons beholder egen geometri.
   ========================================================= */
.wrap select,
.wrap input,
.wrap button{
  font-family:"Sora",Arial,Helvetica,sans-serif;
}
.wrap .btn-primary{
  background:#04A9FC;
  color:#fff;
  min-height:42px;
  padding:5px 20px;
  border:0;
  border-radius:5px;
  font-family:"Sora",Arial,Helvetica,sans-serif;
  font-size:13px;
  line-height:15.6px;
  font-weight:600;
  text-transform:uppercase;
  box-shadow:none;
}
.wrap .btn-primary:hover{
  background:#04A9FC;
  filter:brightness(.94);
}


/* L316: CREATE-knapper bruker samme semantiske variant også i designer-CSS. */



/* === L317: Eventro UI compliance — presentation only === */
:root{--ev-surface:#F6FCFF;--ev-text:#232323;--ev-muted:#767676;--ev-primary:#04A9FC;--ev-create:#2F86CC;--ev-create-hover:#2373B3;--ev-confirm:#20B66B;--ev-confirm-hover:#169B5B;--ev-border:rgba(0,0,0,.10);--ev-border2:rgba(0,0,0,.15);--ev-shadow:0 18px 48px rgba(1,37,65,.18),0 3px 10px rgba(1,37,65,.10)}
#resultArea.as-modal,#designChoice.as-modal{background:var(--ev-surface)!important;color:var(--ev-text)!important;border:1px solid var(--ev-border)!important;border-radius:12px!important;box-shadow:var(--ev-shadow)!important}
#resultArea.as-modal>h2,#designChoice.as-modal>h2{background:var(--ev-surface)!important;color:#242424!important;border-bottom:1px solid var(--ev-border)!important;font-family:"Sora",Arial,Helvetica,sans-serif!important;font-weight:600!important}
#resultArea.as-modal>.body{background:var(--ev-surface)!important}
#resultArea.as-modal .stage,#resultArea.as-modal .edit-left,#resultArea.as-modal .edit-right,#resultArea.as-modal .edit-simple{background:#fff!important;border:1px solid var(--ev-border)!important;border-radius:12px!important;box-shadow:0 3px 12px rgba(1,37,65,.08)!important}
#resultArea.as-modal select,#resultArea.as-modal input[type=text],#resultArea.as-modal input[type=number]{font-family:"Sora",Arial,Helvetica,sans-serif!important;color:var(--ev-text)!important;background:#fff!important;border-color:var(--ev-border2)!important;border-radius:5px!important;box-shadow:none!important}
#resultArea.as-modal select:focus,#resultArea.as-modal input[type=text]:focus,#resultArea.as-modal input[type=number]:focus{outline:none!important;border-color:var(--ev-primary)!important;box-shadow:0 0 0 2px rgba(4,169,252,.14)!important}
#resultArea.as-modal input[type=range]{accent-color:var(--ev-primary)!important}

/* help dialog: closed means absent from document flow */
#helpDlg:not([open]){display:none!important}
#helpDlg[open]{display:flex!important;position:fixed!important;inset:50% auto auto 50%!important;transform:translate(-50%,-50%)!important;margin:0!important;width:min(760px,92vw)!important;max-height:86vh!important;z-index:1200!important;flex-direction:column!important;overflow:hidden!important;background:#fff!important;border:1px solid var(--ev-border)!important;border-radius:12px!important;box-shadow:var(--ev-shadow)!important}
#helpDlg[open] .dhead{flex:0 0 auto!important;background:var(--ev-surface)!important}
#helpDlg[open] .helpbody{flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important;overflow-x:hidden!important}

/* common action geometry */

/* create */


/* confirm-next */


/* preview */


/* secondary keep */

/* destructive */
#resultArea.as-modal .btn-dashed-remove{min-height:42px!important;padding:5px 20px!important;border-radius:5px!important;font-family:"Sora",Arial,Helvetica,sans-serif!important;font-size:13px!important;line-height:15.6px!important;font-weight:600!important;text-transform:uppercase!important;background:#fff!important;color:#b23b3b!important;border:1.5px dashed #d98a8a!important;box-shadow:none!important}
#resultArea.as-modal .btn-dashed-remove:hover{background:#fff6f6!important;color:#a02a1c!important;border-color:#c0392b!important}
/* tools stay compact */
#resultArea.as-modal :is(.tbtn,.simple-btn,.zoom-point,.helpbtn,#back4){font-family:"Sora",Arial,Helvetica,sans-serif!important}
#resultArea.as-modal .tbtn{border-color:var(--ev-border)!important;box-shadow:none!important}
#resultArea.as-modal .tbtn:not(:disabled):hover{border-color:rgba(4,169,252,.55)!important}@media(prefers-reduced-motion:reduce){}

/* L319 — bestillingshint: flash på faktisk "venter på valg"-state */
@keyframes evPendingChoiceFlash{0%,100%{background:#F6FCFF}50%{background:#fff}}
.bl-antall:has(> .bl-arrow) > .bl-antsel,
.bl-trykk-wrap:has(> .bl-arrow) > .bl-trykk{
  background:#F6FCFF!important;
  animation:evPendingChoiceFlash .20s ease-in-out 5!important;
}
@media(prefers-reduced-motion:reduce){
  .bl-antall:has(> .bl-arrow) > .bl-antsel,
  .bl-trykk-wrap:has(> .bl-arrow) > .bl-trykk{animation:none!important}
}

/* L320 — AUTORITATIV designer-knappestandard */
:root{--ev-primary:#04A9FC;--ev-create:#2F86CC;--ev-create-hover:#2373B3;--ev-confirm:#20B66B;--ev-confirm-hover:#169B5B}
#resultArea.as-modal :is(#addText,#addLogoBtn,#ferdigBtn){min-height:42px;height:42px;padding:5px 20px;border-radius:5px;font-family:"Sora",Arial,Helvetica,sans-serif;font-size:13px;line-height:15.6px;font-weight:600;letter-spacing:normal;text-transform:uppercase;box-shadow:none}
#resultArea.as-modal :is(#addText,#addLogoBtn){background:var(--ev-create);color:#fff;border:1px solid var(--ev-create)}
#resultArea.as-modal :is(#addText,#addLogoBtn):hover{background:var(--ev-create-hover);border-color:var(--ev-create-hover)}
#resultArea.as-modal #ferdigBtn:not(:disabled){background:var(--ev-confirm);color:#fff;border:1px solid var(--ev-confirm)}
#resultArea.as-modal #ferdigBtn:not(:disabled):hover{background:var(--ev-confirm-hover);border-color:var(--ev-confirm-hover)}