/* Island Canine website-aligned visual layer.
   Behaviour Quantifier v1.5.0 application logic is unchanged. */
:root{
  --icc-cream:#f5efe6;
  --icc-paper:#fffaf5;
  --icc-paper-warm:#efe4d6;
  --icc-navy:#17394d;
  --icc-navy-soft:#244e64;
  --icc-navy-dark:#102e3e;
  --icc-clay:#c96a45;
  --icc-clay-dark:#a95437;
  --icc-gold:#d8a64e;
  --icc-text:#28373e;
  --icc-soft:#68777d;
  --icc-light:#859196;
  --icc-border:#e5d8ca;
  --icc-success:#607762;
  --icc-warning:#9c7337;
  --icc-danger:#9c5548;
  --icc-shadow:0 12px 30px rgba(23,57,77,.08);
  color:var(--icc-text);
  background:var(--icc-cream);
}
html{background:var(--icc-cream)}
body{
  color:var(--icc-text);
  background:
    radial-gradient(circle at 8% 0%,rgba(201,106,69,.07),transparent 28rem),
    linear-gradient(180deg,#faf6ef 0,var(--icc-cream) 36rem);
}
.app-shell{width:min(100%,620px);padding:18px 14px 48px}
.brand-bar{
  position:relative;
  border-bottom:1px solid rgba(201,106,69,.18);
  padding:4px 2px 15px;
  margin-bottom:16px;
}
.brand-bar:before{
  content:"";
  width:42px;height:42px;
  flex:0 0 42px;
  order:-1;
  border-radius:13px;
  background:var(--icc-paper) url('/icon-192.png') center/38px 38px no-repeat;
  border:1px solid var(--icc-border);
  box-shadow:0 4px 14px rgba(23,57,77,.08);
}
.brand-bar>div:first-of-type{flex:1;min-width:0}
.brand-bar h1,.card h2,.live-heading h2{
  color:var(--icc-navy);
  font-family:Georgia,"Times New Roman",serif;
  letter-spacing:-.02em;
}
.brand-bar h1{font-size:clamp(1.65rem,6vw,2.15rem);line-height:1.02;margin-top:3px}
.version-tag{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  padding:3px 8px;
  margin-left:4px;
  vertical-align:.17em;
  border:1px solid var(--icc-border);
  border-radius:999px;
  color:var(--icc-soft);
  background:var(--icc-paper);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.025em;
}
.eyebrow,.section-label{color:var(--icc-clay);letter-spacing:.1em}
.card,.live-heading{
  background:rgba(255,250,245,.97);
  border-color:var(--icc-border);
  box-shadow:var(--icc-shadow);
}
.card{border-radius:20px}
.live-heading{border-radius:20px}
.muted,.session-clock small,.exposure-clock small,.review-target-head small,.correction-row,.correction-field,label small{color:var(--icc-soft)}
label{color:#34474f}
input,select,textarea{
  color:var(--icc-text);
  background:#fff;
  border-color:#d8cbbb;
  box-shadow:inset 0 1px 0 rgba(23,57,77,.015);
}
input:focus,select:focus,textarea:focus{
  border-color:var(--icc-clay);
  outline:3px solid rgba(201,106,69,.16);
  outline-offset:1px;
}
.primary,.measure-chip.selected,.profile-code{
  color:#fff;
  background:var(--icc-clay);
  border-color:var(--icc-clay);
}
.primary:hover{background:var(--icc-clay-dark)}
.secondary,.mark-button,.compact-button,.correction-row button{
  color:var(--icc-navy);
  background:#fff;
  border-color:#d8cbbb;
}
.secondary:hover,.mark-button:hover,.compact-button:hover{background:#fbf5ed;border-color:#cdbdab}
.primary,.secondary,.mark-button{border-radius:999px}
.danger-link{color:var(--icc-danger)}
.connection-pill.online{color:#49644d;background:#edf3ec;border-color:#bdcdbb}
.connection-pill.offline{color:#775c31;background:#fbf1de;border-color:#ddc59a}
.session-clock.warning,.session-clock.warning span,.session-clock.warning small{color:var(--icc-danger)}
.session-clock strong,.exposure-clock strong{color:var(--icc-navy)}
.target-editor,.opportunity-live,.advanced-panel,.optional-panel,.profile-picker{
  background:#fdf9f3;
  border-color:var(--icc-border);
}
.profile-picker{background:linear-gradient(#fffaf5 0%,#f8f0e6 100%)}
.profile-picker.library-profile{border-color:#bccbbd;box-shadow:inset 4px 0 var(--icc-success)}
.library-profile{box-shadow:inset 0 3px var(--icc-navy)}
.profile-source{color:var(--icc-soft);background:#fff;border-color:var(--icc-border)}
.profile-source.library{color:#4e684f;background:#edf3ec;border-color:#bdcdbb}
.profile-source.consultation{color:var(--icc-navy-soft);background:#edf3f6;border-color:#c5d3db}
.profile-meta-row span{color:#58676d;background:#fff;border-color:var(--icc-border)}
.profile-criterion,.criteria-card{background:#fff;border-color:var(--icc-border)}
.profile-criterion strong,.advanced-panel>summary:after,.optional-panel>summary:after,.percentage-number{color:var(--icc-navy)}
.criteria-card.success{border-left-color:var(--icc-success)}
.criteria-card.simplify{border-left-color:var(--icc-warning)}
.phase-banner,.inline-info{
  color:var(--icc-navy);
  background:#edf3f6;
}
.pause-banner{
  background:#fff3d9;
  border-color:#dfbd6e;
}
.pause-banner strong{color:#6d5325}
.pause-banner span{color:#755f37}
.measure-chip,.role-chip{color:var(--icc-text);border-color:#d8cbbb;background:#fff}
.role-chip.active{color:var(--icc-navy);background:#edf3f6;border-color:var(--icc-navy-soft)}
.count-button,.duration-button,.engagement-button,.abc-mark-button{
  border-color:#d8cbbb;
  background:#fff;
  color:var(--icc-text);
  box-shadow:0 3px 10px rgba(23,57,77,.035);
}
.count-button:hover,.engagement-button:hover,.abc-mark-button:hover{border-color:#c8b8a6;background:#fffdf9}
.duration-button.active{background:#fff0e9;border-color:var(--icc-clay);color:var(--icc-clay-dark)}
.engagement-button{background:#eef4f2;border-color:#c8d7cf}
.abc-mark-button{background:#eef3f6;border-color:#cad7de}
.finish-exposure{background:var(--icc-navy);color:#fff;border-color:var(--icc-navy)}
.finish-exposure:hover{background:var(--icc-navy-dark)}
.success-opportunity{color:#49644d;background:#edf3ec;border-color:#8fa78f}
.miss-opportunity{color:#59686e;background:#f7f5f1;border-color:#b7b1a8}
.inline-warning{color:#734f26;background:#fff4dd;border-color:#e1c78f}
.warning-row{background:#fff7e7}
.readiness-card{border-color:#c7d4c6}
.quality-grid>div{background:#f7f3ed;border-color:var(--icc-border)}
.percentage-track{background:#e9dfd3}
.percentage-track>div,.chart-bar,.legend-dot{background:var(--icc-clay)}
.chart-line{stroke:var(--icc-clay)}
.chart-point{fill:var(--icc-clay)}
.timeline-marker,.behaviour-marker{background:var(--icc-clay)}
.timeline-bout,.legend-bar{background:var(--icc-navy-soft)}
.table-scroll table{background:#fff}
.table-scroll th{color:var(--icc-navy);background:#f8f1e8}
.table-scroll th,.table-scroll td{border-color:var(--icc-border)}
.pdf-status{color:var(--icc-navy);background:#edf3f6;border-color:#c5d3db}
.start-help{color:var(--icc-soft)}
::selection{background:rgba(201,106,69,.22)}
@media (max-width:520px){
  .app-shell{padding:14px 11px 42px}
  .brand-bar{align-items:flex-start;gap:10px}
  .brand-bar:before{width:38px;height:38px;flex-basis:38px;background-size:34px}
  .brand-bar h1{font-size:1.62rem}
  .version-tag{font-size:.62rem}
  .card,.live-heading{border-radius:18px;padding:15px}
}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
