/* Stake Tag Desk - Seed Tape Bench contact (appily-onehundredsix).
 * Plant stake tags in soil rack | metal ID tags | flag stakes.
 * NOT Desk Blotter, Tablet Desk, Gate Desk, Ping Lattice. */
.page-a106-stake-desk {
 overflow-x: clip;
 background:
 radial-gradient(ellipse 48% 34% at 10% 100%, rgba(42, 33, 24, 0.12), transparent 55%),
 radial-gradient(ellipse 36% 26% at 90% 0%, rgba(198, 245, 66, 0.2), transparent 50%),
 linear-gradient(180deg, var(--a106-field) 0%, #E6F1EA 40%, var(--a106-field-warm) 100%);
}

.page-a106-stake-desk .sk-stage {
 padding: clamp(28px, 5vw, 56px) 0 clamp(64px, 10vw, 96px);
 overflow-x: clip;
}

.page-a106-stake-desk .sk-kicker {
 margin: 0 0 6px;
 font-size: 0.72rem;
 font-weight: 800;
 letter-spacing: 0.16em;
 text-transform: uppercase;
 color: var(--a106-clay);
}

.page-a106-stake-desk .sk-mast h1 {
 margin: 0 0 10px;
 font-family: var(--a106-font-display);
 font-size: clamp(2rem, 5vw, 2.8rem);
 font-weight: 600;
 color: var(--a106-ink);
}

.page-a106-stake-desk .sk-mast > p {
 margin: 0;
 color: var(--a106-mute);
 max-width: 46ch;
}

.page-a106-stake-desk .sk-ref {
 margin: 10px 0 0 !important;
 font-size: 0.78rem;
 font-weight: 800;
 letter-spacing: 0.12em;
 text-transform: uppercase;
 color: var(--a106-drip);
}

.page-a106-stake-desk .sk-body { margin-top: 28px; }

.page-a106-stake-desk .sk-notice {
 margin-bottom: 18px;
 padding: 14px 16px;
 border: 3px solid var(--a106-soil);
 box-shadow: var(--a106-hard-sm);
}
.page-a106-stake-desk .sk-notice strong {
 display: block;
 margin-bottom: 4px;
 font-family: var(--a106-font-display);
 color: var(--a106-ink);
}
.page-a106-stake-desk .sk-notice p { margin: 0; color: var(--a106-mute); }
.page-a106-stake-desk .sk-notice.is-success {
 background: rgba(198, 245, 66, 0.28);
 border-color: var(--a106-ok);
}
.page-a106-stake-desk .sk-notice.is-error {
 background: #FFF0F3;
 border-color: var(--a106-err);
 color: var(--a106-err);
}
.page-a106-stake-desk .sk-notice.is-error strong { color: var(--a106-err); }

.page-a106-stake-desk .sk-layout {
 display: grid;
 grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
 gap: 24px;
 align-items: start;
}

/* Soil rack holding stake tags */
.page-a106-stake-desk .sk-rack {
 background: var(--a106-soil);
 padding: 18px;
 border: 3px solid var(--a106-soil);
 box-shadow: var(--a106-hard);
 overflow-x: clip;
 min-width: 0;
}

.page-a106-stake-desk .sk-soil {
 position: relative;
 display: grid;
 gap: 14px;
 padding: 20px 16px 16px;
 overflow-x: clip;
 background:
 repeating-linear-gradient(
 90deg,
 #3A2E22 0 2px,
 #2A2118 2px 8px
 );
 border: 3px solid #1A1510;
 opacity: 0;
 transform: translateY(10px);
 transition: opacity 480ms var(--a106-ease), transform 480ms var(--a106-ease);
}
.page-a106-stake-desk .sk-soil.is-open {
 opacity: 1;
 transform: none;
}
.page-a106-stake-desk .sk-soil-rim {
 position: absolute;
 inset: 4px;
 border: 1px dashed rgba(232, 212, 168, 0.25);
 pointer-events: none;
}

/* Plant stake tags */
.page-a106-stake-desk .sk-tag {
 position: relative;
 display: grid;
 gap: 6px;
 padding: 14px 14px 14px 22px;
 background: var(--a106-kraft);
 border: 2px solid var(--a106-soil);
 box-shadow: 3px 3px 0 rgba(0, 0, 0, 0.25);
 clip-path: polygon(12px 0, 100% 0, 100% 100%, 12px 100%, 0 50%);
 transition: box-shadow 160ms ease, transform 160ms var(--a106-ease), background 160ms ease;
}
.page-a106-stake-desk .sk-tag-tip {
 position: absolute;
 left: -2px;
 top: 50%;
 width: 14px;
 height: 14px;
 margin-top: -7px;
 background: var(--a106-sprout);
 border: 2px solid var(--a106-soil);
 clip-path: polygon(100% 0, 100% 100%, 0 50%);
 pointer-events: none;
}
.page-a106-stake-desk .sk-tag > span:not(.sk-tag-tip) {
 font-size: 0.68rem;
 font-weight: 800;
 letter-spacing: 0.1em;
 text-transform: uppercase;
 color: var(--a106-clay-deep);
}
.page-a106-stake-desk .sk-tag input,
.page-a106-stake-desk .sk-tag textarea {
 width: 100%;
 min-width: 0;
 box-sizing: border-box;
 padding: 10px 12px;
 min-height: 44px;
 border: 2px solid var(--a106-kraft-deep);
 background: rgba(255, 255, 255, 0.65);
 color: var(--a106-ink);
 font-family: var(--a106-font-body);
 font-size: 1rem;
}
.page-a106-stake-desk .sk-tag input::placeholder,
.page-a106-stake-desk .sk-tag textarea::placeholder {
 color: var(--a106-placeholder);
}
.page-a106-stake-desk .sk-tag--tall textarea { min-height: 120px; resize: vertical; }

.page-a106-stake-desk .sk-tag.is-focused {
 background: #F3E6C4;
 box-shadow: 4px 4px 0 rgba(198, 245, 66, 0.55);
 transform: translateX(4px);
}
.page-a106-stake-desk .sk-tag.is-filled {
 border-color: var(--a106-drip);
}
.page-a106-stake-desk .sk-tag.is-invalid {
 border-color: var(--a106-err);
 background: #FFF0F3;
}

.page-a106-stake-desk .sk-foot {
 display: flex;
 flex-wrap: wrap;
 align-items: center;
 justify-content: space-between;
 gap: 12px;
 margin-top: 16px;
}
.page-a106-stake-desk .sk-hours {
 margin: 0;
 font-size: 0.82rem;
 color: var(--a106-kraft);
}
.page-a106-stake-desk .sk-btn {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 min-height: 48px;
 min-width: 8.5rem;
 padding: 12px 20px;
 touch-action: manipulation;
 border: 3px solid var(--a106-sprout);
 background: var(--a106-sprout);
 color: var(--a106-sprout-ink);
 font-family: var(--a106-font-body);
 font-weight: 800;
 cursor: pointer;
 box-shadow: var(--a106-hard-sm);
 transition: transform 140ms var(--a106-ease), box-shadow 140ms ease, background 160ms ease;
}
.page-a106-stake-desk .sk-btn:hover {
 transform: translate(-1px, -1px);
 box-shadow: 4px 4px 0 #1A1510;
 background: #D4FF5C;
}
.page-a106-stake-desk .sk-btn.is-pressing {
 transform: translate(2px, 2px);
 box-shadow: 1px 1px 0 #1A1510;
}

/* Metal plant tags aside */
.page-a106-stake-desk .sk-aside-label,
.page-a106-stake-desk .sk-flag-label {
 margin: 0 0 10px;
 font-size: 0.72rem;
 font-weight: 800;
 letter-spacing: 0.12em;
 text-transform: uppercase;
 color: var(--a106-mute);
}
.page-a106-stake-desk .sk-flag-label { margin-top: 22px; }

.page-a106-stake-desk .sk-plates {
 list-style: none;
 margin: 0;
 padding: 0;
 display: grid;
 gap: 10px;
}
.page-a106-stake-desk .sk-plate {
 display: grid;
 gap: 4px;
 padding: 12px 14px;
 background: var(--a106-surface);
 border: 3px solid var(--a106-soil);
 border-left-width: 8px;
 box-shadow: var(--a106-hard-sm);
}
.page-a106-stake-desk .sk-plate--clay { border-left-color: var(--a106-clay); }
.page-a106-stake-desk .sk-plate--drip { border-left-color: var(--a106-drip); }
.page-a106-stake-desk .sk-plate--bloom { border-left-color: var(--a106-bloom); }
.page-a106-stake-desk .sk-plate--sprout { border-left-color: var(--a106-sprout); }
.page-a106-stake-desk .sk-plate--soil { border-left-color: var(--a106-soil); }
.page-a106-stake-desk .sk-plate > span {
 font-size: 0.68rem;
 font-weight: 800;
 letter-spacing: 0.1em;
 text-transform: uppercase;
 color: var(--a106-mute);
}
.page-a106-stake-desk .sk-plate strong {
 font-size: 0.95rem;
 color: var(--a106-ink);
 font-weight: 700;
 line-height: 1.35;
}
.page-a106-stake-desk .sk-plate a {
 color: var(--a106-drip-deep);
 text-decoration: none;
 font-weight: 700;
}
.page-a106-stake-desk .sk-plate a:hover { color: var(--a106-clay); text-decoration: underline; }

/* Flag stakes */
.page-a106-stake-desk .sk-flags {
 display: flex;
 flex-wrap: wrap;
 gap: 10px;
}
.page-a106-stake-desk .sk-flag {
 position: relative;
 display: inline-flex;
 align-items: center;
 padding: 10px 16px 10px 22px;
 font-weight: 800;
 font-size: 0.85rem;
 text-decoration: none;
 color: var(--a106-on-soil);
 border: 2px solid var(--a106-soil);
 clip-path: polygon(10px 0, 100% 0, 100% 100%, 10px 100%, 0 50%);
 transition: transform 140ms var(--a106-ease);
}
.page-a106-stake-desk .sk-flag:hover { transform: translateX(3px); }
.page-a106-stake-desk .sk-flag--bloom { background: var(--a106-bloom); color: var(--a106-on-bloom); }
.page-a106-stake-desk .sk-flag--drip { background: var(--a106-drip); color: var(--a106-on-drip); }
.page-a106-stake-desk .sk-flag--clay { background: var(--a106-clay); color: var(--a106-on-clay); }

@media (max-width: 900px) {
 .page-a106-stake-desk .sk-layout { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 560px) {
 .page-a106-stake-desk .sk-foot { flex-direction: column; align-items: stretch; }
 .page-a106-stake-desk .sk-btn { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
 .page-a106-stake-desk .sk-soil { transition: none; opacity: 1; transform: none; }
 .page-a106-stake-desk .sk-tag { transition: none; }
 .page-a106-stake-desk .sk-btn { transition: none; }
 .page-a106-stake-desk .sk-flag { transition: none; }
}

.page-a106-stake-desk .sk-btn:focus-visible,
.page-a106-stake-desk .sk-tag input:focus-visible,
.page-a106-stake-desk .sk-tag textarea:focus-visible,
.page-a106-stake-desk .sk-flag:focus-visible,
.page-a106-stake-desk .sk-plate a:focus-visible {
 outline: 3px solid var(--a106-sprout);
 outline-offset: 2px;
}