:root{font-family:Avenir Next,Avenir,Helvetica Neue,sans-serif;color:#15261f;background:linear-gradient(180deg,#f9f7f0,#f4efe5);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;--shadow-soft: 0 24px 64px rgba(51, 53, 42, .08);--line: rgba(26, 37, 31, .12);--panel: rgba(255, 251, 245, .94);--panel-strong: rgba(255, 251, 245, .98);--ink-soft: rgba(21, 38, 31, .68)}*{box-sizing:border-box}body{margin:0;min-width:320px}button,input{font:inherit;-moz-appearance:none;appearance:none;-webkit-appearance:none}button{cursor:pointer}.app-shell{min-height:100vh;display:grid;grid-template-columns:minmax(0,1.8fr) minmax(320px,440px);gap:1.5rem;padding:1.5rem}.preview-shell,.control-panel{border:1px solid var(--line);border-radius:30px;background:var(--panel);box-shadow:var(--shadow-soft);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.preview-shell{display:flex;flex-direction:column;gap:1rem;padding:1.75rem}.preview-header{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"identity meta" "identity switcher";column-gap:1rem;row-gap:.45rem;align-items:end}.preview-identity{grid-area:identity;display:grid;gap:.36rem;min-width:0}.eyebrow{margin:0;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);white-space:nowrap;flex:0 0 auto}.title-line{display:flex;align-items:baseline;gap:.65rem;min-width:0;flex-wrap:wrap}.preview-meta{grid-area:meta;margin:0;color:var(--ink-soft);text-align:right;font-size:.82rem;line-height:1;white-space:nowrap;flex:0 0 auto}.product-link{color:var(--ink-soft);font-size:.74rem;line-height:1;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.22rem;white-space:nowrap;transition:color .14s ease}.product-link:hover,.product-link:focus-visible{color:#15261f;outline:none}.line-nav{grid-area:switcher;display:flex;gap:.18rem;align-items:center;justify-content:flex-end;justify-self:end;padding:.2rem;border:1px solid rgba(26,37,31,.1);border-radius:999px;background:#ffffff80}.line-link{display:inline-flex;align-items:center;min-height:30px;padding:.47rem .76rem;border:0;border-radius:999px;color:#15261f;text-decoration:none;font-size:.74rem;line-height:1;transition:background-color .14s ease,border-color .14s ease}.line-link:hover,.line-link:focus-visible{background:#183d3814;outline:none}.line-link[aria-current=page]{background:#183d38;color:#f7f4eb}.preview-frame{display:grid;grid-template-columns:minmax(0,1fr) 16px;grid-template-rows:auto 16px;gap:7px;align-items:stretch;justify-content:stretch;padding:0}.strip-grid{grid-column:1;grid-row:1;width:100%;display:grid;gap:.5px;padding:0}.tile-cell{display:block;width:100%;border:0;padding:0;aspect-ratio:var(--tile-aspect, 1 / 3);border-radius:0;transition:transform .12s ease,box-shadow .12s ease}.tile-cell--raw-rough{background-image:url(/kappa-raw-tile.svg);background-position:center;background-repeat:no-repeat;background-size:100% 100%}.swatch-dot--raw-rough{width:15px;height:36px;border-radius:2px;background-image:url(/kappa-raw-tile.svg);background-position:center;background-repeat:no-repeat;background-size:100% 100%}.tile-cell:hover,.tile-cell:focus-visible{transform:translateY(-1px);box-shadow:0 0 0 1px #15261f47;outline:none}.row-fill-controls{grid-column:2;grid-row:1;display:grid;gap:.5px;align-self:stretch}.column-fill-controls{grid-column:1;grid-row:2;display:grid;gap:.5px}.edge-fill-button{width:100%;height:100%;min-width:0;min-height:0;padding:0;border:0;border-radius:0;background:#15261f29;transition:background-color .12s ease,transform .12s ease}.edge-fill-button:hover,.edge-fill-button:focus-visible{background:#15261f7a;outline:none}.edge-fill-button--row:hover,.edge-fill-button--row:focus-visible{transform:translate(1px)}.edge-fill-button--column:hover,.edge-fill-button--column:focus-visible{transform:translateY(1px)}.control-panel{padding:1.5rem;display:flex;flex-direction:column;gap:1.15rem}.panel-section{display:flex;flex-direction:column;gap:.75rem;padding:1rem;border:1px solid rgba(26,37,31,.08);border-radius:22px;background:var(--panel-strong)}.section-header{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.section-header h2{margin:0;font-size:.82rem;letter-spacing:.18em;text-transform:uppercase}.field-grid{display:grid;gap:.8rem;grid-template-columns:repeat(2,minmax(0,1fr))}.field{display:flex;flex-direction:column;gap:.4rem;font-size:.88rem;color:var(--ink-soft)}.field input{width:100%;padding:.9rem 1rem;border:1px solid rgba(26,37,31,.14);border-radius:999px;background:#ffffffe0;color:#15261f}.swatch-row{display:flex;flex-wrap:wrap;gap:.65rem}.swatch-button{width:52px;height:52px;display:grid;place-items:center;padding:0;border-radius:999px;border:1px solid rgba(26,37,31,.16);background:#ffffffad;transition:transform .14s ease,border-color .14s ease}.swatch-button:hover,.swatch-button:focus-visible{transform:translateY(-1px);border-color:#1a251f57;outline:none}.swatch-button.is-active{border-width:2px;border-color:#15261f}.swatch-dot{width:36px;height:36px;border-radius:999px;box-shadow:inset 0 0 0 1px #15261f0f}.reset-swatch-dot{width:36px;height:36px;display:grid;place-items:center;border-radius:999px;background:#ffffffe0;color:#15261f;box-shadow:inset 0 0 0 1px #15261f0f}.reset-swatch-dot svg{width:17px;height:17px;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;fill:none}.button-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}.button-grid button,.export-button{border:1px solid rgba(26,37,31,.14);border-radius:999px;background:#fffdf7;color:#15261f;padding:.95rem 1rem;letter-spacing:.01em;transition:transform .14s ease,background-color .14s ease}.button-grid button:hover,.button-grid button:focus-visible,.export-button:hover,.export-button:focus-visible{transform:translateY(-1px);background:#fff;outline:none}.export-button{width:100%;background:#183d38;border-color:#183d38;color:#f7f4eb}.export-button:hover,.export-button:focus-visible{background:#21564f;border-color:#21564f;color:#f7f4eb}@media(max-width:1100px){.app-shell{grid-template-columns:1fr}.preview-frame{min-height:0}}@media(max-width:720px){.app-shell{padding:1rem;gap:1rem}.preview-shell,.control-panel{border-radius:24px}.preview-header{display:grid;grid-template-columns:1fr;grid-template-areas:"identity" "meta" "switcher";align-items:start;gap:.35rem}.preview-meta{text-align:left;white-space:normal}.title-line{flex-wrap:wrap;row-gap:.4rem}.product-link{white-space:normal}.line-nav{justify-content:flex-start}.field-grid,.button-grid{grid-template-columns:1fr}}
